/* WenYou homepage live shell — cream + green, sticky CTA, steps, LIVE ROUTE, typing, blue ticks */
:root {
  --cream: #f4eedf;
  --paper: #fffdf7;
  --ink: #12201a;
  --mut: #58645d;
  --line: #d9d0bc;
  --green: #25d366;
  --deep: #0f3d2b;
  --sand: #e8c77a;
  --mint: #e7f6ec;
  --tick-read: #53bdeb;
}

html { color-scheme: light; scroll-behavior: smooth; }
body.wy-home {
  margin: 0;
  /* lower page = cream/beige; hero entry band = deep green (below) */
  background: var(--cream);
  color: var(--ink);
  font-family: "IBM Plex Sans", "IBM Plex Sans Arabic", system-ui, sans-serif;
  line-height: 1.55;
  overflow-x: hidden;
}

.wy-home a { color: inherit; }
.wy-home :focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.wy-w { max-width: 1100px; margin: auto; padding: 0 22px; }
/* full-bleed hero green: main no longer clips width */
main.wy-w {
  max-width: none;
  padding: 0;
  width: 100%;
}

/* Sticky header */
.wy-top {
  position: sticky;
  top: 0;
  z-index: 80;
  border-bottom: 1px solid var(--line);
  background: rgba(244, 238, 223, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.wy-top .wy-w {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  gap: 16px;
  max-width: 1100px;
  margin-inline: auto;
  width: 100%;
  box-sizing: border-box;
  padding-inline: 22px;
}
.wy-logo {
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: -0.02em;
  text-decoration: none;
}
.wy-top nav {
  display: flex;
  align-items: center;
  gap: 22px;
}
.wy-top nav a:not(.wy-btn) {
  text-decoration: none;
  color: var(--mut);
  font-size: 0.95rem;
}
.wy-top nav a:not(.wy-btn):hover { color: var(--ink); }
@media (max-width: 720px) {
  .wy-top nav a:not(.wy-btn) { display: none; }
}

.wy-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  background: var(--green);
  color: #0c1a12 !important;
  font: 600 1rem inherit;
  border: 0;
  border-radius: 99px;
  padding: 12px 22px;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.wy-btn::after {
  content: "";
  position: absolute;
  inset: -20% -40%;
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.55) 50%, transparent 62%);
  transform: translateX(-130%) skewX(-12deg);
  animation: wyShine 2.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes wyShine {
  0%, 48% { transform: translateX(-130%) skewX(-12deg); opacity: 0; }
  52% { opacity: 1; }
  72% { transform: translateX(130%) skewX(-12deg); opacity: 1; }
  76%, 100% { transform: translateX(130%) skewX(-12deg); opacity: 0; }
}
.wy-btn .dl-arrow {
  display: inline-block;
  animation: wyBounce 1.15s ease-in-out infinite;
}
@keyframes wyBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(5px); }
}

/* Hero — deep green entry (graphics live here); cream continues below */
.wy-hero {
  display: grid;
  gap: 44px;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  padding: 48px max(22px, calc((100% - 1100px) / 2)) 64px;
  color: #efe9da;
  background:
    radial-gradient(720px 420px at 18% 20%, rgba(37, 211, 102, 0.28), transparent 62%),
    radial-gradient(640px 380px at 88% 70%, rgba(232, 199, 122, 0.16), transparent 58%),
    radial-gradient(900px 500px at 50% 120%, rgba(0, 0, 0, 0.22), transparent 55%),
    var(--deep);
}
@media (min-width: 900px) {
  .wy-hero { grid-template-columns: 1fr 400px; gap: 72px; padding: 72px max(22px, calc((100% - 1100px) / 2)) 88px; }
}
.wy-hero h1 {
  font-size: clamp(2.4rem, 6vw, 4.2rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
  font-weight: 600;
  margin: 0 0 18px;
  color: #fffdf7;
}
.wy-lede {
  font-size: 1.15rem;
  color: #c9d3c6;
  max-width: 28em;
  margin: 0 0 26px;
}
.wy-acts {
  display: flex;
  gap: 22px;
  align-items: center;
  flex-wrap: wrap;
}
.wy-acts a:not(.wy-btn) {
  text-underline-offset: 5px;
  color: #efe9da;
}
.wy-credit {
  margin-top: 22px;
  font-size: 0.92rem;
  color: #a8b5ac;
}
.wy-credit a { color: #efe9da; text-underline-offset: 3px; }

/* Phone sits on the green hero — no nested cream card */
.wy-stage {
  background: transparent;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}
.wy-stage .phone {
  width: min(320px, 100%);
  margin: 0 auto;
  background: #12201a;
  border-radius: 42px;
  padding: 10px;
  --mine: #d8d8de;
  --mine-ink: #333;
  --mine-time: #727275;
  --mine-tick: #8e8e93;
  --theme: #d8d8de;
  --theme-ink: #12201a;
}
.wy-stage .scr {
  position: relative;
  aspect-ratio: 1080 / 2410;
  border-radius: 33px;
  overflow: hidden;
  container-type: inline-size;
  background: #fff;
}
.wy-stage .ui {
  --u: calc(300px / 1080);
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  /* Phone chrome is always LTR: incoming LEFT, outgoing RIGHT — independent of page lang */
  direction: ltr;
  font-family: Roboto, "Noto Sans Arabic", "Helvetica Neue", Arial, system-ui, sans-serif;
  line-height: 1;
  color: #1c1c1e;
}
@supports (width: 1cqw) {
  .wy-stage .ui { --u: calc(100cqw / 1080); }
}
.wy-stage .ui svg { display: block; pointer-events: none; }
.wy-stage .sb, .wy-stage .hdi { position: absolute; left: 0; top: 0; width: 100%; }
.wy-stage .sb { height: calc(140 * var(--u)); }
.wy-stage .hdi { height: calc(345 * var(--u)); }
.wy-stage .hd { position: absolute; left: 0; top: 0; width: 100%; height: calc(345 * var(--u)); }
.wy-stage .pl {
  position: absolute;
  box-sizing: border-box;
  background: #f5f5f7;
  border: calc(3 * var(--u)) solid #8e8e93;
  border-radius: 999px;
}
.wy-stage .bk { left: calc(68 * var(--u)); top: calc(189 * var(--u)); width: calc(137 * var(--u)); height: calc(137 * var(--u)); }
.wy-stage .wh { left: calc(226 * var(--u)); top: calc(188 * var(--u)); width: calc(520 * var(--u)); height: calc(140 * var(--u)); }
.wy-stage .ac {
  left: calc(767 * var(--u));
  top: calc(189 * var(--u));
  width: calc(287 * var(--u));
  height: calc(137 * var(--u));
  background: var(--theme);
  border-color: var(--theme);
}
.wy-stage .av {
  position: absolute;
  left: calc(243 * var(--u));
  top: calc(207 * var(--u));
  width: calc(104 * var(--u));
  height: calc(104 * var(--u));
  border-radius: 50%;
}
.wy-stage .nm {
  position: absolute;
  left: calc(373 * var(--u));
  top: calc(213 * var(--u));
  font-size: calc(41.5 * var(--u));
  line-height: calc(48.6 * var(--u));
  font-weight: 700;
  white-space: nowrap;
}
.wy-stage .rt {
  position: absolute;
  left: calc(373 * var(--u));
  top: calc(265.8 * var(--u));
  width: calc(340 * var(--u));
  height: calc(36.9 * var(--u));
  font-size: calc(31.5 * var(--u));
  line-height: calc(36.9 * var(--u));
  color: #636366;
  white-space: nowrap;
  overflow: hidden;
}
.wy-stage .log {
  flex: 1;
  min-height: 0;
  margin-top: calc(345 * var(--u));
  padding: 0 calc(42 * var(--u)) calc(25 * var(--u));
  display: flex;
  flex-direction: column;
  gap: calc(9 * var(--u));
  overflow: hidden;
  direction: ltr; /* keep sides physical: start=left, end=right */
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 calc(50 * var(--u)));
  mask-image: linear-gradient(to bottom, transparent 0, #000 calc(50 * var(--u)));
}
.wy-stage .log > * { flex: none; }
.wy-stage .log > :first-child { margin-top: auto; }
.wy-stage .day {
  align-self: center;
  height: calc(72 * var(--u));
  padding: calc(2.5 * var(--u)) calc(33 * var(--u)) 0;
  margin-bottom: calc(11 * var(--u));
  border-radius: calc(36 * var(--u));
  background: #aaaaab;
  color: #fff;
  font-size: calc(34.1 * var(--u));
  line-height: calc(69.5 * var(--u));
}
.wy-stage .b {
  --b-ink: #333;
  --time: #727275;
  --tick: #8e8e93;
  box-sizing: border-box;
  max-width: 84%;
  display: flex;
  align-items: flex-end;
  padding: calc(11 * var(--u)) calc(10 * var(--u)) calc(8 * var(--u)) calc(13 * var(--u));
  color: var(--b-ink);
  font-size: calc(36.75 * var(--u));
  line-height: calc(43 * var(--u));
  overflow-wrap: anywhere;
  direction: ltr; /* DE/EN default */
}
/* Arabic bubble text RTL — meta/ticks stay LTR so ✓✓ never mirrors */
html[dir="rtl"] .wy-stage .b:not(.pic):not(.typing) { direction: rtl; }
html[dir="rtl"] .wy-stage .b:not(.pic):not(.held):not(.typing) {
  padding: calc(11 * var(--u)) calc(13 * var(--u)) calc(8 * var(--u)) calc(10 * var(--u));
}
.wy-stage .b.new { animation: wyUp 0.22s ease-out; }
@keyframes wyUp {
  from { transform: translateY(calc(40 * var(--u))); opacity: 0; }
}
.wy-stage .in {
  align-self: flex-start; /* LEFT — other person */
  background: #f2f2f5;
  border-radius: calc(31 * var(--u)) calc(31 * var(--u)) calc(31 * var(--u)) calc(9 * var(--u));
}
.wy-stage .out {
  align-self: flex-end; /* RIGHT — you */
  background: var(--mine);
  --b-ink: var(--mine-ink);
  --time: var(--mine-time);
  --tick: var(--mine-tick);
  border-radius: calc(31 * var(--u)) calc(31 * var(--u)) calc(9 * var(--u)) calc(31 * var(--u));
}
.wy-stage .out.sms {
  background: var(--sand);
  --b-ink: #12201a;
  --time: rgba(18, 32, 26, 0.72);
  --tick: rgba(18, 32, 26, 0.62);
}
.wy-stage .out.held {
  background: transparent;
  border: calc(4 * var(--u)) dashed #8e8e93;
}
.wy-stage .pic { display: block; position: relative; padding: calc(8 * var(--u)); }
.wy-stage .pic img {
  display: block;
  width: calc(560 * var(--u));
  height: auto;
  border-radius: calc(24 * var(--u));
}
.wy-stage .m {
  display: flex;
  align-items: flex-end;
  flex: none;
  margin-left: calc(31 * var(--u));
  margin-right: 0;
  font-size: calc(26.25 * var(--u));
  line-height: calc(30.8 * var(--u));
  color: var(--time);
  white-space: nowrap;
  direction: ltr; /* time + ticks always LTR — never mirrored in AR */
  unicode-bidi: isolate;
}
html[dir="rtl"] .wy-stage .b:not(.pic) .m {
  margin-left: 0;
  margin-right: calc(31 * var(--u));
}
.wy-stage .m > * + * { margin-left: calc(10.6 * var(--u)); }
.wy-stage .tk {
  width: calc(28 * var(--u));
  height: calc(18 * var(--u));
  margin-bottom: calc(4 * var(--u));
  color: var(--tick);
  transform: none !important;
  flex-shrink: 0;
}
.wy-stage .tk.delivered { color: var(--tick); } /* ✓✓ silver — between single ✓ and blue read */
.wy-stage .tk.read { color: var(--tick-read); }
.wy-stage .tk.ck {
  width: calc(26 * var(--u));
  height: calc(26 * var(--u));
}

/* Typing indicator — LEFT only (other person), same as .in */
.wy-stage .typing {
  align-self: flex-start !important;
  max-width: 40%;
  background: #f2f2f5;
  border-radius: calc(31 * var(--u)) calc(31 * var(--u)) calc(31 * var(--u)) calc(9 * var(--u));
  padding: calc(18 * var(--u)) calc(28 * var(--u));
  display: flex;
  gap: calc(10 * var(--u));
  align-items: center;
  direction: ltr;
}
.wy-stage .typing i {
  width: calc(14 * var(--u));
  height: calc(14 * var(--u));
  border-radius: 50%;
  background: #8e8e93;
  animation: wyDot 1.2s ease-in-out infinite;
}
.wy-stage .typing i:nth-child(2) { animation-delay: 0.15s; }
.wy-stage .typing i:nth-child(3) { animation-delay: 0.3s; }
@keyframes wyDot {
  0%, 60%, 100% { opacity: 0.35; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(calc(-6 * var(--u))); }
}

.wy-stage .ask {
  flex: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: calc(10 * var(--u)) calc(20 * var(--u));
  margin: 0 calc(42 * var(--u)) calc(14 * var(--u));
  padding: calc(18 * var(--u)) calc(28 * var(--u));
  border-radius: calc(44 * var(--u));
  background: var(--sand);
  color: #12201a;
  font-size: calc(34 * var(--u));
  line-height: 1.25;
  direction: rtl;
}
.wy-stage .ask[hidden] { display: none; }
.wy-stage .ask button {
  font-family: inherit;
  font-weight: 600;
  font-size: calc(34 * var(--u));
  border: 0;
  background: #12201a;
  color: #fff;
  border-radius: 99px;
  padding: calc(20 * var(--u)) calc(32 * var(--u));
  cursor: pointer;
}
.wy-stage .ask button + button {
  background: transparent;
  color: #12201a;
  text-decoration: underline;
}
.wy-stage .bar { position: relative; flex: none; height: calc(240 * var(--u)); }
.wy-stage .pls {
  position: absolute;
  left: calc(34 * var(--u));
  top: calc(48 * var(--u));
  width: calc(85 * var(--u));
  height: calc(85 * var(--u));
}
.wy-stage .pls circle {
  fill: var(--theme);
  stroke: var(--theme);
}
.wy-stage .pls path { stroke: var(--theme-ink); }
.wy-stage .fld {
  position: absolute;
  left: calc(141.9 * var(--u));
  top: calc(11 * var(--u));
  box-sizing: border-box;
  width: calc(744.2 * var(--u));
  height: calc(137 * var(--u));
  padding: calc(29.5 * var(--u)) calc(60 * var(--u)) 0 calc(41 * var(--u));
  border: calc(3 * var(--u)) solid var(--theme);
  border-radius: 999px;
  background: #f2f2f5;
  color: #727274;
  font-size: calc(39.4 * var(--u));
  direction: rtl;
}
.wy-stage .snd {
  position: absolute;
  left: calc(915 * var(--u));
  top: calc(11 * var(--u));
  width: calc(137 * var(--u));
  height: calc(137 * var(--u));
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--theme);
  cursor: pointer;
}
.wy-stage .snd svg { width: 100%; height: 100%; }
.wy-stage .snd rect { fill: var(--theme-ink); }
.wy-stage .scr.off .snd { background: var(--sand); }
.wy-stage .scr.off .snd rect { fill: #12201a; }
.wy-stage .home {
  position: absolute;
  left: calc(398 * var(--u));
  top: calc(204 * var(--u));
  width: calc(284 * var(--u));
  height: calc(10 * var(--u));
  border-radius: calc(5 * var(--u));
  background: var(--theme);
}
.wy-stage .nm, .wy-stage .rt { text-align: left; }
html[dir="rtl"] .wy-stage .nm,
html[dir="rtl"] .wy-stage .rt { direction: rtl; }
html[dir="ltr"] .wy-stage .nm,
html[dir="ltr"] .wy-stage .rt { direction: ltr; }
html[dir="ltr"] .wy-stage .fld { direction: ltr; padding: calc(29.5 * var(--u)) 0 0 calc(41 * var(--u)); }
html[dir="ltr"] .wy-stage .ask { direction: ltr; }

.wy-ctl {
  width: min(320px, 100%);
  margin: 16px auto 0;
  display: grid;
  gap: 14px;
  font-size: 0.9rem;
  color: #efe9da;
}
.wy-ctl h2 { font-size: 0.9rem; font-weight: 600; margin: 0 0 6px; color: #efe9da; }
.wy-ctl .hint { margin: 6px 0 0; color: #c9d3c6; }
.wy-ctl .sw { display: flex; justify-content: space-between; align-items: center; }
.wy-ctl .tg {
  width: 50px;
  height: 30px;
  border-radius: 99px;
  border: 0;
  background: var(--green);
  position: relative;
  cursor: pointer;
}
.wy-ctl .tg::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 23px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  transition: left 0.05s linear, background-color 0.05s linear;
}
.wy-ctl .tg[aria-checked="false"] { background: #7a8a80; }
.wy-ctl .tg[aria-checked="false"]::after { left: 3px; }
.wy-ctl .seg {
  display: flex;
  border: 1px solid rgba(239, 233, 218, 0.28);
  border-radius: 99px;
  overflow: hidden;
}
.wy-ctl .seg button {
  flex: 1;
  font: 500 0.82rem inherit;
  color: #efe9da;
  background: transparent;
  border: 0;
  padding: 9px 6px;
  cursor: pointer;
}
.wy-ctl .seg button[aria-pressed="true"] {
  background: #efe9da;
  color: var(--deep);
}
.wy-ctl .dots { display: flex; gap: 10px; }
.wy-ctl .dots button {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  outline: 1px solid rgba(239, 233, 218, 0.35);
}
.wy-ctl .dots button[aria-pressed="true"] {
  border-color: #fff;
  outline: 2px solid #efe9da;
}

/* Steps + LIVE ROUTE (cream band) */
.wy-flow {
  display: grid;
  gap: 36px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 64px 22px;
  border-top: 1px solid var(--line);
  box-sizing: border-box;
}
@media (min-width: 900px) {
  .wy-flow { grid-template-columns: 1.05fr 0.95fr; gap: 56px; align-items: start; }
}
.wy-flow-copy h2 {
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
  margin: 0 0 14px;
  font-weight: 600;
}
.wy-flow-copy > p { color: var(--mut); margin: 0 0 22px; max-width: 32em; }
.wy-steps { list-style: none; margin: 0; padding: 0; }
.wy-step {
  padding: 18px 0;
  border-top: 1px solid var(--line);
  cursor: pointer;
  transition: color 0.25s ease;
  color: #9aa39c;
}
.wy-step:last-child { border-bottom: 1px solid var(--line); }
.wy-step .n {
  display: inline-block;
  min-width: 2ch;
  margin-inline-end: 10px;
  font-variant-numeric: tabular-nums;
}
.wy-step h3 {
  display: inline;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
}
.wy-step p {
  margin: 8px 0 0;
  font-size: 0.95rem;
  line-height: 1.45;
}
.wy-step.is-active {
  color: var(--ink);
  border-top-color: var(--green);
  box-shadow: inset 0 -2px 0 var(--green);
}
.wy-step.is-active h3 { font-weight: 700; }

.wy-live {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px 18px 16px;
  box-shadow: 0 16px 40px -28px rgba(15, 61, 43, 0.35);
}
.wy-live-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.wy-live-kicker {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a8070;
  font-weight: 600;
}
.wy-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  color: var(--ink);
  background: var(--mint);
  border-radius: 99px;
  padding: 6px 12px;
}
.wy-live-pill[data-route="sms"],
.wy-live-pill[data-route="ask"] { background: #f7efd8; }
.wy-live-pill i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
}
.wy-live-pill[data-route="sms"] i,
.wy-live-pill[data-route="ask"] i { background: var(--sand); }
.wy-live-svg { width: 100%; height: auto; display: block; }
.wy-live-path {
  fill: none;
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-dasharray: 8 10;
  transition: stroke 0.2s ease, opacity 0.2s ease;
}
/* 01: green LOWER through WENYOU */
.wy-live-path.is-chat { stroke: var(--green); opacity: 1; animation: wyDash 2.4s linear infinite; }
/* 03: green UPPER only — lower + ask must be is-off */
.wy-live-path.is-sms { stroke: var(--green); opacity: 1; animation: wyDash 2.4s linear infinite; }
/* 02: green phone → center only */
.wy-live-path.is-ask { stroke: var(--green); opacity: 1; animation: wyDash 2.4s linear infinite; }
.wy-live-path.is-dim { stroke: #d9d0bc; opacity: 0.22; animation: none; }
.wy-live-path.is-off {
  stroke: transparent;
  opacity: 0;
  animation: none;
  pointer-events: none;
  visibility: hidden;
}
.wy-live-hub.is-hidden,
.wy-hub-face.is-hidden { opacity: 0; pointer-events: none; }
.wy-hub-face { transition: opacity 0.2s ease; }
.wy-hub-sms-icon { fill: var(--green); }
.wy-live-q {
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
.wy-live-q.is-on { opacity: 1; }
.wy-live-q circle {
  fill: #fff;
  stroke: var(--green);
  stroke-width: 2.5;
}
.wy-live-q text {
  fill: var(--green);
  font-size: 22px;
  font-weight: 700;
  font-family: inherit;
}
@keyframes wyDash {
  to { stroke-dashoffset: -36; }
}
.wy-live-note {
  margin: 8px 0 0;
  text-align: center;
  font-size: 0.88rem;
  color: var(--mut);
  min-height: 1.3em;
}
.wy-live-legend {
  display: flex;
  gap: 18px;
  justify-content: center;
  margin-top: 12px;
  font-size: 0.85rem;
  color: var(--mut);
}
.wy-live-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.wy-live-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.wy-live-legend .c { background: var(--green); }
.wy-live-legend .s { background: var(--sand); }

/* Compare table */
.wy-routes {
  display: grid;
  gap: 28px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 64px 22px;
  border-top: 1px solid var(--line);
  box-sizing: border-box;
}
@media (min-width: 900px) {
  .wy-routes { grid-template-columns: 1fr 1.15fr; gap: 64px; }
}
.wy-routes h2 {
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  line-height: 1.08;
  margin: 0 0 14px;
  font-weight: 600;
}
.wy-routes p { color: var(--mut); margin: 0 0 12px; }
.wy-table-wrap {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
}
.wy-routes table {
  width: 100%;
  border-collapse: collapse;
}
.wy-routes th, .wy-routes td {
  text-align: start;
  padding: 14px 16px;
  border-top: 1px solid var(--line);
  vertical-align: top;
}
.wy-routes thead th {
  border-top: 0;
  background: var(--mint);
  color: var(--deep);
  font-weight: 600;
  font-size: 0.92rem;
}
.wy-routes td:first-child { font-weight: 500; width: 46%; }
.wy-routes .y { color: var(--green); font-weight: 700; }

/* FAQ */
.wy-faq {
  display: grid;
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 64px 22px 72px;
  border-top: 1px solid var(--line);
  box-sizing: border-box;
}
@media (min-width: 900px) {
  .wy-faq { grid-template-columns: 1fr 1.15fr; gap: 64px; }
}
.wy-faq h2 {
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  margin: 0 0 10px;
  font-weight: 600;
}
.wy-faq > div > p, .wy-faq .lead { color: var(--mut); margin: 0; }
.wy-faq details { border-top: 1px solid var(--line); }
.wy-faq details:last-child { border-bottom: 1px solid var(--line); }
.wy-faq summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 0;
  font-weight: 500;
  font-size: 1.05rem;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.wy-faq summary::-webkit-details-marker { display: none; }
.wy-faq summary::after { content: "+"; font-size: 1.35rem; line-height: 1; }
.wy-faq details[open] summary::after { content: "\2212"; }
.wy-faq details p { margin: 0 0 18px; color: var(--mut); max-width: 34em; }

/* Footer reuse */
.wy-home .site-footer {
  background: #fffdf7;
  border-top: 1px solid var(--line);
  padding: 48px 0 72px;
}
.wy-home .site-footer .wrap {
  max-width: 1100px;
  margin: auto;
  padding: 0 22px;
  box-sizing: border-box;
}
.wy-home .footer-top {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 36px;
}
.wy-home .footer-download {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--green);
  color: #0c1a12 !important;
  font: 600 1rem inherit;
  border-radius: 99px;
  padding: 14px 28px;
  text-decoration: none;
}
.wy-home .footer-social { display: flex; gap: 12px; }
.wy-home .footer-social a {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--line);
  text-decoration: none;
  font-size: 1.25rem;
}
.wy-home .footer-social a[aria-label="Telegram"] { color: #229ED9; }
.wy-home .footer-social a[aria-label="X"] { color: #0F1419; }
.wy-home .footer-social a[aria-label="Instagram"] { color: #E4405F; }
.wy-home .footer-social a[aria-label="GitHub"] { color: #181717; }
.wy-home .footer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px 24px;
}
@media (min-width: 800px) {
  .wy-home .footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.wy-home .footer-col h4 { margin: 0 0 12px; color: var(--deep); font-size: 0.95rem; }
.wy-home .footer-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.wy-home .footer-col a { color: var(--mut); text-decoration: none; }
.wy-home .footer-col a:hover { color: var(--deep); }
.wy-home .footer-legal {
  margin-top: 36px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 10px;
  color: var(--mut);
  font-size: 0.9rem;
}
.wy-home .footer-lang summary {
  cursor: pointer;
  list-style: none;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 99px;
  padding: 8px 14px;
}

html[dir="rtl"] .wy-home { font-family: "IBM Plex Sans Arabic", system-ui, sans-serif; }
html[dir="rtl"] .wy-faq summary { flex-direction: row-reverse; }
html[dir="rtl"] .wy-routes th, html[dir="rtl"] .wy-routes td { text-align: right; }

@media (prefers-reduced-motion: reduce) {
  .wy-btn::after, .wy-btn .dl-arrow, .wy-live-path, .wy-stage .typing i, .wy-stage .b.new {
    animation: none !important;
  }
}
