/* The design tokens this file used to redeclare (with !important) now live in
   assets/falaq-2026.css, which is the single palette for the site. The legacy
   service pages under /services/ carry no var() references at all — they are
   inline-styled — so removing that block changes nothing for them, and it stops
   the home page's tokens from being overridden by a stylesheet whose job is the
   hero. The base colours below are kept for the legacy pages, which load this
   file alone. */
html,
body {
  background: #03030a;
  color: #e8e8ec;
}

.aether-flow-hero {
  position: relative !important;
  display: flex !important;
  width: 100% !important;
  min-height: 760px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  overflow: hidden !important;
  padding: 118px 0 76px !important;
  background: #03030a !important;
  text-align: center !important;
  isolation: isolate;
}

/* Shared controls injected into the rich legacy service pages. The launcher
   used to inherit its layout from the agent page, which these pages do not
   load, and therefore appeared as an unstyled full-width link. */
.falaq-agent-link {
  position: fixed;
  z-index: 90;
  inset-inline-end: 20px;
  bottom: 20px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 16px 9px 9px;
  border: 1px solid rgba(77,163,255,.3);
  border-radius: 999px;
  background: rgba(7,11,20,.9);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 14px 40px rgba(0,0,0,.48);
  color: #e8e8ec;
  text-decoration: none;
  transition: border-color .2s ease,transform .2s ease;
}
html[dir="ltr"] .falaq-agent-link { padding: 9px 9px 9px 16px; }
.falaq-agent-link:hover { transform: translateY(-2px); border-color: rgba(141,214,255,.65); }
.falaq-agent-link img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.falaq-agent-link span { display: grid; gap: 1px; }
.falaq-agent-link strong { color: #f5f8ff; font-size: .85rem; font-weight: 700; }
.falaq-agent-link small { color: #8f9bb1; font-size: .72rem; }
.falaq-home-nav { display: inline-flex; min-height: 38px; align-items: center; gap: 6px; padding: 0 11px; border: 1px solid rgba(77,163,255,.22); border-radius: 10px; color: #c7d4e8; font: 600 12px 'Tajawal','Manrope',system-ui,sans-serif; text-decoration: none; }
.falaq-home-nav:hover { border-color: rgba(141,214,255,.55); color: #fff; }
.falaq-legacy-links { display: flex; align-items: center; justify-content: center; gap: clamp(14px,2vw,25px); margin-inline: auto; }
.falaq-legacy-links a { color: #9aaabd; font: 600 12px "Tajawal","Manrope",system-ui,sans-serif; text-decoration: none; transition: color .2s ease; }
.falaq-legacy-links a:hover { color: #fff; }
.falaq-agent-nav { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid rgba(110,189,255,.4); border-radius: 999px; background: rgba(26,109,255,.13); color: #e7f4ff; font: 700 12px "Tajawal","Manrope",system-ui,sans-serif; text-decoration: none; white-space: nowrap; }
.falaq-agent-nav:hover { border-color: #8dd6ff; background: rgba(26,109,255,.22); }
.falaq-legacy-menu-toggle,.falaq-legacy-menu { display: none; }
.falaq-footer-brand { display: flex !important; align-items: center !important; gap: 10px !important; }
.falaq-footer-brand strong { color: #e8eef8; font: 800 14px "Tajawal","Manrope",system-ui,sans-serif; }
.falaq-footer-mark { display: grid; width: 32px; height: 32px; place-items: center; overflow: hidden; border: 1px solid rgba(77,163,255,.34); border-radius: 9px; background: #07101e; }
.falaq-footer-mark img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.falaq-retired-brand-scene { display: none !important; }
.falaq-current-brand-scene { position: relative; display: grid; min-height: 390px; place-content: center; place-items: center; overflow: hidden; border-radius: inherit; background: radial-gradient(circle at 50% 44%,rgba(26,109,255,.18),rgba(3,7,15,.88) 58%,#03070f 76%); isolation: isolate; }
.falaq-current-brand-scene::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .28; background-image: linear-gradient(rgba(77,163,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(77,163,255,.12) 1px,transparent 1px); background-size: 34px 34px; -webkit-mask-image: radial-gradient(circle at 50% 48%,#000,transparent 72%); mask-image: radial-gradient(circle at 50% 48%,#000,transparent 72%); }
.falaq-current-brand-scene img { position: relative; z-index: 2; width: 132px !important; height: 132px !important; margin-bottom: 18px; border: 1px solid rgba(110,189,255,.36); border-radius: 32px; object-fit: cover; box-shadow: 0 0 70px rgba(26,109,255,.3); animation: falaqLogoBreathe 5s ease-in-out infinite; }
.falaq-current-brand-scene strong { position: relative; z-index: 2; color: #eef6ff; font: 800 13px/1.2 "Tajawal","Manrope",system-ui,sans-serif; letter-spacing: .14em; }
.falaq-current-brand-scene small { position: relative; z-index: 2; margin-top: 7px; color: #7187a2; font: 600 11px/1.2 "Tajawal","Manrope",system-ui,sans-serif; }
.falaq-brand-orbit { position: absolute; z-index: 1; width: 235px; height: 235px; border: 1px solid rgba(77,163,255,.17); border-radius: 50%; animation: orbitSpin 15s linear infinite; }
.falaq-brand-orbit::before { content: ""; position: absolute; top: 16%; left: 8%; width: 7px; height: 7px; border-radius: 50%; background: #8dd6ff; box-shadow: 0 0 13px #4da3ff; }
.falaq-brand-orbit.orbit-two { width: 330px; height: 330px; border-color: rgba(77,163,255,.08); animation-direction: reverse; animation-duration: 22s; }

@media (max-width: 560px) {
  .falaq-agent-link { inset-inline-end: 12px; bottom: 12px; }
  .falaq-legacy-hero-visible .falaq-agent-link { visibility: hidden; opacity: 0; transform: translateY(10px); pointer-events: none; }
  .falaq-agent-link small { display: none; }
  .falaq-home-nav span:last-child { display: none; }
}

@media (max-width: 820px) {
  #dc-root nav { gap: 10px !important; padding-inline: 14px !important; }
  #dc-root nav .falaq-service-name { display: none !important; }
  #dc-root nav .falaq-legacy-links,
  #dc-root nav .falaq-home-nav,
  #dc-root nav .falaq-trust-nav,
  #dc-root nav .falaq-agent-nav,
  #dc-root nav .falaq-legacy-actions > button:not(.falaq-legacy-menu-toggle) { display: none !important; }
  .falaq-legacy-menu-toggle { display: grid !important; width: 40px !important; height: 40px !important; padding: 10px !important; place-content: center !important; gap: 4px !important; border: 1px solid rgba(77,163,255,.3) !important; border-radius: 10px !important; background: rgba(26,109,255,.08) !important; }
  .falaq-legacy-menu-toggle span { display: block; width: 18px; height: 1.5px; border-radius: 2px; background: #dcecff; transition: transform .2s ease,opacity .2s ease; }
  .falaq-menu-open .falaq-legacy-menu-toggle span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
  .falaq-menu-open .falaq-legacy-menu-toggle span:nth-child(2) { opacity: 0; }
  .falaq-menu-open .falaq-legacy-menu-toggle span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
  #dc-root nav .falaq-legacy-menu { position: absolute; z-index: 100; top: calc(100% + 1px); inset-inline: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-height: 0; overflow: hidden; padding: 0 10px; border: 1px solid transparent; border-radius: 0 0 18px 18px; background: rgba(3,7,15,.97); opacity: 0; pointer-events: none; transform: translateY(-8px); transition: max-height .3s ease,opacity .2s ease,transform .25s ease,padding .25s ease,border-color .25s ease; }
  #dc-root nav.falaq-menu-open .falaq-legacy-menu { max-height: 360px; padding: 12px 10px; border-color: rgba(77,163,255,.18); opacity: 1; pointer-events: auto; transform: none; }
  .falaq-legacy-menu a { display: flex; min-height: 44px; align-items: center; justify-content: center; padding: 8px 10px; border: 1px solid rgba(255,255,255,.07); border-radius: 10px; color: #cbd8e8; font: 700 12px "Tajawal","Manrope",system-ui,sans-serif; text-align: center; text-decoration: none; }
  .falaq-legacy-menu a.is-agent { grid-column: 1/-1; border-color: rgba(110,189,255,.4); background: rgba(26,109,255,.15); color: #eff8ff; }
  .falaq-legacy-video-hero .falaq-legacy-hero-video { opacity: .58; object-position: 58% center; }
  .falaq-legacy-video-hero > div:has(> h1) { width: min(100% - 22px,900px) !important; padding: 26px 16px !important; border-radius: 22px; }
  .falaq-legacy-video-hero .aether-actions { width: 100% !important; gap: 9px !important; }
  .falaq-legacy-video-hero .aether-actions > * { min-width: min(100%,230px) !important; }
}

/* The particle canvas is decoration, not layout. Without absolute positioning
   its intrinsic bitmap height becomes a flex item (especially on mobile),
   pushing the headline more than a viewport below the fold. */
.aether-flow-hero > canvas.aether-canvas {
  position: absolute !important;
  z-index: 0 !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}

.hero-bg-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.85;
  -webkit-mask-image: radial-gradient(circle at 50% 50%, black 20%, transparent 85%);
  mask-image: radial-gradient(circle at 50% 50%, black 20%, transparent 85%);
}

/* Cinematic hero treatment for the seven rich legacy service pages. */
.falaq-legacy-video-hero .falaq-legacy-hero-video {
  opacity: .72;
  object-position: center center;
  filter: saturate(.72) contrast(1.12) brightness(.72) hue-rotate(-4deg);
  -webkit-mask-image: none;
  mask-image: none;
}
html[data-falaq-legacy-service="lead-qualification"] .falaq-legacy-hero-video,
html[data-falaq-legacy-service="accounts-receivable"] .falaq-legacy-hero-video { object-position: 62% center; }
html[data-falaq-legacy-service="document-processing"] .falaq-legacy-hero-video { object-position: 55% center; }
html[data-falaq-legacy-service="crm-control"] .falaq-legacy-hero-video { object-position: center 42%; }
.falaq-legacy-video-hero::after {
  background: linear-gradient(180deg,rgba(3,7,15,.72),rgba(3,7,15,.28) 38%,rgba(3,7,15,.86)),radial-gradient(circle at 50% 48%,rgba(3,7,15,.18),rgba(3,7,15,.76) 74%) !important;
}
.falaq-legacy-video-hero > div:has(> h1) {
  max-width: 900px !important;
  padding: 34px clamp(20px,4vw,46px) !important;
  border: 1px solid rgba(110,189,255,.13);
  border-radius: 28px;
  background: radial-gradient(circle at 50% 18%,rgba(10,26,48,.42),rgba(3,7,15,.24) 64%);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
.falaq-legacy-old-mark { display: none !important; }
.falaq-legacy-hero-mark {
  display: grid !important;
  width: 62px !important;
  height: 62px !important;
  margin-bottom: 15px !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 1px solid rgba(110,189,255,.44) !important;
  border-radius: 18px !important;
  background: radial-gradient(circle at 45% 24%,rgba(77,163,255,.22),rgba(3,7,15,.88)) !important;
  box-shadow: 0 0 38px rgba(26,109,255,.28) !important;
}
.falaq-legacy-hero-mark img { width: 100%; height: 100%; object-fit: cover; }
.falaq-legacy-agent-cta {
  display: inline-flex !important;
  min-height: 50px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  padding: 8px 16px 8px 10px !important;
  border: 1px solid rgba(110,189,255,.46) !important;
  border-radius: 999px !important;
  background: rgba(8,23,43,.74) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.28),0 0 24px rgba(26,109,255,.11) !important;
  color: #e8f4ff !important;
  font: 700 13px/1.2 "Tajawal","Manrope",system-ui,sans-serif !important;
  text-decoration: none !important;
  transition: transform .2s ease,border-color .2s ease,background .2s ease !important;
}
html[dir="ltr"] .falaq-legacy-agent-cta { padding: 8px 10px 8px 16px !important; }
.falaq-legacy-agent-cta:hover { transform: translateY(-2px) !important; border-color: #8dd6ff !important; background: rgba(13,35,63,.9) !important; }
.falaq-legacy-agent-cta img { width: 32px !important; height: 32px !important; border-radius: 10px !important; object-fit: cover !important; }

.hero-noise-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.75" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23n)"/></svg>');
  opacity: 0.045;
}

.aether-flow-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(circle at 50% 46%, transparent 0, rgba(3, 3, 10, .2) 50%, rgba(3, 3, 10, 1) 100%);
}

/* Remove the previous decorative hero backgrounds while preserving content. */
.aether-flow-hero > div:first-of-type,
.aether-flow-hero > .orbs,
.aether-flow-hero > .grid-bg {
  display: none !important;
}

.hero.aether-flow-hero > .grid-bg,
.hero.aether-flow-hero > .orbs {
  display: none !important;
}

.aether-flow-hero > .hero-in,
.aether-flow-hero > div:nth-of-type(2) {
  position: relative !important;
  z-index: 2 !important;
  width: min(100% - 32px, 980px) !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  text-align: center !important;
}

.aether-flow-hero .hero-mark,
.aether-flow-hero [style*="width:84px"][style*="height:84px"],
.aether-flow-hero [style*="width:88px"][style*="height:88px"] {
  display: none !important;
}

.aether-flow-hero > div:nth-of-type(2) > :first-child:not(.aether-badge):not(.falaq-legacy-hero-mark) {
  display: none !important;
}

.aether-flow-hero .eyebrow,
.aether-flow-hero .aether-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  margin: 0 0 24px !important;
  padding: 7px 16px !important;
  border: 1px solid rgba(26, 109, 255, .24) !important;
  border-radius: 999px !important;
  background: rgba(26, 109, 255, .10) !important;
  color: #e5e7eb !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  backdrop-filter: blur(8px);
  box-shadow: none !important;
}

.aether-flow-hero .eyebrow::before,
.aether-flow-hero .aether-badge::before {
  content: "ϟ";
  color: #4da3ff;
  font-size: 16px;
  line-height: 1;
}

.aether-flow-hero .eyebrow .dot {
  display: none !important;
}

.aether-flow-hero h1,
.aether-flow-hero .aether-title {
  max-width: 1050px !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  background: linear-gradient(to bottom, #fff 15%, #9ca3af 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  font-size: clamp(2.65rem, 6.4vw, 5.9rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -.055em !important;
  text-wrap: balance;
  filter: none !important;
  text-shadow: none !important;
}

html[dir="rtl"] .aether-flow-hero h1,
html[dir="rtl"] .aether-flow-hero .aether-title {
  letter-spacing: -.035em !important;
}

.aether-flow-hero h1 .grad {
  background: linear-gradient(to bottom, #fff 15%, #9ca3af 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Service headlines are longer than the homepage headline. */
.aether-flow-hero .aether-title {
  max-width: 920px !important;
  font-size: clamp(2.4rem, 4.2vw, 3.75rem) !important;
  line-height: 1.14 !important;
  letter-spacing: -.035em !important;
}

.aether-flow-hero .lead,
.aether-flow-hero .aether-copy {
  max-width: 720px !important;
  margin: 0 auto 36px !important;
  color: #9ca3af !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
  text-align: center !important;
}

.aether-flow-hero .aether-brief {
  display: block !important;
  max-width: 760px !important;
  margin: -4px auto 18px !important;
  padding: 14px 18px !important;
  border: 1px solid rgba(77, 163, 255, .16) !important;
  border-radius: 14px !important;
  background: rgba(26, 109, 255, .055) !important;
  color: #d9d6df !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.75 !important;
}

.aether-flow-hero .scroll-cue,
.aether-flow-hero .aether-scroll-cue {
  display: flex !important;
  margin-top: 28px !important;
  opacity: .85 !important;
}

.aether-flow-hero .hero-cta,
.aether-flow-hero .aether-actions {
  display: flex !important;
  justify-content: center !important;
  margin: 0 !important;
  gap: 12px !important;
}

.aether-flow-hero .hero-cta > :not(:first-child),
.aether-flow-hero .aether-actions > :not(:first-child) {
  display: inline-flex !important;
  min-height: 50px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 24px !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .035) !important;
  color: #e8e8ec !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.aether-flow-hero .hero-cta > :first-child,
.aether-flow-hero .aether-actions > :first-child,
.aether-flow-hero .aether-primary {
  display: inline-flex !important;
  min-width: 0 !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 16px 30px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 10px 30px rgba(255, 255, 255, .08) !important;
  color: #000 !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  transform: none !important;
  transition: background .3s ease, transform .3s ease !important;
}

.aether-flow-hero .hero-cta > :first-child:hover,
.aether-flow-hero .aether-actions > :first-child:hover,
.aether-flow-hero .aether-primary:hover {
  background: #e5e7eb !important;
  transform: translateY(-2px) !important;
}

.aether-flow-hero .hero-cta > :first-child::after,
.aether-flow-hero .aether-actions > :first-child::after {
  content: "→";
  font-size: 20px;
  line-height: 1;
}

html[dir="rtl"] .aether-flow-hero .hero-cta > :first-child::after,
html[dir="rtl"] .aether-flow-hero .aether-actions > :first-child::after {
  content: "←";
}

.aether-flow-hero .aether-primary > span[style],
.aether-flow-hero .hero-cta > :first-child > span:not([data-i18n]) {
  display: none !important;
}

/* Carry the Aether palette into the rest of the service pages. */
#dc-root,
#dc-root > .sc-host {
  background: #000 !important;
}

#dc-root nav {
  min-height: 64px !important;
  padding: 12px 24px !important;
  background: rgba(0, 0, 0, .78) !important;
  border-color: rgba(77, 163, 255, .16) !important;
  backdrop-filter: blur(18px) !important;
}

.falaq-service-name {
  color: #e9e7ec !important;
  font-family: "Tajawal", "Manrope", system-ui, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
  white-space: nowrap !important;
}

#dc-root nav button {
  border-color: rgba(77, 163, 255, .28) !important;
  background: rgba(26, 109, 255, .08) !important;
  box-shadow: none !important;
  color: #e5e7eb !important;
}

#dc-root nav button:last-child {
  border-color: #fff !important;
  background: #fff !important;
  color: #000 !important;
}

.nav .btn-primary {
  border-color: #fff !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #000 !important;
}

.nav .mark {
  border-color: rgba(77, 163, 255, .42) !important;
}

.nav .mark svg path {
  stroke: #4da3ff !important;
}

#dc-root section:not(.aether-flow-hero) {
  border-color: rgba(77, 163, 255, .12) !important;
}

#dc-root footer {
  background: #030303 !important;
  border-color: rgba(77, 163, 255, .14) !important;
}

body > [data-falaq-home] {
  border-color: rgba(77, 163, 255, .4) !important;
  background: rgba(3, 3, 10, .84) !important;
}

/* The home page section styling that used to live here (nav, markets, section.blk,
   sec-head, kick, agent/ind/model cards, cta, rv — all !important) moved to
   assets/home.css. It was a duplicate of the home page inline <style> that it
   happened to override, which made the real values impossible to find. This
   file now owns the hero, the robot persona and the chat surfaces only. */

/* Landing-page surfaces keep their layouts but share one glass system. */
#dc-root,
#dc-root > .sc-host {
  color: #e8e8ec !important;
  background: #03030a !important;
}

#dc-root section:not(.aether-flow-hero) {
  position: relative !important;
  background: #03030a !important;
}

#dc-root [data-reveal] {
  transition-timing-function: cubic-bezier(.22, 1, .36, 1) !important;
}

#dc-root [style*="border: 1px solid rgba(255,255,255"] {
  box-shadow: none !important;
}

#dc-root input,
#dc-root textarea,
#dc-root select {
  border-color: rgba(255, 255, 255, .09) !important;
  background: rgba(255, 255, 255, .025) !important;
  color: #e8e8ec !important;
}

#dc-root input:focus,
#dc-root textarea:focus,
#dc-root select:focus {
  border-color: rgba(77, 163, 255, .45) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(26, 109, 255, .10) !important;
}

/* Falaq helmet mark from the current brand package. */
.brand .mark,
.falaq-service-mark {
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  padding: 0 !important;
  border: 1px solid rgba(77, 163, 255, .38) !important;
  border-radius: 12px !important;
  background: radial-gradient(circle at 32% 26%, rgba(26, 109, 255, .22), transparent 60%), #0a0616 !important;
  box-shadow: 0 0 22px rgba(26, 109, 255, .18), inset 0 1px rgba(255, 255, 255, .07) !important;
  animation: none !important;
}

.falaq-brand-logo {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
  filter: saturate(.9) contrast(1.04) drop-shadow(0 0 6px rgba(77, 163, 255, .42));
  animation: falaqLogoBreathe 5s ease-in-out infinite;
}

.chat-avatar .falaq-logo-image { width: 100%; height: 100%; object-fit: cover; }

@keyframes falaqLogoBreathe {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 0 4px rgba(77, 163, 255, .35)); }
  50% { transform: scale(1.04); filter: saturate(1.03) drop-shadow(0 0 10px rgba(77, 163, 255, .62)); }
}

/* Agent constellation */
.agent-constellation {
  position: relative !important;
  display: block !important;
  height: 620px !important;
  overflow: visible !important;
  isolation: isolate;
  transition: height .9s cubic-bezier(.22, 1, .36, 1);
}

.agent-constellation.is-open {
  height: 760px !important;
}

/* Dotted grid floor directly under the robot */
.agent-orchestrator::before {
  content: "";
  position: absolute;
  left: -190px;
  right: -190px;
  top: 46%;
  bottom: -90px;
  z-index: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, rgba(255, 255, 255, .11) 1px, transparent 1px);
  background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(ellipse 50% 55% at 50% 42%, #000 35%, transparent 80%);
  mask-image: radial-gradient(ellipse 50% 55% at 50% 42%, #000 35%, transparent 80%);
  opacity: .55;
  transition: opacity .9s ease;
}

.agent-constellation.is-open .agent-orchestrator::before {
  opacity: 1;
}

.agent-threads {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

/* Faint translucent static threads — simply fade in on open */
.agent-thread {
  fill: none;
  stroke: rgba(216, 140, 255, .2);
  stroke-width: 1.4;
  stroke-linecap: round;
  filter: drop-shadow(0 0 4px rgba(26, 109, 255, .25));
  opacity: 0;
  transition: opacity .7s ease;
  transition-delay: var(--thread-delay, 0s);
}

.agent-constellation.is-open .agent-thread {
  opacity: 1;
}

.agent-node {
  --node-size: 122px;
  position: absolute !important;
  z-index: 3 !important;
  display: flex !important;
  width: var(--node-size) !important;
  min-height: 132px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  overflow: visible !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
  opacity: 0 !important;
  transform: translateY(20px) scale(.9) !important;
  pointer-events: none !important;
  transition: opacity .5s ease, transform .6s cubic-bezier(.16, 1, .3, 1) !important;
  transition-delay: var(--node-delay, 0s) !important;
}

.agent-constellation.is-open .agent-node {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}

.agent-constellation.is-open .agent-node:hover {
  transform: translateY(-5px) !important;
}

.agent-node:nth-of-type(1) { top: 30px; left: 9%; }
.agent-node:nth-of-type(2) { top: 0; left: calc(50% - 61px); }
.agent-node:nth-of-type(3) { top: 40px; right: 8%; }
.agent-node:nth-of-type(4) { top: 300px; right: 1%; }
.agent-node:nth-of-type(5) { bottom: 0; right: 22%; }
.agent-node:nth-of-type(6) { bottom: 0; left: 22%; }
.agent-node:nth-of-type(7) { top: 300px; left: 1%; }


.agent-node .glow,
.agent-node .num,
.agent-node .go,
.agent-node > .agent-node-description { display: none !important; }

.agent-node .ic {
  display: grid !important;
  width: 72px !important;
  height: 72px !important;
  margin: 0 !important;
  place-items: center !important;
  border: 1px solid rgba(77, 163, 255, .26) !important;
  border-radius: 22px !important;
  background: radial-gradient(circle at 35% 25%, rgba(77, 163, 255, .18), rgba(255, 255, 255, .025)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .06), 0 14px 35px rgba(0, 0, 0, .35), 0 0 26px rgba(26, 109, 255, .09) !important;
  color: #4da3ff !important;
  transition: transform .4s cubic-bezier(.22, 1, .36, 1), border-color .4s ease, box-shadow .4s ease !important;
}

.agent-node .ic svg { width: 33px !important; height: 33px !important; }
.agent-node:hover .ic,
.agent-node:focus-visible .ic { transform: scale(1.12) rotate(-4deg) !important; border-color: rgba(56, 189, 248, .5) !important; box-shadow: 0 0 34px rgba(56, 189, 248, .2) !important; }

.agent-node > h3 {
  max-width: 150px;
  margin: 0 !important;
  color: #d8d8df !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

.agent-hover-card {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  z-index: 20;
  display: grid;
  width: 390px;
  grid-template-columns: 92px 1fr;
  align-items: center;
  gap: 15px;
  padding: 16px;
  border: 1px solid rgba(77, 163, 255, .22);
  border-radius: 18px;
  background: rgba(8, 7, 17, .94);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .55), 0 0 45px rgba(26, 109, 255, .08);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 12px) scale(.96);
  backdrop-filter: blur(20px);
  transition: opacity .35s ease, transform .45s cubic-bezier(.22, 1, .36, 1);
}

.agent-node:hover .agent-hover-card,
.agent-node:focus-visible .agent-hover-card { opacity: 1; transform: translate(-50%, 0) scale(1); }
.agent-node:nth-of-type(5) .agent-hover-card,
.agent-node:nth-of-type(6) .agent-hover-card { top: auto; bottom: calc(100% + 14px); }

.agent-preview-robot { display: grid; height: 92px; place-items: center; border-radius: 14px; background: rgba(26, 109, 255, .07); }
.agent-preview-robot .falaq-robot-svg { width: 70px; height: 88px; }
.agent-preview-copy { display: block; text-align: start; }
.agent-preview-copy b { display: block; margin-bottom: 7px; color: #fff; font-size: .9rem; }
.agent-preview-copy > span { display: block; color: #9898a5; font-size: .76rem; line-height: 1.7; }

.agent-orchestrator {
  position: absolute;
  top: 190px;
  left: calc(50% - 120px);
  z-index: 2;
  display: flex;
  width: 240px;
  height: 350px;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.agent-orchestrator .falaq-robot-svg { position: relative; z-index: 2; width: 205px; filter: drop-shadow(0 0 22px rgba(26, 109, 255, .25)); pointer-events: auto; cursor: pointer; transition: filter .4s ease; }
.agent-orchestrator .falaq-robot-svg:hover { filter: drop-shadow(0 0 34px rgba(232, 121, 249, .45)); }
.agent-orchestrator .robot-quip { top: -30px; pointer-events: none; }
.orchestrator-orbit { position: absolute; inset: 58px 5px 48px; border: 1px solid rgba(77, 163, 255, .18); border-radius: 50%; animation: orbitSpin 12s linear infinite; }
.orchestrator-orbit::before,
.orchestrator-orbit::after { content: ""; position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #38bdf8; box-shadow: 0 0 15px #38bdf8; }
.orchestrator-orbit::before { top: 18%; left: 5%; }
.orchestrator-orbit::after { right: 8%; bottom: 15%; background: #4da3ff; box-shadow: 0 0 15px #4da3ff; }
.orchestrator-label { position: absolute; bottom: 3px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 11px; border: 1px solid rgba(77,163,255,.18); border-radius: 999px; background: rgba(26,109,255,.07); color: #777786; font: 600 9px/1.2 monospace; letter-spacing: .16em; }
.orchestrator-label i { width: 6px; height: 6px; border-radius: 50%; background: #34d399; box-shadow: 0 0 9px #34d399; animation: statusPulse 1.5s infinite; }

html[lang="ar"] .orchestrator-label,
html[lang="ar"] .wake-signal { font-family: inherit; letter-spacing: .03em; font-size: 10px; }
.falaq-trust-nav { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: #c9c3ce; font-family: inherit; font-size: 12px; font-weight: 700; text-decoration: none; transition: .2s ease; }
.falaq-trust-nav:hover { border-color: rgba(77,163,255,.5); color: #fff; }

.orchestrator-hint {
  position: absolute;
  bottom: -36px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  color: #9c9cab;
  font-size: .8rem;
  font-weight: 600;
  pointer-events: none;
}

.orchestrator-hint .arr {
  display: inline-block;
  color: #4da3ff;
  animation: hintBounce 1.8s ease-in-out infinite;
}

@keyframes hintBounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }

@keyframes orchestratorHover { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes orbitSpin { to { transform: rotate(360deg); } }
@keyframes statusPulse { 50% { opacity: .35; transform: scale(.75); } }

.falaq-robot-svg { overflow: visible; }
.robot-rig { animation: robotFloat 5.4s ease-in-out infinite; }
.robot-shadow { transform-box: fill-box; transform-origin: center; animation: shadowBreathe 5.4s ease-in-out infinite; }
.robot-eyes { transform: translate(var(--eyeX, 0px), var(--eyeY, 0px)); transition: transform .18s ease-out; }
.robot-eye { transform-box: fill-box; transform-origin: center; animation: robotBlink 4.4s ease-in-out infinite; }
.robot-eye.eye-two { animation-delay: .18s; }
.robot-core { transform-box: fill-box; transform-origin: center; animation: corePulse 2.2s ease-in-out infinite; }
.antenna-dot { animation: antennaBlink 1.6s ease-in-out infinite; }
.robot-antenna { transform-box: fill-box; transform-origin: 50% 100%; animation: antennaListen 3s ease-in-out infinite; }
.robot-arm { transform-box: fill-box; transition: transform .45s cubic-bezier(.34, 1.56, .64, 1); }
.robot-arm-left { transform-origin: 50% 10%; animation: armSwayL 4.6s ease-in-out infinite; }
.robot-arm-right { transform-origin: 50% 10%; animation: armSwayR 4.6s ease-in-out infinite; }
.robot-mouth { transform-box: fill-box; transform-origin: center; transition: opacity .3s ease, transform .3s ease; }

@keyframes robotFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }
@keyframes shadowBreathe { 0%, 100% { transform: scaleX(1); opacity: 1; } 50% { transform: scaleX(.8); opacity: .55; } }
@keyframes robotBlink { 0%, 42%, 48%, 100% { transform: scaleY(1); } 45% { transform: scaleY(.08); } }
@keyframes corePulse { 0%, 100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.14); opacity: 1; } }
@keyframes antennaBlink { 0%, 100% { opacity: .4; } 50% { opacity: 1; } }
@keyframes antennaListen { 0%, 100% { transform: rotate(-2.5deg); } 50% { transform: rotate(3deg); } }
@keyframes armSwayL { 0%, 100% { transform: rotate(2.5deg); } 50% { transform: rotate(-6deg); } }
@keyframes armSwayR { 0%, 100% { transform: rotate(-2.5deg); } 50% { transform: rotate(6deg); } }

/* Click reaction: jump + arms up */
.robot-cheer .robot-rig { animation: robotJump .95s cubic-bezier(.34, 1.56, .64, 1); }
.robot-cheer .robot-arm-left { animation: none; transform: rotate(-38deg); }
.robot-cheer .robot-arm-right { animation: none; transform: rotate(38deg); }
.robot-cheer .robot-mouth { opacity: 1; transform: scale(1.3); }
.robot-cheer .antenna-dot { animation-duration: .4s; }
@keyframes robotJump { 0% { transform: translateY(0); } 32% { transform: translateY(-26px); } 58% { transform: translateY(0); } 74% { transform: translateY(-10px); } 100% { transform: translateY(0); } }

/* Talking state while a quip bubble is visible */
.robot-talking .robot-mouth { opacity: 1; animation: mouthTalk .5s ease-in-out infinite; }
@keyframes mouthTalk { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(1.7); } }

/* Speech bubble */
.robot-quip {
  position: absolute;
  z-index: 30;
  left: 50%;
  top: -18px;
  width: max-content;
  max-width: 250px;
  padding: 10px 16px;
  border: 1px solid rgba(232, 121, 249, .32);
  border-radius: 16px;
  background: rgba(13, 8, 22, .93);
  box-shadow: 0 16px 44px rgba(0, 0, 0, .5), 0 0 26px rgba(26, 109, 255, .16);
  backdrop-filter: blur(12px);
  color: #f1e7ff;
  font-size: .8rem;
  font-weight: 600;
  line-height: 1.7;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 10px) scale(.92);
  transition: opacity .35s ease, transform .5s cubic-bezier(.22, 1, .36, 1);
}
.robot-quip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 7px solid transparent;
  border-top-color: rgba(232, 121, 249, .32);
}
.robot-quip.show { opacity: 1; transform: translate(-50%, 0) scale(1); }
.robot-quip .q-dots { display: inline-flex; gap: 4px; padding: 4px 2px; vertical-align: middle; }
.robot-quip .q-dots i { width: 5px; height: 5px; border-radius: 50%; background: #e879f9; animation: typingDot 1.1s infinite; }
.robot-quip .q-dots i:nth-child(2) { animation-delay: .15s; }
.robot-quip .q-dots i:nth-child(3) { animation-delay: .3s; }

/* Scroll-awakened Falaq Bot */
.falaq-bot-section { overflow: hidden; }
.falaq-bot-heading { max-width: 700px !important; }
.custom-bot-shell { position: relative; display: grid; min-height: 650px; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 36px; }
.bot-awakening-stage { position: relative; display: grid; min-height: 560px; place-items: center; perspective: 1000px; }
.bot-floor-ring { position: absolute; bottom: 60px; width: 310px; height: 80px; border: 1px solid rgba(77,163,255,.2); border-radius: 50%; background: radial-gradient(ellipse, rgba(26,109,255,.13), transparent 67%); transform: rotateX(68deg); animation: floorSignal 3s ease-in-out infinite; }
.seated-falaq-robot { position: relative; z-index: 2; width: 250px; transform: translateY(60px) scale(.86); transform-origin: center bottom; transition: transform 1.2s cubic-bezier(.22,1,.36,1), filter 1.2s ease; filter: saturate(.5) brightness(.6); cursor: pointer; }
.seated-falaq-robot .falaq-robot-svg { width: 100%; }
.wake-signal { position: absolute; top: 38px; display: inline-flex; align-items: center; gap: 8px; color: #555564; font: 600 9px/1 monospace; letter-spacing: .17em; opacity: .65; transition: opacity .5s ease; }
.wake-signal i { width: 7px; height: 7px; border-radius: 50%; background: #5a5a68; }
.is-awake .seated-falaq-robot { transform: translateY(0) scale(1); filter: saturate(1) brightness(1); }
.is-awake .wake-signal { opacity: 1; color: #4da3ff; }
.is-awake .wake-signal i { background: #34d399; box-shadow: 0 0 10px #34d399; animation: statusPulse 1.4s infinite; }
.bot-awakening-stage .robot-quip { top: 72px; }
@keyframes floorSignal { 50% { transform: rotateX(68deg) scale(1.08); opacity: .45; } }

.falaq-chat-panel { position: relative; display: flex; overflow: hidden; min-height: 620px; flex-direction: column; border: 1px solid rgba(255,255,255,.05); border-top: 1px solid rgba(255,255,255,.12); border-radius: 24px; background: linear-gradient(180deg,rgba(16,12,27,.60),rgba(7,6,13,.85)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 35px 90px rgba(0,0,0,.45); opacity: .2; transform: translateX(-60px) scale(.96); transition: opacity 1s ease .55s, transform 1.2s cubic-bezier(.22,1,.36,1) .45s; }
html[dir="ltr"] .falaq-chat-panel { transform: translateX(60px) scale(.96); }
.is-awake .falaq-chat-panel { opacity: 1; transform: translateX(0) scale(1) !important; }
.bot-preview-badge { padding: 10px 18px; border-bottom: 1px solid rgba(255,255,255,.06); background: rgba(26,109,255,.07); color: #b5afbd; font-size: .76rem; font-weight: 650; text-align: center; }
.chat-top { display: flex; align-items: center; gap: 13px; padding: 17px 20px; border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(255,255,255,.02); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.chat-avatar { display: grid; width: 48px; height: 48px; place-items: center; overflow: hidden; border-radius: 50%; background: transparent; }
.chat-avatar .falaq-robot-svg { width: 45px; height: 54px; transform: translateY(5px); }
.chat-avatar .robot-shadow { display: none; }
.chat-avatar .falaq-avatar { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; mix-blend-mode: screen; }
.chat-top b { display: block; color: #fff; font-size: 1rem; }
.chat-top small { display: flex; align-items: center; gap: 7px; margin-top: 4px; color: #a39eaa; font-size: .75rem; }
.chat-top small i { width: 6px; height: 6px; border-radius: 50%; background: #34d399; box-shadow: 0 0 8px #34d399; }
.falaq-chat-messages { display: flex; height: 335px; flex: 1 1 335px; flex-direction: column; gap: 14px; overflow-y: auto; padding: 22px; scroll-behavior: smooth; }
.bot-message,
.user-message { display: flex; max-width: 86%; align-items: flex-start; gap: 10px; animation: messageArrive .45s cubic-bezier(.22,1,.36,1) both; }
.user-message { align-self: flex-end; }
.bot-message p,
.user-message p { margin: 0; padding: 12px 15px; border: 1px solid rgba(255,255,255,.075); border-radius: 16px; background: rgba(255,255,255,.045); color: #ddd9e2; font-size: .9rem; line-height: 1.72; }
.user-message p { border-color: rgba(26,109,255,.22); background: rgba(26,109,255,.10); color: #ececf1; }
.mini-bot { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; overflow: hidden; border-radius: 50%; background: transparent; }
.mini-bot .falaq-robot-svg { width: 30px; height: 38px; transform: translateY(3px); }
.mini-bot .falaq-avatar { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; mix-blend-mode: screen; }
.mini-bot .robot-rig { animation: none; }
.mini-bot .robot-shadow { display: none; }
/* Avatar in the awakening stage — larger, with glow */
.falaq-avatar-lg { width: 160px; height: 160px; border-radius: 50%; border: none; box-shadow: 0 0 60px rgba(26,109,255,.25); mix-blend-mode: screen; animation: stBreathe 6s ease-in-out infinite; }
@keyframes stBreathe { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-7px) scale(1.012); } }
.bot-typing > span:last-child { display: flex; gap: 4px; padding: 14px; }
.bot-typing > span:last-child i { width: 5px; height: 5px; border-radius: 50%; background: #4da3ff; animation: typingDot 1.2s infinite; }
.bot-typing > span:last-child i:nth-child(2) { animation-delay: .15s; }
.bot-typing > span:last-child i:nth-child(3) { animation-delay: .3s; }
.bot-suggestions { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 20px 14px; }
.bot-suggestions button { min-height: 36px; padding: 8px 12px; border: 1px solid rgba(77,163,255,.20); border-radius: 10px; background: rgba(26,109,255,.075); color: #c4bec9; font: 600 .78rem/1.3 inherit; cursor: pointer; transition: .25s ease; }
.bot-suggestions button:hover { border-color: rgba(77,163,255,.38); color: #fff; transform: translateY(-2px); }
.bot-suggestions button:disabled { cursor: wait; opacity: .5; }
.bot-input-row { display: grid; grid-template-columns: 1fr auto; gap: 9px; padding: 0 20px 20px; }
.bot-input-row[hidden] { display: none; }
.bot-input-row input { min-width: 0; min-height: 50px; padding: 13px 15px; border: 1px solid rgba(255,255,255,.11); border-radius: 12px; background: rgba(255,255,255,.035); color: #fff; font: 500 .88rem/1.3 inherit; outline: none; }
.bot-input-row input:focus { border-color: rgba(77,163,255,.4); box-shadow: 0 0 0 3px rgba(26,109,255,.08); }
.bot-input-row button { min-width: 76px; padding: 0 18px; border: 0; border-radius: 12px; background: #fff; color: #05050d; font: 800 .84rem/1 inherit; cursor: pointer; transition: transform .25s ease, background .25s ease; }
.bot-input-row button:hover { transform: translateY(-2px); background: #e8e8ec; }
.bot-input-row button:disabled { cursor: wait; opacity: .55; transform: none; }
.bot-contact-gate { margin: 0 20px 20px; padding: 16px; border: 1px solid rgba(77,163,255,.16); border-radius: 16px; background: rgba(26,109,255,.055); }
.bot-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.bot-contact-grid label { display: grid; gap: 6px; color: #c9c3ce; font-size: .74rem; font-weight: 700; }
.bot-contact-grid input { min-width: 0; padding: 11px 12px; border: 1px solid rgba(255,255,255,.11); border-radius: 10px; outline: none; background: rgba(3,3,10,.62); color: #fff; font: 500 .82rem/1.3 inherit; }
.bot-contact-grid input:focus { border-color: rgba(77,163,255,.45); box-shadow: 0 0 0 3px rgba(26,109,255,.08); }
.bot-contact-gate > button { width: 100%; min-height: 42px; margin-top: 10px; border: 0; border-radius: 10px; background: linear-gradient(180deg,#4da3ff,#1a6dff); color: #14081f; font: 800 .76rem/1 inherit; cursor: pointer; }
.bot-contact-gate > button:disabled { cursor: wait; opacity: .6; }
.bot-contact-error { min-height: 17px; margin: 7px 0 0; color: #fca5a5; font-size: .76rem; }
.bot-download-card { align-self: stretch; margin: 2px 2px 6px 46px; padding: 15px; border: 1px solid rgba(77,163,255,.22); border-radius: 15px; background: linear-gradient(135deg,rgba(26,109,255,.12),rgba(255,255,255,.025)); }
html[dir="rtl"] .bot-download-card { margin: 2px 46px 6px 2px; }
.bot-download-card strong,.bot-download-card span { display: block; }
.bot-download-card strong { color: #f3e8ff; font-size: .79rem; line-height: 1.6; }
.bot-download-card span { margin: 3px 0 11px; color: #777786; font: 500 .62rem/1.3 monospace; }
.bot-download-card a { display: flex; min-height: 40px; align-items: center; justify-content: center; border-radius: 10px; background: #fff; color: #13081d; font-size: .73rem; font-weight: 800; text-decoration: none; }

/* Reusable service-page bot */
body.bot-modal-open { overflow: hidden !important; }
.falaq-floating-launcher { position: fixed; z-index: 950; inset-inline-end: 22px; bottom: 22px; display: flex; align-items: center; gap: 11px; min-height: 68px; padding: 8px 15px 8px 8px; border: 1px solid rgba(77,163,255,.34); border-radius: 18px; background: rgba(10,7,18,.96); box-shadow: 0 18px 55px rgba(0,0,0,.48),0 0 28px rgba(26,109,255,.14); color: #f3e8ff; font: 700 .78rem/1.35 inherit; cursor: pointer; backdrop-filter: blur(16px); transition: transform .25s ease,border-color .25s ease; }
html[dir="rtl"] .falaq-floating-launcher { padding: 8px 8px 8px 15px; }
.falaq-floating-launcher:hover { transform: translateY(-4px); border-color: rgba(232,121,249,.72); }
.floating-bot-robot { display: grid; width: 52px; height: 52px; flex: 0 0 52px; place-items: center; overflow: hidden; border: 1px solid rgba(77,163,255,.18); border-radius: 14px; background: linear-gradient(145deg,#241438,#090611 72%); }
.floating-bot-robot .falaq-robot-svg { width: 48px; height: 58px; transform: translateY(5px); }
.floating-bot-robot .robot-shadow { display: none; }
.floating-bot-label { display: grid; max-width: 170px; gap: 2px; text-align: start; }
.floating-bot-label strong { color: #f5f0fa; font-size: .8rem; }
.floating-bot-label small { color: #9e97a5; font-size: .66rem; font-weight: 500; }
.falaq-floating-overlay { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(3,3,10,.78); backdrop-filter: blur(10px); }
.falaq-floating-overlay[hidden] { display: none; }
.falaq-floating-dialog { position: relative; width: min(540px,100%); max-height: calc(100dvh - 40px); }
.floating-bot-close { position: absolute; z-index: 5; top: 13px; inset-inline-end: 13px; display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(255,255,255,.10); border-radius: 50%; background: rgba(3,3,10,.75); color: #d6cedd; font: 400 22px/1 Arial,sans-serif; cursor: pointer; }
.floating-bot-close:hover { border-color: rgba(77,163,255,.5); color: #fff; }
.falaq-floating-bot .falaq-chat-panel { width: 100%; min-height: 620px; max-height: calc(100dvh - 40px); opacity: 1; transform: none !important; background: linear-gradient(180deg,#100b1a,#08070d); box-shadow: 0 35px 100px rgba(0,0,0,.65); }
.falaq-floating-bot .bot-preview-badge { padding-inline: 55px; }
.falaq-floating-bot .chat-top { padding-inline-end: 58px; }
.falaq-floating-bot .falaq-chat-messages { height: 350px; }
@keyframes messageArrive { from { opacity: 0; transform: translateY(10px) scale(.98); } }
@keyframes typingDot { 0%,80%,100% { transform: scale(.6); opacity: .4; } 40% { transform: scale(1); opacity: 1; } }

/* Every landing-page surface keeps breathing without overriding its bespoke demos. */
.aether-live-surface { animation: liveSurfaceFloat 7s ease-in-out infinite var(--live-delay) !important; }
.aether-live-surface:hover { animation-play-state: paused !important; filter: brightness(1.08); }
.aether-live-icon { transform-box: fill-box; transform-origin: center; animation: liveIconPulse 4.8s ease-in-out infinite var(--icon-delay) !important; }
.aether-flip-card:hover,
.aether-flip-card:focus-visible,
.aether-flip-card.is-flipped { transform: rotateY(180deg) !important; }
@keyframes liveSurfaceFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes liveIconPulse { 0%,100% { transform: translateY(0) rotate(0); filter: drop-shadow(0 0 0 rgba(26,109,255,0)); } 50% { transform: translateY(-3px) rotate(2deg); filter: drop-shadow(0 0 6px rgba(26,109,255,.35)); } }

@media (max-width: 700px) {
  .falaq-trust-nav { padding-inline: 10px; font-size: 0; }
  .falaq-trust-nav::after { content: "الثقة"; font-size: 11px; }
  html[lang="en"] .falaq-trust-nav::after { content: "Trust"; }
  .aether-flow-hero {
    min-height: auto !important;
    padding: 64px 0 48px !important;
  }

  #dc-root nav {
    min-height: 56px !important;
    padding: 8px 12px !important;
  }

  #dc-root nav > div:first-child { gap: 8px !important; }
  #dc-root nav > div:first-child > div:first-child {
    width: 34px !important;
    height: 34px !important;
    border-radius: 8px !important;
  }
  #dc-root nav > div:last-child { gap: 6px !important; }
  #dc-root nav button:last-child {
    min-height: 36px !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  .aether-flow-hero > .hero-in,
  .aether-flow-hero > div:nth-of-type(2) {
    width: min(100% - 16px, 980px) !important;
    padding: 18px !important;
  }

  .aether-flow-hero h1,
  .aether-flow-hero .aether-title {
    font-size: clamp(2.25rem, 12vw, 3.8rem) !important;
    line-height: 1.12 !important;
  }

  .aether-flow-hero .aether-title {
    font-size: clamp(2rem, 9vw, 2.8rem) !important;
    line-height: 1.15 !important;
  }

  .aether-flow-hero .lead,
  .aether-flow-hero .aether-copy {
    margin-bottom: 28px !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
  }

  .aether-flow-hero .aether-brief {
    margin-bottom: 8px !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  .aether-flow-hero .hero-cta,
  .aether-flow-hero .aether-actions {
    width: 100% !important;
  }

  .aether-flow-hero .hero-cta > *,
  .aether-flow-hero .aether-actions > * {
    width: min(100%, 330px) !important;
  }

  section.blk { padding-block: 64px !important; }
  .sec-head { margin-bottom: 34px !important; }

  .agent-constellation,
  .agent-constellation.is-open { display: grid !important; height: auto !important; overflow: clip !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 12px !important; }
  .agent-constellation:not(.is-open) .agent-node { display: none !important; }
  .agent-threads { display: none; }
  .agent-orchestrator { position: relative; top: auto; left: auto; width: min(220px,100%); height: 300px; grid-column: 1 / -1; grid-row: 1; justify-self: center; order: -1; }
  .agent-orchestrator .falaq-robot-svg { width: 170px; }
  .orchestrator-hint { bottom: 0; width: min(280px,calc(100vw - 40px)); justify-content: center; white-space: normal; text-align: center; }
  .agent-node { position: relative !important; inset: auto !important; width: 100% !important; min-height: 112px !important; padding: 16px 14px !important; }
  .agent-node .ic { width: 42px; height: 42px; }
  .agent-node h3 { font-size: .95rem; line-height: 1.4; }
  .agent-node .agent-node-description { display: none; }
  .agent-node .go { font-size: .78rem; }
  .agent-node:nth-of-type(n) { top: auto; right: auto; bottom: auto; left: auto; }
  .agent-hover-card { position: fixed; top: auto !important; right: 14px; bottom: 14px !important; left: 14px; width: auto; transform: translateY(20px) scale(.97); }
  .agent-node:hover .agent-hover-card,
  .agent-node:focus-visible .agent-hover-card { transform: translateY(0) scale(1); }
  .custom-bot-shell { min-height: 0; grid-template-columns: minmax(0,1fr); gap: 20px; }
  .custom-bot-shell > * { min-width: 0; }
  .bot-awakening-stage { min-height: 230px; }
  .bot-floor-ring { bottom: 20px; width: min(280px,90%); }
  .seated-falaq-robot { width: 170px; }
  .wake-signal { top: 8px; }
  .bot-awakening-stage .robot-quip { top: 42px; }
  .falaq-chat-panel { width: 100%; min-width: 0; min-height: 520px; border-radius: 18px; }
  .falaq-chat-messages { height: 250px; padding: 16px; }
  .bot-suggestions { padding-inline: 14px; }
  .bot-input-row { padding: 0 14px 14px; }
  .bot-contact-grid { grid-template-columns: 1fr; }
  .falaq-floating-launcher { inset-inline-end: 14px; bottom: 14px; min-height: 58px; padding: 5px; }
  .floating-bot-robot { width: 48px; height: 48px; flex-basis: 48px; }
  .floating-bot-label { display: none; }
  .falaq-floating-overlay { align-items: end; padding: 0; }
  .falaq-floating-dialog { width: 100%; max-height: 96dvh; }
  .falaq-floating-bot .falaq-chat-panel { min-height: 0; height: 96dvh; max-height: 96dvh; border-radius: 22px 22px 0 0; }
  .falaq-floating-bot .falaq-chat-messages { height: auto; min-height: 240px; flex: 1; }
}

/* Click-to-explain enhancement for the seven original rich service pages. */
.falaq-legacy-workflow-step {
  cursor: pointer;
  border-radius: 18px !important;
  transition: transform .22s ease, filter .22s ease, box-shadow .22s ease, opacity .22s ease !important;
}
.falaq-legacy-workflow-step:hover,
.falaq-legacy-workflow-step:focus-visible {
  transform: translateY(-3px) !important;
  filter: brightness(1.08);
  outline: 2px solid rgba(141,214,255,.68) !important;
  outline-offset: 4px !important;
}
.falaq-legacy-workflow-step.is-past { opacity: .76 !important; }
.falaq-legacy-workflow-step.is-active {
  filter: brightness(1.12) saturate(1.08);
  box-shadow: 0 0 0 1px rgba(141,214,255,.28),0 0 38px rgba(77,163,255,.24) !important;
}
.falaq-legacy-workflow-step.is-pinging { animation: falaqWorkflowPing .62s ease both !important; }
@keyframes falaqWorkflowPing {
  0% { box-shadow: 0 0 0 0 rgba(77,163,255,.5),0 0 20px rgba(77,163,255,.2); }
  75% { box-shadow: 0 0 0 16px rgba(77,163,255,0),0 0 46px rgba(77,163,255,.34); }
  100% { box-shadow: 0 0 0 1px rgba(141,214,255,.28),0 0 38px rgba(77,163,255,.24); }
}
.falaq-workflow-explain {
  max-width: 760px;
  margin: 34px auto 0;
  padding: 22px 24px;
  border: 1px solid rgba(77,163,255,.32);
  border-radius: 16px;
  background: radial-gradient(circle at 90% 0,rgba(77,163,255,.14),transparent 42%),rgba(10,15,27,.82);
  box-shadow: inset 3px 0 rgba(77,163,255,.65);
  text-align: start;
}
html[dir="rtl"] .falaq-workflow-explain { box-shadow: inset -3px 0 rgba(77,163,255,.65); }
.falaq-workflow-explain > span { display: block; margin-bottom: 7px; color: #8dd6ff; font-size: .72rem; font-weight: 800; }
.falaq-workflow-explain strong { display: block; color: #fff; font-size: 1rem; }
.falaq-workflow-explain p { margin: 7px 0 0; color: #b3b3bf; font-size: .88rem; line-height: 1.75; }
.falaq-workflow-close { display: none; position: absolute; top: 10px; inset-inline-end: 10px; width: 32px; height: 32px; align-items: center; justify-content: center; border: 1px solid rgba(141,214,255,.26); border-radius: 50%; background: #101827; color: #fff; font-size: 1.1rem; cursor: pointer; }

@media (max-width: 640px) {
  .falaq-workflow-explain { position: fixed; z-index: 100010; inset-inline: 12px; bottom: 12px; max-height: min(46dvh,360px); margin: 0; padding: 22px; padding-inline-end: 52px; overflow-y: auto; opacity: 0; translate: 0 calc(100% + 24px); pointer-events: none; box-shadow: 0 24px 70px rgba(0,0,0,.75),inset 3px 0 rgba(77,163,255,.65); transition: opacity .22s ease,translate .22s ease; }
  html[dir="rtl"] .falaq-workflow-explain { box-shadow: 0 24px 70px rgba(0,0,0,.75),inset -3px 0 rgba(77,163,255,.65); }
  .falaq-workflow-explain.is-open { opacity: 1; translate: 0 0; pointer-events: auto; }
  .falaq-workflow-close { display: flex; }
}

@media (max-width: 420px) {
  .falaq-trust-nav { display: none !important; }
  .falaq-service-name { font-size: .875rem !important; }
  .aether-flow-hero > .hero-in,
  .aether-flow-hero > div:nth-of-type(2) { width: calc(100% - 20px) !important; padding: 14px !important; }
  .aether-flow-hero h1 { font-size: clamp(2rem,10.5vw,2.65rem) !important; }
  .aether-flow-hero .lead { margin-bottom: 20px !important; font-size: 15px !important; }
  .agent-orchestrator { grid-column: 1 / -1; }
  .agent-node { min-height: 104px !important; }
  .agent-hover-card { display: none !important; }
  .falaq-chat-panel { min-height: 500px; }
}

@media (hover: none), (pointer: coarse) {
  .agent-hover-card { display: none !important; }
}

:is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid #4da3ff !important;
  outline-offset: 3px;
}

/* Keep the mobile overrides after the shared hero rules so the cinematic crop
   and stacked actions are not undone by the desktop declarations above. */
@media (max-width: 820px) {
  #dc-root nav button.falaq-legacy-menu-toggle { display: grid !important; border-color: rgba(77,163,255,.3) !important; background: rgba(8,19,34,.96) !important; color: #dcecff !important; box-shadow: none !important; }
  #dc-root nav button.falaq-legacy-menu-toggle span { display: block !important; background: #dcecff !important; }
  .falaq-legacy-video-hero .falaq-legacy-hero-video { opacity: .58; object-position: 58% center; }
  .falaq-legacy-video-hero > div:has(> h1) { width: min(100% - 22px,900px) !important; padding: 26px 16px !important; border-radius: 22px; }
  .falaq-legacy-video-hero .aether-actions { width: 100% !important; gap: 9px !important; }
  .falaq-legacy-video-hero .aether-actions > * { min-width: min(100%,230px) !important; }
}

@media (prefers-reduced-motion: reduce) {
  .aether-flow-hero *,
  .aether-flow-hero *::before,
  .aether-flow-hero *::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }

  .agent-node,
  .agent-thread,
  .agent-orchestrator .falaq-robot-svg,
  .falaq-logo-image,
  .falaq-current-brand-scene img,
  .falaq-brand-orbit,
  .falaq-legacy-workflow-step,
  .aether-live-surface,
  .aether-live-icon,
  .falaq-robot-svg * {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}