:root {
  --apps-purple: #6537e8;
  --apps-purple-dark: #4920bd;
  --apps-ink: #18213a;
  --apps-blue: #2e6df6;
  --apps-bg: #f5f7fc;
  --apps-card: #ffffff;
  --apps-line: #e2e6f0;
  --apps-muted: #6b7489;
}

.apps-modern {
  background: var(--apps-bg);
  color: var(--apps-ink);
}

.apps-modern .announcement {
  background: linear-gradient(90deg, var(--apps-purple-dark), var(--apps-purple));
}

.apps-modern .announcement strong { color: #fff; }
.apps-modern .announcement span { color: #eee9ff; }

.apps-modern .site-header {
  background: rgba(255, 255, 255, .94);
  border-bottom-color: #e7e9f1;
  box-shadow: 0 8px 30px rgba(28, 34, 60, .06);
}

.apps-modern .header-inner { min-height: 76px; }
.apps-modern .brand-mark { border-radius: 13px; background: var(--apps-purple); }
.apps-modern .brand-copy strong { color: var(--apps-ink); }
.apps-modern .main-nav { gap: 23px; color: #41495d; }
.apps-modern .main-nav a:hover { color: var(--apps-purple); border-color: var(--apps-purple); }
.apps-modern .lang-link { border-color: var(--apps-line); border-radius: 10px; }
.apps-modern .header-cta { border: 0; border-radius: 10px; background: var(--apps-purple); box-shadow: 0 8px 20px rgba(101,55,232,.22); }
.apps-modern .header-cta b { color: #fff; }
.mobile-nav-toggle { width: 43px; height: 43px; padding: 10px; display: none; place-content: center; gap: 5px; border: 1px solid #dfe3ec; border-radius: 10px; background: #fff; cursor: pointer; }
.mobile-nav-toggle i { width: 20px; height: 2px; display: block; border-radius: 4px; background: var(--apps-ink); transition: transform .2s, opacity .2s; }
.mobile-nav-toggle.is-open i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mobile-nav-toggle.is-open i:nth-child(2) { opacity: 0; }
.mobile-nav-toggle.is-open i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.apps-modern .hero {
  background: linear-gradient(180deg, #fbfaff 0%, #f3f0ff 100%);
  background-image: radial-gradient(circle at 80% 20%, rgba(119,80,241,.16), transparent 28%), radial-gradient(circle at 18% 84%, rgba(46,109,246,.1), transparent 25%);
}

.apps-modern .hero::before { display: none; }
.apps-modern .hero-grid { min-height: 640px; padding: 72px 0 48px; gap: 65px; }
.apps-modern .eyebrow { padding: 8px 13px; border: 1px solid #ded5ff; border-radius: 30px; background: #f1edff; color: var(--apps-purple-dark); }
.apps-modern .eyebrow::before { width: 8px; height: 8px; border-radius: 50%; background: #7b51ed; }
.apps-modern .hero h1 { margin: 22px 0; font-size: clamp(50px, 5.7vw, 78px); line-height: 1.06; letter-spacing: -.05em; }
.apps-modern .hero h1 em { margin-top: 8px; color: var(--apps-purple); }
.apps-modern .hero-copy > p { max-width: 690px; color: #5f687b; font-size: 16px; line-height: 1.9; }
.apps-modern .primary-btn,
.apps-modern .secondary-btn { min-height: 54px; border-radius: 11px; font-size: 13px; }
.apps-modern .primary-btn { border: 0; background: var(--apps-purple); color: #fff; box-shadow: 0 11px 25px rgba(101,55,232,.25); }
.apps-modern .secondary-btn { border-color: #d8dce7; background: #fff; }
.apps-modern .hero-trust div { border-color: #d9d5e8; }
.apps-modern .hero-trust strong { color: var(--apps-purple); }

.apps-modern .hero-art { min-height: 470px; }
.apps-modern .art-card {
  inset: 35px 25px 35px 25px;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 26px;
  background: linear-gradient(145deg, #22134e, #4f25c0 70%, #6338df);
  box-shadow: 0 30px 70px rgba(47,31,96,.25);
  transform: none;
}
[dir="ltr"] .apps-modern .art-card { transform: none; }
.apps-modern .art-photo { height: 280px; border-radius: 18px; background: linear-gradient(145deg, #8967f0, #6135da); }
.apps-modern .art-photo::before { background: #5be0d0; opacity: .92; }
.apps-modern .art-photo::after { background: #ffb55f; opacity: .95; }
.apps-modern .art-progress::before { width: 100%; background: #8dffba; }
.apps-modern .art-progress b { color: #8dffba; }
.apps-modern .back-tile { border: 0; border-radius: 20px; box-shadow: 0 20px 45px rgba(40,30,80,.12); }
.apps-modern .tile-one { background: #ffd99a; }
.apps-modern .tile-two { background: #c9bbff; }
.apps-modern .art-badge { border: 0; border-radius: 12px; box-shadow: 0 14px 35px rgba(35,30,65,.16); }
.apps-modern .art-file { position: absolute; z-index: 3; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.38); background: rgba(255,255,255,.9); color: #3e248a; font-size: 12px; font-weight: 900; box-shadow: 0 15px 30px rgba(35,20,85,.24); }
.apps-modern .file-image { width: 96px; height: 118px; top: 55px; inset-inline-start: 75px; border-radius: 15px; transform: rotate(-8deg); }
.apps-modern .file-video { width: 118px; height: 83px; bottom: 46px; inset-inline-end: 55px; border-radius: 15px; color: #fff; background: #1b2440; transform: rotate(7deg); font-size: 25px; }
.apps-modern .format-row { min-height: 70px; border-color: #dedbea; }

.apps-directory { padding: 95px 0 85px; background: #fff; }
.apps-heading { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 45px; }
.apps-kicker { color: var(--apps-purple); font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.apps-heading h2 { margin: 12px 0 10px; font-size: clamp(38px, 4.7vw, 58px); line-height: 1.17; letter-spacing: -.045em; }
.apps-heading p { max-width: 680px; margin: 0; color: var(--apps-muted); font-size: 13px; line-height: 1.85; }
.apps-security { min-width: 230px; padding: 15px 17px; display: flex; align-items: center; gap: 13px; border: 1px solid #dfe4ee; border-radius: 14px; background: #f9fafc; }
.apps-security > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; background: #e7fff4; color: #097d55; font-size: 22px; }
.apps-security b,.apps-security small { display: block; }
.apps-security b { font-size: 11px; }
.apps-security small { margin-top: 4px; color: var(--apps-muted); font-size: 8px; }

.apps-browser { margin-top: 38px; padding: 26px; border: 1px solid var(--apps-line); border-radius: 22px; background: #f8f9fc; box-shadow: 0 25px 65px rgba(37,45,72,.08); }
.apps-toolbar { display: grid; grid-template-columns: minmax(270px, .8fr) 1.5fr; gap: 18px; align-items: center; }
.apps-search { position: relative; display: flex; align-items: center; min-height: 54px; border: 1px solid #d8ddea; border-radius: 12px; background: #fff; overflow: hidden; }
.apps-search > span { padding-inline-start: 17px; color: var(--apps-purple); font-size: 25px; }
.apps-search input { width: 100%; height: 52px; padding: 0 13px; border: 0; outline: 0; background: transparent; color: var(--apps-ink); font-size: 12px; }
.apps-search button { width: 38px; height: 38px; margin-inline-end: 7px; display: none; border: 0; border-radius: 9px; background: #f0edfb; color: #5d45a8; cursor: pointer; font-size: 19px; }
.apps-search button.visible { display: block; }
.apps-search:focus-within { border-color: var(--apps-purple); box-shadow: 0 0 0 4px rgba(101,55,232,.1); }
.apps-tabs { display: flex; justify-content: flex-end; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.apps-tabs::-webkit-scrollbar { display: none; }
.apps-tabs button { min-height: 42px; padding: 0 14px; flex: 0 0 auto; border: 1px solid #dce0ea; border-radius: 10px; background: #fff; color: #5e6678; cursor: pointer; font-size: 10px; font-weight: 800; }
.apps-tabs button:hover { border-color: #a995ed; color: var(--apps-purple); }
.apps-tabs button.active { border-color: var(--apps-purple); background: var(--apps-purple); color: #fff; }
.apps-result-line { margin: 23px 2px 12px; display: flex; align-items: center; gap: 7px; color: var(--apps-muted); font-size: 10px; }
.apps-result-line b { color: var(--apps-ink); font-size: 13px; }
.apps-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 19px; }
.app-card {
  --card-accent: #7047e8;
  --card-accent-2: #a66cff;
  --card-soft: #f1edff;
  --card-glow: rgba(112,71,232,.2);
  position: relative;
  min-height: 304px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(112,71,232,.15);
  border-radius: 24px;
  background: linear-gradient(160deg,#fff 0%,#fff 62%,#faf8ff 100%);
  box-shadow: 0 12px 30px rgba(34,31,67,.07), inset 0 1px 0 rgba(255,255,255,.9);
  cursor: pointer;
  transform: translateZ(0);
  transition: transform .34s cubic-bezier(.2,.75,.25,1), box-shadow .34s, border-color .34s;
  animation: appCardReveal .55s backwards cubic-bezier(.2,.75,.25,1);
  animation-delay: var(--card-delay,0ms);
}
.app-video {
  --card-accent: #216cf4;
  --card-accent-2: #23b9e9;
  --card-soft: #eaf5ff;
  --card-glow: rgba(33,108,244,.2);
  border-color: rgba(33,108,244,.14);
  background: linear-gradient(160deg,#fff 0%,#fff 62%,#f5faff 100%);
}
.app-card::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0 0 auto;
  height: 112px;
  background:
    radial-gradient(circle at 18% 2%,rgba(255,255,255,.72),transparent 35%),
    linear-gradient(125deg,var(--card-soft),rgba(255,255,255,.76));
  border-bottom: 1px solid rgba(255,255,255,.95);
}
.app-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  inset-inline-end: -96px;
  top: -78px;
  background: linear-gradient(145deg,var(--card-accent),var(--card-accent-2));
  opacity: .17;
  filter: blur(1px);
  transition: width .38s,height .38s,opacity .38s,transform .38s;
}
.app-card:hover {
  z-index: 2;
  transform: translateY(-9px) scale(1.012);
  border-color: color-mix(in srgb,var(--card-accent) 42%,white);
  box-shadow: 0 26px 58px var(--card-glow), 0 8px 20px rgba(31,35,65,.09), inset 0 1px 0 #fff;
}
.app-card:hover::after { width: 205px; height: 205px; opacity: .25; transform: translate(-8px,8px); }
.app-card:focus-visible { outline: 3px solid color-mix(in srgb,var(--card-accent) 34%,transparent); outline-offset: 4px; }
.app-card[hidden] { display: none; }
.app-card > * { position: relative; z-index: 2; }
.app-card-index { position: absolute; z-index: 0; inset-inline-end: 14px; bottom: 63px; color: var(--card-accent); opacity: .045; font-size: 78px; font-weight: 900; line-height: 1; letter-spacing: -.08em; pointer-events: none; }
.app-card-top { min-height: 64px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.app-icon {
  width: 62px;
  height: 62px;
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 19px;
  background: linear-gradient(145deg,var(--card-accent),var(--card-accent-2));
  color: #fff;
  font-size: 26px;
  font-style: normal;
  font-weight: 900;
  box-shadow: 0 12px 25px var(--card-glow), inset 0 1px 0 rgba(255,255,255,.36);
  transition: transform .34s cubic-bezier(.2,.8,.2,1),box-shadow .34s;
}
.app-icon::before { content: ""; position: absolute; width: 42px; height: 85px; top: -43px; left: -18px; background: rgba(255,255,255,.22); transform: rotate(37deg); }
.app-icon i { position: absolute; inset: 5px; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; }
.app-card:hover .app-icon { transform: translateY(-3px) rotate(-4deg) scale(1.06); box-shadow: 0 18px 34px var(--card-glow),inset 0 1px 0 rgba(255,255,255,.4); }
[dir="ltr"] .app-card:hover .app-icon { transform: translateY(-3px) rotate(4deg) scale(1.06); }
.app-card-labels { max-width: 135px; display: flex; align-items: flex-end; flex-direction: column; gap: 7px; }
.app-kind,.app-popular { min-height: 24px; padding: 0 9px; display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; font-size: 7px; font-weight: 900; letter-spacing: .06em; white-space: nowrap; }
.app-kind { border: 1px solid color-mix(in srgb,var(--card-accent) 18%,white); background: rgba(255,255,255,.82); color: var(--card-accent); box-shadow: 0 6px 16px rgba(43,47,79,.05); }
.app-kind i { width: 6px; height: 6px; border-radius: 50%; background: var(--card-accent); box-shadow: 0 0 0 3px var(--card-soft); }
.app-popular { position: static; background: linear-gradient(120deg,#fff7d9,#ffedac); color: #7a5200; box-shadow: 0 6px 14px rgba(174,125,16,.1); }
.app-card h3 { margin: 23px 0 8px; color: var(--apps-ink); font-size: 18px; line-height: 1.45; letter-spacing: -.015em; }
.app-card p { min-height: 38px; margin: 0 0 13px; color: var(--apps-muted); font-size: 10px; line-height: 1.9; }
.app-card-meta { margin: auto 0 15px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.app-card-meta span { padding: 5px 7px; border: 1px solid #e8eaf1; border-radius: 7px; background: rgba(255,255,255,.78); color: #7a8293; font-size: 7px; font-weight: 800; }
.app-card-meta span:first-child { border-color: #d9f1e6; background: #f2fbf7; color: #16714e; }
.app-card > button,
.app-card > a[data-open-tool] { width: 100%; min-height: 46px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; overflow: hidden; border: 0; border-radius: 13px; background: linear-gradient(115deg,var(--card-accent),var(--card-accent-2)); color: #fff; cursor: pointer; font-size: 10px; font-weight: 900; box-shadow: 0 10px 20px var(--card-glow); transition: transform .25s,box-shadow .25s,filter .25s; }
.app-card > button b,
.app-card > a[data-open-tool] b { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 9px; background: rgba(255,255,255,.18); color: #fff; font-size: 16px; transition: transform .25s,background .25s; }
.app-card:hover > button,
.app-card:hover > a[data-open-tool] { filter: saturate(1.12); box-shadow: 0 15px 28px var(--card-glow); }
.app-card:hover > button b,
.app-card:hover > a[data-open-tool] b { color: #fff; }
.app-card:hover > a[data-open-tool] b { transform: translateX(-3px); background: rgba(255,255,255,.27); }
[dir="ltr"] .app-card:hover > a[data-open-tool] b { transform: translateX(3px); }
@keyframes appCardReveal { from { opacity: 0; transform: translateY(18px) scale(.975); } to { opacity: 1; transform: translateY(0) scale(1); } }
.apps-empty { padding: 55px 20px; text-align: center; color: var(--apps-muted); }
.apps-empty > span { width: 60px; height: 60px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 50%; background: #ede9fb; color: var(--apps-purple); font-size: 29px; }
.apps-empty b { display: block; color: var(--apps-ink); font-size: 16px; }
.apps-empty p { margin: 8px 0 0; font-size: 10px; }
.apps-assurances { padding-top: 35px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.apps-assurances > div { padding: 17px; display: grid; grid-template-columns: 39px 1fr; column-gap: 11px; border-inline-start: 1px solid #e2e5ed; }
.apps-assurances > div:first-child { border-inline-start: 0; }
.apps-assurances span { width: 39px; height: 39px; grid-row: 1/3; display: grid; place-items: center; border-radius: 11px; background: #f0ecff; color: var(--apps-purple); font-size: 17px; }
.apps-assurances b { font-size: 10px; }
.apps-assurances small { color: var(--apps-muted); font-size: 8px; }

/* Animated product stories */
.motion-showcase {
  padding: 105px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 18%,rgba(112,71,232,.22),transparent 27%),
    radial-gradient(circle at 88% 78%,rgba(35,185,233,.15),transparent 25%),
    linear-gradient(145deg,#111329,#171833 58%,#11162e);
  color: #fff;
}
.motion-heading { margin-bottom: 42px; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 35px; }
.motion-kicker { color: #ae97ff; font-size: 10px; font-weight: 900; letter-spacing: .13em; }
.motion-heading h2 { margin: 12px 0 11px; color: #fff; font-size: clamp(39px,4.6vw,62px); line-height: 1.13; letter-spacing: -.045em; }
.motion-heading p { max-width: 710px; margin: 0; color: #afb5cd; font-size: 13px; line-height: 1.9; }
.motion-toggle { min-width: 145px; min-height: 48px; padding: 0 15px; display: flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px; background: rgba(255,255,255,.07); color: #fff; cursor: pointer; font-family: inherit; backdrop-filter: blur(10px); transition: background .2s,border-color .2s,transform .2s; }
.motion-toggle:hover { border-color: rgba(174,151,255,.55); background: rgba(112,71,232,.2); transform: translateY(-2px); }
.motion-toggle:focus-visible { outline: 3px solid rgba(174,151,255,.35); outline-offset: 3px; }
.motion-toggle span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; background: #7650ed; color: #fff; font-size: 10px; }
.motion-toggle b { font-size: 9px; }
.motion-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.motion-card { --motion-accent:#7650ed; --motion-accent-2:#a46dff; position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 28px; background: rgba(255,255,255,.055); box-shadow: 0 25px 65px rgba(0,0,0,.2); backdrop-filter: blur(13px); transition: transform .35s cubic-bezier(.2,.75,.25,1),border-color .35s,box-shadow .35s; }
.motion-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb,var(--motion-accent) 52%,transparent); box-shadow: 0 34px 75px rgba(0,0,0,.28); }
.motion-card-enhance { --motion-accent:#25c49a; --motion-accent-2:#91eea7; }
.motion-card-video { --motion-accent:#2d82ff; --motion-accent-2:#35d4ef; }
.motion-card-convert { --motion-accent:#ff8b58; --motion-accent-2:#ffc75c; }
.motion-card-head { min-height: 55px; padding: 0 21px; display: flex; align-items: center; justify-content: space-between; color: #d3d6e4; }
.motion-card-head > span { display: inline-flex; align-items: center; gap: 8px; font-size: 7px; font-weight: 900; letter-spacing: .08em; }
.motion-card-head > span i { width: 7px; height: 7px; border-radius: 50%; background: var(--motion-accent); box-shadow: 0 0 0 5px color-mix(in srgb,var(--motion-accent) 17%,transparent); animation: motionLive 1.7s ease infinite; }
.motion-card-head > b { color: rgba(255,255,255,.24); font-size: 18px; letter-spacing: .06em; }
.motion-stage { height: 275px; position: relative; margin: 0 17px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 20px; background: linear-gradient(145deg,#202442,#161a32); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.motion-stage::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(115deg,rgba(255,255,255,.06),transparent 28%,transparent 70%,rgba(255,255,255,.03)); }
.motion-window-bar { height: 31px; padding: 0 12px; position: relative; z-index: 8; display: flex; align-items: center; gap: 5px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(10,12,28,.42); }
.motion-window-bar i { width: 6px; height: 6px; border-radius: 50%; background: #ff796f; }
.motion-window-bar i:nth-child(2) { background:#ffc85a; }
.motion-window-bar i:nth-child(3) { background:#60d394; }
.motion-card-copy { padding: 25px 24px 27px; }
.motion-card-copy > span { color: var(--motion-accent-2); font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.motion-card-copy h3 { margin: 8px 0 7px; color: #fff; font-size: 22px; }
.motion-card-copy p { min-height: 40px; margin: 0 0 18px; color: #aeb5cc; font-size: 10px; line-height: 1.85; }
.motion-card-copy a { min-height: 43px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; border: 1px solid rgba(255,255,255,.11); border-radius: 12px; background: rgba(255,255,255,.075); color: #fff; font-size: 9px; font-weight: 900; transition: background .2s,border-color .2s; }
.motion-card-copy a:hover { border-color: var(--motion-accent); background: color-mix(in srgb,var(--motion-accent) 24%,transparent); }
.motion-card-copy a b { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: var(--motion-accent); color: #fff; font-size: 14px; }

/* Shape clip */
.shape-orbit { position: absolute; border: 1px solid rgba(174,151,255,.21); border-radius: 50%; animation: orbitSpin 9s linear infinite; }
.orbit-one { width: 245px; height: 245px; top: 17px; left: calc(50% - 122px); }
.orbit-two { width: 175px; height: 175px; top: 52px; left: calc(50% - 87px); animation-direction: reverse; animation-duration: 6s; }
.shape-orbit::before { content:""; position:absolute; width:8px; height:8px; top:10px; left:42px; border-radius:50%; background:#b394ff; box-shadow:0 0 14px #b394ff; }
.morph-object { width: 126px; height: 126px; position: absolute; z-index: 3; top: 61px; left: 50%; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: linear-gradient(145deg,#7e58ef,#ad70ff); box-shadow: 0 18px 44px rgba(118,80,237,.35),inset 0 1px 0 rgba(255,255,255,.35); transform: translateX(-50%); animation: morphShape 6s ease-in-out infinite; }
.morph-object::before,.morph-object::after { content:""; position:absolute; width:110px; height:110px; border-radius:50%; background:rgba(255,255,255,.13); }
.morph-object::before { left:-45px; bottom:-62px; }
.morph-object::after { right:-60px; top:-50px; background:rgba(201,244,91,.21); }
.morph-object span { position:relative; z-index:2; padding:7px 10px; border-radius:8px; background:rgba(13,18,41,.72); color:#fff; font-size:9px; font-weight:900; letter-spacing:.08em; }
.shape-options { position:absolute; z-index:4; inset:auto 16px 13px; display:flex; justify-content:center; gap:7px; }
.shape-options span { padding:6px 9px; border:1px solid rgba(255,255,255,.1); border-radius:999px; background:rgba(11,14,32,.55); color:#bfc4d8; font-size:6px; font-weight:800; }

/* Enhancement clip */
.enhance-photo { position:absolute; inset:48px 27px 37px; overflow:hidden; border-radius:15px; background:linear-gradient(180deg,#7f8494 0%,#8a8d98 55%,#545968 56%); }
.enhance-after { position:absolute; z-index:4; inset:0; overflow:hidden; background:linear-gradient(180deg,#58c8e8 0%,#92e0ef 55%,#28aa7d 56%); clip-path:inset(0 100% 0 0); animation:enhanceReveal 5.5s ease-in-out infinite; }
.enhance-sun { width:37px; height:37px; position:absolute; top:22px; inset-inline-end:28px; border-radius:50%; background:#f8d46b; box-shadow:0 0 25px rgba(248,212,107,.42); }
.enhance-mountain { position:absolute; bottom:-15px; width:0; height:0; border-left:105px solid transparent; border-right:105px solid transparent; border-bottom:125px solid #454b5d; transform:rotate(2deg); }
.mountain-one { left:8%; }
.mountain-two { right:-12%; bottom:-27px; border-left-width:125px; border-right-width:125px; border-bottom-width:145px; border-bottom-color:#646a79; }
.enhance-after .mountain-one { border-bottom-color:#266a69; }
.enhance-after .mountain-two { border-bottom-color:#278d70; }
.enhance-scanner { width:2px; position:absolute; z-index:6; top:0; bottom:0; left:0; background:#fff; box-shadow:0 0 13px rgba(255,255,255,.9); animation:scannerMove 5.5s ease-in-out infinite; }
.enhance-labels { position:absolute; z-index:8; inset:auto 36px 12px; display:flex; justify-content:space-between; }
.enhance-labels span { padding:4px 7px; border-radius:6px; background:rgba(8,11,27,.65); color:#fff; font-size:6px; font-weight:900; }

/* Video trimming clip */
.video-preview { position:absolute; inset:45px 35px 78px; overflow:hidden; border-radius:14px; background:linear-gradient(145deg,#275aae,#46b9e6); }
.video-preview::before { content:""; position:absolute; width:190px; height:150px; bottom:-108px; left:-30px; border-radius:50%; background:#8bdcdb; }
.video-preview::after { content:""; position:absolute; width:210px; height:160px; bottom:-120px; right:-38px; border-radius:50%; background:#735ce4; }
.video-play { width:48px; height:48px; position:absolute; z-index:5; top:50%; left:50%; display:grid; place-items:center; border:1px solid rgba(255,255,255,.5); border-radius:50%; background:rgba(13,21,52,.62); color:#fff; font-size:15px; transform:translate(-50%,-50%); box-shadow:0 10px 25px rgba(0,0,0,.2); animation:playPulse 2s ease-in-out infinite; }
.video-subject { width:49px; height:88px; position:absolute; z-index:4; bottom:5px; left:18%; border-radius:28px 28px 11px 11px; background:#f3c58b; box-shadow:inset 0 22px 0 #202945; animation:subjectMove 5s ease-in-out infinite; }
.video-glow { width:120px; height:120px; position:absolute; top:-55px; right:-30px; border-radius:50%; background:rgba(201,244,91,.25); filter:blur(7px); }
.video-timeline { position:absolute; z-index:7; inset:auto 35px 24px; }
.timeline-track { height:5px; position:relative; display:block; border-radius:999px; background:rgba(255,255,255,.17); }
.timeline-track i { width:0; position:absolute; inset:0 auto 0 0; border-radius:999px; background:linear-gradient(90deg,#2d82ff,#48d5ef); animation:timelineProgress 5s linear infinite; }
.timeline-track b { width:12px; height:12px; position:absolute; top:50%; left:0; border:3px solid #fff; border-radius:50%; background:#2d82ff; transform:translate(-50%,-50%); box-shadow:0 0 0 5px rgba(45,130,255,.16); animation:timelineHead 5s linear infinite; }
.video-timeline > div { margin-top:7px; display:flex; justify-content:space-between; color:#8f99b7; direction:ltr; }
.video-timeline small { font-size:6px; }
.trim-handles { position:absolute; z-index:8; inset:38px 26px 69px; pointer-events:none; }
.trim-handles i { width:8px; position:absolute; top:0; bottom:0; border:2px solid #65dcf1; border-radius:5px; animation:handlePulse 1.5s ease-in-out infinite; }
.trim-handles i:first-child { left:0; }.trim-handles i:last-child { right:0; animation-delay:.75s; }

/* Format conversion clip */
.format-flow { position:absolute; inset:54px 34px 66px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:22px; }
.format-source { display:grid; gap:8px; }
.format-source span { min-height:32px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.12); border-radius:9px; background:rgba(255,255,255,.06); color:#c5cada; font-size:7px; font-weight:900; animation:sourceFloat 3s ease-in-out infinite; }
.format-source span:nth-child(2) { animation-delay:.25s; }.format-source span:nth-child(3) { animation-delay:.5s; }
.format-arrow { color:#ffb762; font-size:28px; animation:arrowMove 1.5s ease-in-out infinite; }
.format-output { min-height:116px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:7px; border:1px solid rgba(255,199,92,.35); border-radius:20px; background:linear-gradient(145deg,rgba(255,139,88,.2),rgba(255,199,92,.08)); box-shadow:0 0 45px rgba(255,139,88,.15); animation:outputGlow 2.2s ease-in-out infinite; }
.format-output i { width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:linear-gradient(145deg,#ff8b58,#ffc75c); color:#192039; font-size:12px; font-style:normal; }
.format-output strong { color:#fff; font-size:15px; }.format-output small { color:#ffc873; font-size:6px; font-weight:900; }
.convert-progress { position:absolute; inset:auto 34px 25px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px; }
.convert-progress > span { height:5px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.11); }
.convert-progress > span i { width:100%; height:100%; display:block; border-radius:inherit; background:linear-gradient(90deg,#ff8b58,#ffc75c); transform-origin:left; animation:convertBar 3.5s ease-in-out infinite; }
.convert-progress > b { color:#ffc75c; font-size:7px; direction:ltr; }

.motion-showcase.is-paused *,
.motion-showcase.is-paused *::before,
.motion-showcase.is-paused *::after { animation-play-state:paused !important; }
@keyframes motionLive { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.42;transform:scale(.72)} }
@keyframes orbitSpin { to{transform:rotate(360deg)} }
@keyframes morphShape { 0%,27%,100%{width:126px;height:126px;border-radius:50%} 34%,60%{width:126px;height:126px;border-radius:20px} 68%,93%{width:205px;height:112px;border-radius:18px} }
@keyframes enhanceReveal { 0%,8%{clip-path:inset(0 100% 0 0)} 45%,70%{clip-path:inset(0 0 0 0)} 92%,100%{clip-path:inset(0 100% 0 0)} }
@keyframes scannerMove { 0%,8%{left:0} 45%,70%{left:100%} 92%,100%{left:0} }
@keyframes playPulse { 0%,100%{transform:translate(-50%,-50%) scale(1)} 50%{transform:translate(-50%,-50%) scale(1.1);box-shadow:0 0 0 10px rgba(255,255,255,.08)} }
@keyframes subjectMove { 0%,100%{left:18%;transform:rotate(-2deg)} 50%{left:67%;transform:rotate(2deg)} }
@keyframes timelineProgress { 0%{width:0} 90%,100%{width:100%} }
@keyframes timelineHead { 0%{left:0} 90%,100%{left:100%} }
@keyframes handlePulse { 0%,100%{opacity:.65} 50%{opacity:1;box-shadow:0 0 15px rgba(53,212,239,.45)} }
@keyframes sourceFloat { 0%,100%{transform:translateY(0);border-color:rgba(255,255,255,.12)} 50%{transform:translateY(-4px);border-color:rgba(255,183,98,.35)} }
@keyframes arrowMove { 0%,100%{transform:translateX(0);opacity:.55} 50%{transform:translateX(-7px);opacity:1} }
[dir="ltr"] .format-arrow { animation-name:arrowMoveLtr; }
@keyframes arrowMoveLtr { 0%,100%{transform:translateX(0);opacity:.55} 50%{transform:translateX(7px);opacity:1} }
@keyframes outputGlow { 0%,100%{transform:scale(1);box-shadow:0 0 30px rgba(255,139,88,.1)} 50%{transform:scale(1.035);box-shadow:0 0 48px rgba(255,139,88,.23)} }
@keyframes convertBar { 0%{transform:scaleX(0)} 65%,82%{transform:scaleX(1)} 100%{transform:scaleX(0)} }

.apps-modern .section { padding: 90px 0; }
.apps-modern .section-head { grid-template-columns: .55fr 1.15fr .75fr; margin-bottom: 40px; }
.apps-modern .section-head h2,
.apps-modern .dark-copy h2,
.apps-modern .steps-copy h2,
.apps-modern .faq-intro h2 { font-size: clamp(36px, 4vw, 52px); }
.apps-modern .tools-section { background: var(--apps-bg); }
.apps-modern .studio,
.apps-modern .video-studio { border-color: #d9deea; border-radius: 20px; box-shadow: 0 25px 60px rgba(34,42,69,.1); }
.apps-modern .tool-menu,
.apps-modern .video-tool-menu { gap: 1px; padding: 10px; border-bottom-color: #e2e5ed; background: #eaedf4; }
.apps-modern .tool-tab,
.apps-modern .video-tool-tab { min-height: 128px; border: 0 !important; border-radius: 11px; background: #fff; }
.apps-modern .tool-tab.active,
.apps-modern .video-tool-tab.active { background: var(--apps-purple); }
.apps-modern .tool-tab span,
.apps-modern .video-tool-tab > span { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 11px; background: #eee9ff; color: var(--apps-purple); }
.apps-modern .tool-tab.active span,
.apps-modern .video-tool-tab.active > span { background: rgba(255,255,255,.18); color: #fff; }
.apps-modern .studio-body,
.apps-modern .video-body { background: #fff; }
.apps-modern .dropzone,
.apps-modern .video-dropzone { border: 2px dashed #c9cfe0; border-radius: 15px; background: #fafbfe; }
.apps-modern .upload-icon,
.apps-modern .video-upload-icon { background: var(--apps-purple); color: #fff; }
.apps-modern .drop-content b,
.apps-modern .video-drop-content b { border-radius: 9px; background: var(--apps-purple); }
.apps-modern .video-section { background: linear-gradient(150deg, #17142e, #292052 55%, #43208f); }
.apps-modern .service-card { border-color: #e1e5ee; border-radius: 15px; background: #fafbfe; }
.apps-modern .privacy-section { background: #171d35; }
.apps-modern .coffee-card { border: 0; border-radius: 20px; box-shadow: 0 20px 55px rgba(67,47,26,.13); }
.apps-modern .coffee-link { border-radius: 12px; background: var(--apps-purple); }

@media (max-width: 1050px) {
  .apps-modern .main-nav { display: none; }
  .apps-modern .main-nav.is-open { position: absolute; top: calc(100% + 8px); inset-inline: 20px; z-index: 60; padding: 13px; display: grid; gap: 3px; border: 1px solid #e0e3ec; border-radius: 15px; background: #fff; box-shadow: 0 22px 55px rgba(26,31,52,.18); }
  .apps-modern .main-nav.is-open a { padding: 13px 14px; border: 0; border-radius: 9px; }
  .apps-modern .main-nav.is-open a:hover { background: #f1edff; }
  .apps-modern .mobile-nav-toggle { display: grid; margin-inline-start: auto; }
  .apps-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .apps-toolbar { grid-template-columns: 1fr; }
  .apps-tabs { justify-content: flex-start; }
  .apps-modern .section-head { grid-template-columns: 1fr; }
  .motion-showcase { padding: 85px 0; }
  .motion-stage { height: 255px; }
}

@media (max-width: 760px) {
  .apps-modern .hero-grid { padding-top: 48px; }
  .apps-modern .hero h1 { font-size: 45px; }
  .apps-modern .hero-copy > p { font-size: 13px; }
  .apps-modern .hero-art { min-height: 390px; }
  .apps-modern .art-card { inset: 28px 8px; padding: 17px; border-radius: 19px; }
  .apps-modern .art-photo { height: 230px; }
  .apps-modern .file-image { inset-inline-start: 35px; }
  .apps-modern .file-video { inset-inline-end: 28px; }
  .apps-directory { padding: 68px 0 60px; }
  .apps-heading { grid-template-columns: 1fr; gap: 22px; }
  .apps-heading h2 { font-size: 36px; }
  .apps-security { min-width: 0; }
  .apps-browser { padding: 14px; border-radius: 16px; }
  .apps-grid { grid-template-columns: 1fr 1fr; gap: 13px; }
  .app-card { min-height: 282px; padding: 17px; border-radius: 20px; }
  .app-icon { width: 55px; height: 55px; border-radius: 16px; font-size: 23px; }
  .app-card-labels { max-width: 112px; }
  .app-kind,.app-popular { min-height: 22px; padding: 0 7px; font-size: 6.5px; }
  .app-card h3 { margin-top: 19px; font-size: 16px; }
  .app-card p { font-size: 9px; }
  .app-card-meta span { font-size: 6.5px; }
  .apps-assurances { grid-template-columns: 1fr 1fr; gap: 4px; }
  .apps-assurances > div { border-inline-start: 0; border-bottom: 1px solid #e5e8ef; }
  .motion-showcase { padding: 70px 0; }
  .motion-heading { grid-template-columns: 1fr; gap: 20px; margin-bottom: 30px; }
  .motion-heading h2 { font-size: 38px; }
  .motion-heading p { font-size: 11px; }
  .motion-toggle { width: 100%; }
  .motion-grid { grid-template-columns: 1fr; gap: 18px; }
  .motion-stage { height: 270px; }
  .motion-card-copy h3 { font-size: 20px; }
  .apps-modern .tool-menu,
  .apps-modern .video-tool-menu { grid-template-columns: 1fr 1fr; }
  .apps-modern .tool-tab,
  .apps-modern .video-tool-tab { min-height: 118px; padding: 15px; }
}

@media (max-width: 430px) {
  .apps-grid { grid-template-columns: 1fr; }
  .app-card { min-height: 280px; padding: 20px; }
  .motion-stage { height: 245px; margin-inline: 11px; }
  .motion-card-head { padding-inline: 16px; }
  .motion-card-copy { padding: 22px 18px 24px; }
  .format-flow { inset-inline: 23px; gap: 14px; }
  .video-preview { inset-inline: 23px; }
  .video-timeline { inset-inline: 23px; }
  .enhance-photo { inset-inline: 19px; }
  .apps-assurances { grid-template-columns: 1fr; }
  .apps-modern .hero h1 { font-size: 39px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-card { animation: none; transition: none; }
  .motion-showcase *,
  .motion-showcase *::before,
  .motion-showcase *::after { animation-play-state: paused !important; }
}

/* v21 — brighter app-directory experience and AI creation spotlight */
.apps-modern .hero{background:radial-gradient(circle at 12% 10%,rgba(173,247,98,.28),transparent 22%),radial-gradient(circle at 85% 20%,rgba(121,91,239,.2),transparent 30%),linear-gradient(180deg,#faf9ff 0%,#f3f1fb 100%);border-bottom:1px solid #e3dfef}
.apps-modern .hero h1 em{color:#6749e7}
.apps-modern .primary-btn{background:linear-gradient(105deg,#6042e7,#7959ee);box-shadow:0 14px 30px rgba(96,66,231,.26)}
.apps-modern .secondary-btn{background:#fff;border-color:#cfc7ed;color:#4f39b5}
.apps-directory{background:#fff}
.apps-browser{box-shadow:0 24px 68px rgba(40,31,91,.09)}
.app-card.app-image:first-child{background:radial-gradient(circle at 86% 12%,rgba(186,255,107,.26),transparent 24%),linear-gradient(145deg,#faf9ff,#f1edff);border-color:#bdb0f0}
.app-card.app-image:first-child .app-icon{background:linear-gradient(145deg,#6041e6,#8d69f7);color:#fff}
.app-card.app-image:nth-child(15){background:linear-gradient(145deg,#f7fbff,#eef7f5);border-color:#b9ded5}

.ai-spotlight{padding:92px 0;background:#f7f6fb;border-block:1px solid #e5e2ee}
.ai-spotlight-head{max-width:820px;text-align:center;margin-bottom:36px}.ai-spotlight-head>span{display:inline-flex;color:#694ce2;background:#eee9ff;border:1px solid #d9cffd;border-radius:99px;padding:7px 12px;font-size:10px;font-weight:900;letter-spacing:.07em}.ai-spotlight-head h2{font-size:clamp(35px,4vw,54px);line-height:1.16;margin:15px 0 10px;color:#18172d}.ai-spotlight-head p{font-size:14px;line-height:1.85;color:#6b6678;margin:0}
.ai-spotlight-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.ai-feature{min-height:370px;border:1px solid #dbd7e7;border-radius:25px;padding:34px;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:24px;overflow:hidden;position:relative;background:#fff;box-shadow:0 20px 50px rgba(31,27,63,.08)}.ai-feature:before{content:"";position:absolute;width:170px;height:170px;border-radius:50%;filter:blur(5px);opacity:.18;inset:-70px auto auto -50px;background:#704ce8}.ai-feature-background:before{inset:auto -50px -70px auto;background:#36bca1}.ai-feature-copy{position:relative;z-index:2}.ai-feature-tag{display:inline-flex;border-radius:99px;background:#ede8ff;color:#6044d4;padding:7px 10px;font-size:9px;font-weight:900;letter-spacing:.05em}.ai-feature h3{font-size:28px;line-height:1.25;color:#17152d;margin:15px 0 9px}.ai-feature p{font-size:12px;line-height:1.85;color:#6e697c;margin:0 0 23px}.ai-feature a{min-height:48px;padding:0 16px;border-radius:10px;display:inline-flex;align-items:center;gap:20px;background:#1a1735;color:#fff;text-decoration:none;font-size:12px;font-weight:900}.ai-feature a b{font-size:17px}.ai-feature-background a{background:#0d725f}.ai-feature-art{height:250px;position:relative;border-radius:18px;background:linear-gradient(145deg,#eeeaff,#ddd5ff);overflow:hidden}.ai-feature-background .ai-feature-art{background:linear-gradient(45deg,#e6e6eb 25%,transparent 25%) 0 0/20px 20px,linear-gradient(45deg,transparent 75%,#e6e6eb 75%) 0 0/20px 20px,linear-gradient(45deg,transparent 75%,#e6e6eb 75%) 10px -10px/20px 20px,linear-gradient(45deg,#e6e6eb 25%,#fff 25%) 10px -10px/20px 20px}.prompt-mini{position:absolute;inset:22px 18px auto;background:#fff;border-radius:11px;padding:14px;box-shadow:0 12px 30px rgba(45,31,103,.13)}.prompt-mini i{display:block;height:5px;border-radius:9px;background:#ddd7ed;margin:0 0 7px}.prompt-mini i:nth-child(2){width:78%}.prompt-mini i:nth-child(3){width:55%;margin-bottom:0}.prompt-mini b{position:absolute;inset:auto 10px 8px auto;color:#7856ec}.generated-mini{position:absolute;inset:105px 32px 18px;border-radius:13px;overflow:hidden;background:linear-gradient(155deg,#1b244d,#764ecf 55%,#b8f262)}.generated-mini:before,.generated-mini:after{content:"";position:absolute;border-radius:55% 45% 0 0}.generated-mini:before{width:105px;height:65px;inset:auto -8px 0 auto;background:#1a675f;transform:skewX(-16deg)}.generated-mini:after{width:120px;height:75px;inset:auto auto 0 -18px;background:#292e67;transform:skewX(20deg)}.generated-mini span{position:absolute;width:34px;height:34px;border-radius:50%;background:#c9f45b;inset:20px auto auto 24px;box-shadow:0 0 30px rgba(201,244,91,.75)}.generated-mini b{position:absolute;z-index:2;inset:auto 12px 9px auto;color:#fff;font-size:10px}.cutout-before,.cutout-after{position:absolute;width:98px;height:178px;inset-block:36px;margin:auto;border-radius:13px}.cutout-before{inset-inline-start:18px;background:linear-gradient(145deg,#92d8f4,#6750cc)}.cutout-after{inset-inline-end:18px;background:transparent}.cutout-before span,.cutout-after span{position:absolute;width:65px;height:128px;inset:auto 0 0;margin:auto;border-radius:40px 40px 12px 12px;background:linear-gradient(#1d2446 0 28%,#d6a176 29% 44%,#e6e8f3 45%)}.cutout-arrow{position:absolute;inset:0;display:grid;place-items:center;color:#5a45bf;font-size:24px;font-weight:900}

/* Larger, clearer labels and fields in every image and video tool. */
.apps-modern .control-list label>span,.apps-modern .video-control-list label>span,.apps-modern .video-control-list .video-check-row span,.apps-modern .control-list .check-row span{font-size:14px!important;line-height:1.55;font-weight:800}
.apps-modern .control-list input:not([type="checkbox"]):not([type="range"]),.apps-modern .control-list select,.apps-modern .control-list textarea,.apps-modern .video-control-list input:not([type="checkbox"]):not([type="range"]),.apps-modern .video-control-list select,.apps-modern .video-control-list textarea{min-height:52px!important;border-radius:10px!important;padding-inline:14px!important;font-size:14px!important;font-weight:700!important}
.apps-modern .note-box,.apps-modern .video-note,.apps-modern .video-mark-instruction span{font-size:12px!important;line-height:1.75!important}.apps-modern .video-mark-instruction b{font-size:14px!important}.apps-modern .file-row span,.apps-modern .video-file-row span{font-size:12px!important}.apps-modern .file-row strong,.apps-modern .video-file-row strong{font-size:13px!important}.apps-modern .text-btn{font-size:15px!important;min-width:72px;min-height:42px}.apps-modern .process-btn b,.apps-modern .download-btn b,.apps-modern .video-process-btn b,.apps-modern .video-download-btn b{font-size:15px!important}.apps-modern .privacy-line,.apps-modern .video-privacy-line{font-size:11px!important}.apps-modern .drop-content strong,.apps-modern .video-drop-content strong{font-size:18px!important}.apps-modern .drop-content small,.apps-modern .video-drop-content small{font-size:12px!important}

@media(max-width:1050px){.ai-spotlight-grid{grid-template-columns:1fr}.ai-feature{min-height:330px}.ai-feature-art{height:235px}}
@media(max-width:650px){.ai-spotlight{padding:66px 0}.ai-spotlight-head{text-align:start}.ai-spotlight-head h2{font-size:36px}.ai-feature{grid-template-columns:1fr;padding:24px}.ai-feature-art{height:240px}.ai-feature h3{font-size:25px}.app-card p{font-size:12px;line-height:1.75}.app-card-meta span{font-size:8px}}

/* =========================================================
   NUJIZ GLOBAL TEXT CONTRAST FIX
   تحسين وضوح النصوص التعريفية في جميع صفحات الموقع
   ========================================================= */

/* النصوص العامة والوصفية على الخلفيات الفاتحة */
body,
p,
small,
.tool-detail-copy p,
.tool-detail-copy small,
.section-head p,
.hero-copy p,
.ai-spotlight-head p,
.ai-feature-copy p,
.motion-card-copy p,
.faq-intro p,
.faq-section p,
details p,
.feature-card p,
.art-card p,
.step-card p,
.privacy-line,
.tool-message,
.drop-content small,
.controls-panel span,
.file-row span {
    color:#374151 !important;
    opacity:1 !important;
    -webkit-text-fill-color:#374151 !important;
}

/* النصوص الثانوية الصغيرة */
.section-tag,
.eyebrow,
.free-chip,
.art-status,
.hero-stats span,
.image-stats span,
.tool-detail-copy small {
    color:#4b5563 !important;
    opacity:1 !important;
    -webkit-text-fill-color:#4b5563 !important;
}

/* العناوين */
h1,
h2,
h3,
h4,
.hero-copy h1,
.section-head h2,
.tool-detail-copy h1,
.tool-detail-copy h2 {
    color:#111827 !important;
    opacity:1 !important;
    -webkit-text-fill-color:#111827 !important;
}

/* الأسئلة الشائعة */
.faq-section summary,
details summary {
    color:#111827 !important;
    opacity:1 !important;
    font-weight:700 !important;
    -webkit-text-fill-color:#111827 !important;
}

/* =========================================================
   الأقسام الداكنة
   ========================================================= */

#motion-showcase,
.motion-showcase,
.site-footer,
footer {
    color:#fff;
}

/* عنوان قسم شاهد ما يمكنك إنجازه */
#motion-showcase h2,
#motion-showcase h3,
.motion-showcase h2,
.motion-showcase h3 {
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    opacity:1 !important;
}

/* النصوص التعريفية داخل القسم الداكن */
#motion-showcase p,
#motion-showcase small,
#motion-showcase .motion-card-copy p,
.motion-showcase p,
.motion-showcase small {
    color:#f1f5f9 !important;
    -webkit-text-fill-color:#f1f5f9 !important;
    opacity:1 !important;
}

/* النصوص الصغيرة داخل البطاقات الداكنة */
#motion-showcase span,
.motion-showcase span {
    opacity:1 !important;
}

/* الفوتر */
.site-footer p,
.site-footer small,
.site-footer a,
footer p,
footer small,
footer a {
    color:#dbe3ee !important;
    -webkit-text-fill-color:#dbe3ee !important;
    opacity:1 !important;
}

/* منع أي شفافية أو فلتر يجعل النص باهتا */
p,
small,
h1,
h2,
h3,
h4,
.tool-detail-copy,
.section-head,
.hero-copy,
.ai-feature-copy,
.faq-section,
.motion-card-copy {
    text-shadow:none !important;
}


/* =========================================================
   NUJIZ PROFESSIONAL HEADER + FOOTER
   ========================================================= */

/* ===== HEADER ===== */

.site-header,
header.site-header,
header{
    position:sticky;
    top:0;
    z-index:999;
    background:rgba(255,255,255,.94) !important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(103,65,232,.10);
    box-shadow:0 8px 30px rgba(20,32,58,.06);
}

.site-header .wrap,
header .wrap{
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

/* الشعار */
.site-header .brand,
header .brand{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
}

.site-header .brand-mark,
header .brand-mark{
    width:52px;
    height:52px;
    border-radius:16px;
    display:grid;
    place-items:center;
    box-shadow:0 10px 28px rgba(103,65,232,.20);
}

/* روابط القائمة */
.site-header nav,
header nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.site-header nav a,
header nav a{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:0 14px;
    border-radius:12px;
    color:#263247 !important;
    -webkit-text-fill-color:#263247 !important;
    font-weight:700;
    text-decoration:none;
    transition:.2s ease;
}

.site-header nav a:hover,
header nav a:hover{
    color:#6741e8 !important;
    -webkit-text-fill-color:#6741e8 !important;
    background:#f4f0ff;
    transform:translateY(-1px);
}

/* خط صغير عند hover */
.site-header nav a::after,
header nav a::after{
    content:"";
    position:absolute;
    bottom:4px;
    left:50%;
    width:0;
    height:2px;
    border-radius:10px;
    background:#6741e8;
    transform:translateX(-50%);
    transition:.2s ease;
}

.site-header nav a:hover::after,
header nav a:hover::after{
    width:22px;
}

/* الأزرار */
.site-header .header-actions,
header .header-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.site-header .header-actions a,
header .header-actions a{
    min-height:44px;
    padding:0 16px;
    border-radius:13px;
    font-weight:800;
}

/* زر اللغة */
.site-header a[href*="/en"],
header a[href*="/en"]{
    background:#fff;
    border:1px solid #e2e8f0;
    color:#17213a !important;
    -webkit-text-fill-color:#17213a !important;
}

/* زر استكشف الأدوات */
.site-header a[href="#tools"],
.site-header a[href="/#tools"],
header a[href="#tools"],
header a[href="/#tools"]{
    background:linear-gradient(135deg,#7548f7,#5f35df);
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    border:none;
    box-shadow:0 10px 24px rgba(103,65,232,.22);
}

.site-header a[href="#tools"]:hover,
.site-header a[href="/#tools"]:hover,
header a[href="#tools"]:hover,
header a[href="/#tools"]:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 30px rgba(103,65,232,.28);
}


/* ===== FOOTER ===== */

.site-footer,
footer.site-footer,
footer{
    position:relative;
    overflow:hidden;
    background:
      radial-gradient(circle at 85% 10%,rgba(117,72,247,.18),transparent 28%),
      radial-gradient(circle at 15% 95%,rgba(193,255,70,.08),transparent 26%),
      #0d2340 !important;
    border-top:1px solid rgba(255,255,255,.06);
    color:#eaf0f7 !important;
    padding-top:64px;
}

/* خط علوي زخرفي */
.site-footer::before,
footer.site-footer::before,
footer::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:3px;
    background:linear-gradient(90deg,#6d41ed,#a78bfa,#c1ff46);
}

.site-footer .footer-grid,
footer .footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1fr;
    gap:44px;
    align-items:start;
}

/* معلومات العلامة */
.site-footer .footer-about,
footer .footer-about{
    max-width:380px;
}

.site-footer .brand,
footer .brand{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
    text-decoration:none;
}

.site-footer .brand-mark,
footer .brand-mark{
    width:54px;
    height:54px;
    border-radius:17px;
    background:#6f45ee;
    box-shadow:0 12px 34px rgba(112,69,238,.28);
}

.site-footer .brand-copy strong,
footer .brand-copy strong{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-size:20px;
}

.site-footer .brand-copy small,
footer .brand-copy small{
    color:#c8d3e1 !important;
    -webkit-text-fill-color:#c8d3e1 !important;
}

.site-footer .footer-about p,
footer .footer-about p{
    color:#cbd5e1 !important;
    -webkit-text-fill-color:#cbd5e1 !important;
    line-height:1.9;
    font-size:14px;
}

/* عناوين الأعمدة */
.site-footer .footer-col h3,
footer .footer-col h3{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    margin:0 0 16px;
    font-size:15px;
    font-weight:800;
}

/* روابط الفوتر */
.site-footer .footer-col a,
footer .footer-col a{
    display:block;
    width:max-content;
    max-width:100%;
    color:#d9e2ec !important;
    -webkit-text-fill-color:#d9e2ec !important;
    text-decoration:none;
    margin:10px 0;
    transition:.2s ease;
}

.site-footer .footer-col a:hover,
footer .footer-col a:hover{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    transform:translateX(-3px);
}

/* الفاصل السفلي */
.site-footer .footer-base,
footer .footer-base{
    margin-top:48px;
    padding:22px 0;
    border-top:1px solid rgba(255,255,255,.10);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    color:#9fb0c4 !important;
    -webkit-text-fill-color:#9fb0c4 !important;
    font-size:13px;
}

/* النصوص الصغيرة */
.site-footer small,
footer small{
    color:#aebccd !important;
    -webkit-text-fill-color:#aebccd !important;
}

/* ===== MOBILE ===== */

@media(max-width:900px){

    .site-header .wrap,
    header .wrap{
        min-height:70px;
        gap:12px;
    }

    .site-header nav,
    header nav{
        overflow-x:auto;
        justify-content:flex-start;
        scrollbar-width:none;
    }

    .site-header nav::-webkit-scrollbar,
    header nav::-webkit-scrollbar{
        display:none;
    }

    .site-header nav a,
    header nav a{
        white-space:nowrap;
        padding:0 11px;
        font-size:13px;
    }

    .site-footer .footer-grid,
    footer .footer-grid{
        grid-template-columns:1fr 1fr;
        gap:30px;
    }
}

@media(max-width:600px){

    .site-header .brand-copy{
        display:none;
    }

    .site-footer,
    footer{
        padding-top:44px;
    }

    .site-footer .footer-grid,
    footer .footer-grid{
        grid-template-columns:1fr;
        gap:26px;
    }

    .site-footer .footer-base,
    footer .footer-base{
        flex-direction:column;
        align-items:flex-start;
        margin-top:32px;
    }
}


/* ===== Mobile Header Fix ===== */
@media (max-width: 680px){

  html,body{
    overflow-x:hidden !important;
  }

  .site-header .wrap,
  .site-header .header-inner{
    width:100% !important;
    max-width:100% !important;
  }

  .site-header .header-inner{
    min-height:auto !important;
    padding:10px 14px !important;
    gap:8px !important;
    display:grid !important;
    grid-template-columns:auto 1fr !important;
    align-items:center !important;
  }

  .site-header .brand{
    min-width:0 !important;
    max-width:100% !important;
  }

  .site-header .brand-mark{
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
  }

  .site-header .brand-copy{
    min-width:0 !important;
  }

  .site-header .brand-copy strong{
    font-size:18px !important;
    white-space:nowrap !important;
  }

  .site-header .brand-copy small{
    display:none !important;
  }

  .site-header .header-actions{
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:6px !important;
    min-width:0 !important;
  }

  .site-header .lang-link,
  .site-header .header-cta{
    min-height:38px !important;
    height:38px !important;
    padding:0 10px !important;
    font-size:12px !important;
    white-space:nowrap !important;
    border-radius:12px !important;
  }

  .site-header .main-nav{
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    padding:8px 0 2px !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .site-header .main-nav::-webkit-scrollbar{
    display:none !important;
  }

  .site-header .main-nav a{
    flex:0 0 auto !important;
    white-space:nowrap !important;
    font-size:13px !important;
    padding:9px 11px !important;
    border-radius:10px !important;
  }

  .tool-menu{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    display:flex !important;
    grid-template-columns:none !important;
    gap:6px !important;
    padding:8px !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .tool-menu::-webkit-scrollbar{
    display:none !important;
  }

  .tool-tab{
    flex:0 0 auto !important;
    min-width:max-content !important;
    padding:12px 15px !important;
    font-size:14px !important;
    white-space:nowrap !important;
  }

}

/* NUJIZ MOTION BUTTONS UNIFORM START */

/* مساحة النص ثابتة حتى تبدأ الازرار من نفس المستوى */
html body #motion-showcase .motion-card-copy{
    display:flex !important;
    flex-direction:column !important;
}

html body #motion-showcase .motion-card-copy p{
    min-height:40px !important;
}

/* زر واحد متناسق في جميع البطاقات */
html body #motion-showcase .motion-card-copy > a{
    width:100% !important;
    min-width:0 !important;
    min-height:48px !important;
    height:48px !important;

    margin:0 !important;
    padding:0 12px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;

    border:1px solid rgba(255,255,255,.13) !important;
    border-radius:12px !important;

    background:rgba(255,255,255,.075) !important;

    color:#fff !important;
    -webkit-text-fill-color:#fff !important;

    font-size:10px !important;
    font-weight:900 !important;
    line-height:1 !important;

    box-sizing:border-box !important;
    text-decoration:none !important;
}

/* النص */
html body #motion-showcase .motion-card-copy > a > span,
html body #motion-showcase .motion-card-copy > a{
    white-space:nowrap !important;
}

/* مربع السهم */
html body #motion-showcase .motion-card-copy > a > b{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;

    display:grid !important;
    place-items:center !important;

    margin:0 !important;
    padding:0 !important;

    border-radius:8px !important;

    background:var(--motion-accent) !important;

    color:#fff !important;
    -webkit-text-fill-color:#fff !important;

    font-size:14px !important;
    line-height:1 !important;
}

/* لا يسمح بتكدس اكثر من زر داخل البطاقة */
html body #motion-showcase .motion-card-copy > a + a{
    margin-top:0 !important;
}

/* NUJIZ MOTION BUTTONS UNIFORM END */