:root {
  --brand: #7C5CE4;
  --brand-deep: #5B3FC4;
  --brand-soft: #B8A3FF;
  --brand-wash: #F1ECFD;
  --ink: #141320;
  --ink-2: #3B3850;
  --muted: #6E6A7C;
  --line: rgba(20, 19, 32, .10);
  --surface: #FFFFFF;
  --ground: #F8F7FB;
  --card: rgba(255,255,255,.72);
  --ease: cubic-bezier(.2,.8,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ground); }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 50% 0%, rgba(124,92,228,.07), transparent 34rem),
    #FBFAFD;
  font-family: "DM Sans", system-ui, sans-serif;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }

.serif-heading {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  line-height: .95;
  letter-spacing: -.03em;
}

.site-header {
  width: min(1440px, calc(100% - 48px));
  margin: 0 auto;
  height: 92px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: blur(12px);
}

.brand {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  gap: 13px;
}
.brand-mark {
  width: 38px; height: 38px; position: relative; display: inline-block;
  animation: markFloat 5s ease-in-out infinite;
}
.brand-mark i {
  position: absolute; width: 8px; height: 16px; left: 15px; top: 2px;
  border-radius: 999px; background: var(--brand); transform-origin: 4px 17px;
}
.brand-mark i:nth-child(2) { transform: rotate(60deg); }
.brand-mark i:nth-child(3) { transform: rotate(120deg); }
.brand-mark i:nth-child(4) { transform: rotate(180deg); }
.brand-mark i:nth-child(5) { transform: rotate(240deg); }
.brand-mark i:nth-child(6) { transform: rotate(300deg); }

.brand-copy { display:flex; flex-direction:column; line-height:1; }
.brand-copy strong { font-size: 21px; letter-spacing: -.7px; }
.brand-copy strong span { color: #6f6b7a; }
.brand-copy small { margin-top: 6px; font-size: 8px; letter-spacing: 2.1px; color: #8b8795; }

.nav { display:flex; align-items:center; gap:34px; font-size:14px; color:var(--ink-2); }
.nav a { transition: color .2s ease, transform .2s ease; }
.nav a:hover { color: var(--brand-deep); transform: translateY(-1px); }

.header-actions { justify-self:end; display:flex; gap:10px; align-items:center; }

.btn {
  min-height: 46px; border-radius:999px; padding:0 21px; display:inline-flex; align-items:center; justify-content:center;
  gap:9px; font-size:14px; font-weight:600; border:1px solid var(--line);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s ease, color .2s ease;
  background: rgba(255,255,255,.72);
}
.btn:hover { transform: translateY(-2px); }
.btn-primary {
  color: white; border-color: transparent; background: linear-gradient(135deg, #8568E8, #6D4FE0);
  box-shadow: 0 12px 35px rgba(91,63,196,.20);
}
.btn-primary:hover { box-shadow: 0 16px 40px rgba(91,63,196,.28); }
.btn-ghost { background: rgba(255,255,255,.72); backdrop-filter: blur(12px); }
.btn-light { background: #fff; color: var(--ink); }
.btn-outline-accent { background: transparent; color: #fff; border-color: rgba(255,255,255,.55); }
.btn.full { width: 100%; justify-content: center; }
.btn-large { min-height: 52px; padding-inline: 26px; }

.hero {
  min-height: calc(100vh - 92px);
  position: relative;
  display: grid;
  place-items: start center;
  padding: clamp(72px, 8vh, 105px) 24px 80px;
  overflow: hidden;
  isolation: isolate;
}
.hero::before {
  content: "";
  position: absolute; inset: 0; pointer-events:none; z-index:-5;
  background-image: linear-gradient(rgba(124,92,228,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,92,228,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
}
.ambient {
  position: absolute; border-radius: 50%; filter: blur(70px); z-index:-4; opacity:.55; pointer-events:none;
}
.ambient-1 { width: 400px; height:400px; background:rgba(124,92,228,.16); left:3%; top:12%; }
.ambient-2 { width: 500px; height:500px; background:rgba(184,162,255,.18); right:-8%; top:34%; }

.hero-content { width:min(920px,100%); text-align:center; position:relative; z-index:10; }
.eyebrow {
  display:inline-flex; align-items:center; gap:9px; font-size:11px; font-weight:700; letter-spacing:2.5px;
  color:var(--brand-deep); margin-bottom:22px;
}
.pulse-dot {
  width:7px; height:7px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 0 rgba(124,92,228,.35);
  animation:pulse 2.2s infinite;
}
.hero h1 { margin:0; font-size:clamp(60px,7vw,106px); line-height:.92; letter-spacing:-6px; font-weight:700; }
.hero h1 span { color:var(--brand); display:inline-block; }
.hero > .hero-content > p {
  margin:29px auto 0; max-width:650px; color:var(--muted); font-size:clamp(17px,2vw,21px); line-height:1.55;
}
.chat-shell { position:relative; width:min(760px,100%); margin:42px auto 0; }
.chat-glow {
  position:absolute; inset:-3px; border-radius:999px; background:linear-gradient(90deg, #7C5CE4, #B59CFF, #7C5CE4);
  filter: blur(10px); opacity:.20; animation:glowDrift 4s ease-in-out infinite;
}
.chat-box {
  position:relative; height:74px; padding:8px 8px 8px 22px; display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:14px; border-radius:999px; border:1px solid rgba(124,92,228,.25); background:rgba(255,255,255,.88);
  backdrop-filter: blur(20px); box-shadow:0 24px 80px rgba(57,42,107,.12);
}
.ai-orb {
  display:block; width:18px; height:18px; border-radius:50%;
  background: radial-gradient(circle at 32% 28%, #fff 0 9%, transparent 10%), linear-gradient(135deg, #A68AFF, #6F4FE3);
  box-shadow:0 0 18px rgba(124,92,228,.38); animation:orbBreath 3s ease-in-out infinite;
}
.type-line {
  text-align:left; min-width:0; color:#3d394a; font-size:clamp(15px,2vw,18px); white-space:nowrap; overflow:hidden;
}
.caret { display:inline-block; width:1px; height:1.1em; margin-left:3px; vertical-align:-.16em; background:var(--ink); animation:blink .8s steps(1) infinite; }
.send-btn {
  width:56px; height:56px; padding:0; border:0; border-radius:50%; color:white; background:var(--ink); display:grid; place-items:center;
  cursor:pointer; transition:transform .25s var(--ease), background .2s ease;
}
.send-btn:hover { transform:scale(1.06) rotate(-3deg); background:var(--brand-deep); }
.send-btn svg { width:23px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.prompt-chips { margin:18px auto 0; display:flex; justify-content:center; flex-wrap:wrap; gap:9px; }
.prompt-chips button {
  border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.70); padding:10px 14px; color:#625e6d;
  font:inherit; font-size:12px; cursor:pointer; transition:transform .2s var(--ease), border-color .2s ease, color .2s ease, background .2s ease;
}
.prompt-chips button:hover {
  transform:translateY(-2px); border-color:rgba(124,92,228,.32); color:var(--brand-deep); background:white;
}
.hero-actions { display:flex; align-items:center; justify-content:center; gap:22px; margin-top:30px; }
.text-link { color:#777280; font-size:14px; border-bottom:1px solid rgba(119,114,128,.35); }
.visual-wrap { width:min(1150px,94vw); height:390px; position:relative; margin-top:55px; pointer-events:none; }
.violet-orbit, .orb-core {
  position:absolute; left:50%; transform:translateX(-50%); border-radius:50% 50% 0 0 / 100% 100% 0 0;
}
.orbit-1 {
  width:1040px; height:310px; bottom:-80px; border:2px solid rgba(124,92,228,.22);
  background:linear-gradient(180deg, rgba(124,92,228,.04), rgba(124,92,228,.10));
  box-shadow: inset 0 18px 40px rgba(255,255,255,.9), 0 -20px 80px rgba(124,92,228,.06);
  animation:orbitFloat 8s ease-in-out infinite;
}
.orbit-2 {
  width:850px; height:260px; bottom:-72px; border:1px solid rgba(124,92,228,.20);
  background:linear-gradient(180deg, rgba(182,159,255,.12), rgba(124,92,228,.08)); animation:orbitFloat 10s ease-in-out infinite reverse;
}
.orbit-3 {
  width:655px; height:210px; bottom:-66px; border:1px solid rgba(124,92,228,.22);
  background:linear-gradient(180deg, rgba(255,255,255,.5), rgba(124,92,228,.12));
}
.orb-core {
  width:470px; height:170px; bottom:-62px; background:radial-gradient(circle at 50% 0%, #D7CAFF 0%, #A58CF0 38%, #7557DA 72%, #5B3FC4 100%);
  box-shadow:0 -20px 80px rgba(124,92,228,.20);
}
.spark {
  position:absolute; color:var(--brand); opacity:.55; filter:drop-shadow(0 4px 10px rgba(124,92,228,.2)); animation:sparkFloat 5s ease-in-out infinite;
}
.spark-1 { left:17%; top:35%; font-size:22px; }
.spark-2 { right:18%; top:16%; font-size:14px; animation-delay:-1.2s; }
.spark-3 { left:61%; top:44%; font-size:10px; animation-delay:-2.5s; }

.floating-card {
  position:absolute; z-index:4; display:flex; gap:12px; align-items:center; border:1px solid rgba(20,19,32,.08);
  background:rgba(255,255,255,.68); backdrop-filter: blur(18px); border-radius:18px; padding:13px 16px;
  box-shadow:0 18px 55px rgba(52,42,83,.08); transition:transform .2s ease-out;
}
.floating-card small { display:block; color:#9691a0; font-size:10px; margin-bottom:2px; }
.floating-card strong { font-size:12px; font-weight:600; }
.mini-icon {
  width:35px; height:35px; display:grid; place-items:center; border-radius:11px; background:var(--brand-wash); color:var(--brand-deep);
}
.floating-card-a { left:6%; top:35%; animation:cardHover 6s ease-in-out infinite; }
.floating-card-b { right:6%; top:29%; animation:cardHover 7.2s ease-in-out infinite reverse; }

.section {
  width:min(1280px, calc(100% - 48px));
  margin:0 auto;
  padding:110px 0 30px;
}
.section-head { max-width:840px; }
.section-head.center { text-align:center; margin:0 auto 50px; }
.section-head h2 { margin:16px 0 16px; font-size:clamp(50px,6vw,72px); }
.section-head p { margin:0 auto; max-width:760px; color:var(--muted); font-size:18px; line-height:1.6; }
.pill-label {
  display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:0 14px;
  border-radius:999px; background:rgba(255,255,255,.88); border:1px solid rgba(20,19,32,.08);
  box-shadow:0 4px 14px rgba(20,19,32,.06); font-size:12px; letter-spacing:.03em; color:#4b4754; font-weight:600;
}
.pill-label.dark { background:rgba(255,255,255,.08); color:#d8d8e2; border-color: rgba(255,255,255,.12); }

.problem-panel {
  min-height:420px; border:1px solid var(--line); border-radius:28px; background:rgba(255,255,255,.62);
  display:grid; grid-template-columns:1fr 80px 1fr; overflow:hidden; padding:18px;
}
.problem-side {
  display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative;
}
.problem-side small, .problem-panel .problem-divider span {
  font-size:13px; letter-spacing:.12em; color:#88838f; font-weight:700;
}
.problem-side small.accent { color:#ff6584; margin-bottom:28px; }
.dot-cloud, .dot-rows { width:100%; max-width:380px; height:180px; position:relative; }
.dot-cloud span, .dot-row span {
  position:absolute; display:block; border-radius:50%;
}
.dot-cloud span { background:#c9c8cf; opacity:.9; animation:softPulse 5s infinite ease-in-out; }
.dot-cloud .s1 { width:14px; height:14px; left:24%; top:58%; }
.dot-cloud .s2 { width:8px; height:8px; left:12%; top:82%; }
.dot-cloud .s3 { width:10px; height:10px; left:38%; top:28%; }
.dot-cloud .s4 { width:12px; height:12px; left:56%; top:76%; }
.dot-cloud .s5 { width:9px; height:9px; left:70%; top:18%; }
.dot-cloud .s6 { width:15px; height:15px; left:80%; top:46%; }
.dot-cloud .s7 { width:8px; height:8px; left:48%; top:68%; }
.dot-cloud .s8 { width:12px; height:12px; left:28%; top:8%; }
.dot-cloud .s9 { width:10px; height:10px; left:64%; top:42%; }
.dot-cloud .s10 { width:14px; height:14px; left:86%; top:64%; }

.problem-divider {
  display:flex; align-items:center; justify-content:center; position:relative;
}
.problem-divider::before {
  content:""; position:absolute; top:12%; bottom:12%; width:1px; background:rgba(20,19,32,.08);
}
.problem-divider span {
  position:relative; z-index:2; padding:10px 16px; border-radius:999px; background:white; border:1px solid rgba(20,19,32,.08); box-shadow:0 8px 20px rgba(20,19,32,.06);
  color:#4b4754;
}
.dot-rows { display:flex; flex-direction:column; gap:22px; justify-content:center; }
.dot-row { position:relative; width:100%; height:40px; }
.dot-row span { width:12px; height:12px; top:14px; animation:softFloat 4s infinite ease-in-out; }
.dot-row span:nth-child(1) { left:4%; animation-delay:-.4s; }
.dot-row span:nth-child(2) { left:18%; animation-delay:-.7s; }
.dot-row span:nth-child(3) { left:34%; animation-delay:-.1s; }
.dot-row span:nth-child(4) { left:50%; animation-delay:-.9s; }
.dot-row span:nth-child(5) { left:66%; animation-delay:-.2s; }
.dot-row span:nth-child(6) { left:82%; animation-delay:-.5s; }
.accent-row span { background:#ff5c89; }
.dark-row span { background:#141320; }

.feature-grid {
  display:grid; grid-template-columns: 1.05fr 1fr 1fr; gap:18px;
}
.feature-card {
  border:1px solid var(--line); border-radius:28px; background:rgba(255,255,255,.65); overflow:hidden; padding:18px 18px 22px;
  box-shadow:0 20px 60px rgba(58,43,90,.04);
}
.feature-card h3 { margin:18px 8px 8px; font-size:22px; }
.feature-card p { margin:0 8px; color:var(--muted); line-height:1.65; }
.feature-tall { grid-row: span 2; }
.feature-wide { grid-column: span 2; display:grid; grid-template-columns: .9fr 1.1fr; gap:18px; align-items:stretch; }
.card-visual {
  min-height:230px; border-radius:22px; background:linear-gradient(180deg, rgba(124,92,228,.06), rgba(124,92,228,.02)); position:relative; overflow:hidden;
}
.dark-card { background:#060606; color:#fff; }
.dark-card p { color:#cac6d5; }
.dark-copy { padding:20px 10px; }
.dark-copy .small { font-size:48px; }
.mock-window {
  border-radius:22px; background:linear-gradient(135deg, #ff5d84, #1c0c15 44%, #050505 100%); min-height:300px; padding:26px;
}
.photo-card { background:#fff; }
.pseudo-photo {
  position:absolute; inset:0; background:linear-gradient(180deg, #f5f2f8, #ffffff 70%);
}
.pseudo-person {
  position:absolute; width:130px; height:160px; left:52%; top:34px; transform:translateX(-50%);
  background:linear-gradient(180deg, #5d4b45 0 18%, #79a7c5 18% 100%);
  border-radius:80px 80px 16px 16px;
  filter: saturate(.8);
}
.pseudo-person::before {
  content:""; position:absolute; width:82px; height:82px; left:50%; top:-28px; transform:translateX(-50%);
  border-radius:50%; background:#e0b59d; box-shadow:0 -18px 0 8px #36241e inset;
}
.pseudo-person::after {
  content:""; position:absolute; width:56px; height:18px; left:50%; top:22px; transform:translateX(-50%);
  border-radius:999px; border:3px solid #314b5d;
}
.pseudo-laptop {
  position:absolute; width:180px; height:84px; left:50%; bottom:24px; transform:translateX(-50%) skewX(-8deg);
  background:#f7f7fb; border-radius:10px; box-shadow:0 10px 26px rgba(20,19,32,.10);
}
.photo-wave {
  position:absolute; width:240px; height:120px; left:-10px; bottom:-16px; background:radial-gradient(circle at 30% 10%, #ff7b97, #ff4c7b 40%, transparent 58%);
  filter: blur(2px); opacity:.78;
}
.visual-input {
  position:absolute; left:18px; right:18px; bottom:18px; height:48px; border-radius:14px; background:rgba(255,255,255,.96);
  border:1px solid rgba(255,92,137,.35); display:flex; align-items:center; justify-content:space-between; padding:0 12px 0 16px;
  box-shadow:0 12px 25px rgba(20,19,32,.10);
}
.visual-input span { font-size:14px; color:#e44a75; font-weight:600; }
.visual-input button {
  width:28px; height:28px; border-radius:50%; border:0; background:#141320; color:#fff;
}
.mini-chat {
  background:linear-gradient(135deg, #0b0b0f, #ff618b 14%, #e8dbe6 52%, #f6eef4 100%);
  position:relative;
}
.bubble {
  max-width:72%; padding:12px 14px; border-radius:16px; font-size:13px; line-height:1.45; box-shadow:0 10px 20px rgba(20,19,32,.06);
  position:absolute;
}
.bubble-user { right:24px; top:28px; background:#fff; color:#222; }
.bubble-ai { left:24px; top:104px; background:#f5f0ff; color:#362c57; }
.mini-input {
  position:absolute; left:24px; right:24px; bottom:24px; height:56px; border-radius:16px; background:#fff; border:2px solid rgba(255,92,137,.55);
  display:flex; align-items:center; padding:0 16px; color:#756d84;
}
.orbit-chip-card {
  background:radial-gradient(circle at 50% 48%, rgba(124,92,228,.06), rgba(124,92,228,.01));
}
.mini-orbit-center {
  position:absolute; width:84px; height:84px; left:50%; top:50%; transform:translate(-50%,-50%);
  border-radius:50%; background:linear-gradient(135deg, #9d84f6, #6d4fe0); box-shadow:0 0 0 12px rgba(124,92,228,.08);
}
.orbit-chip {
  position:absolute; padding:10px 12px; border-radius:999px; background:#fff; border:1px solid rgba(20,19,32,.08); font-size:12px; box-shadow:0 10px 20px rgba(20,19,32,.05);
}
.chip-a { left:16%; top:44%; }
.chip-b { right:16%; top:24%; }
.chip-c { left:26%; bottom:18%; }
.chip-d { right:18%; bottom:26%; }
.task-card, .automation-card {
  background:linear-gradient(180deg, rgba(255,153,0,.08), rgba(255,255,255,.6));
}
.mini-task-window {
  position:absolute; inset:36px; border-radius:18px; background:#fff; padding:20px; box-shadow:0 16px 30px rgba(20,19,32,.08);
}
.task-lines {
  margin-top:18px; height:72px; background:
    linear-gradient(#ece8f4, #ece8f4) 0 0 / 70% 10px no-repeat,
    linear-gradient(#ece8f4, #ece8f4) 0 26px / 86% 10px no-repeat,
    linear-gradient(#ece8f4, #ece8f4) 0 52px / 58% 10px no-repeat;
}
.mini-btn {
  margin-top:24px; height:38px; border-radius:999px; background:linear-gradient(135deg, #ff7c93, #6d4fe0); color:#fff;
  display:inline-flex; align-items:center; justify-content:center; padding:0 18px; font-size:13px;
}
.auto-list {
  position:absolute; left:28px; right:28px; top:40px; display:grid; gap:14px;
}
.auto-list div {
  height:52px; background:#fff; border-radius:14px; display:flex; align-items:center; gap:12px; padding:0 16px; box-shadow:0 10px 22px rgba(20,19,32,.06);
}
.auto-list span { width:12px; height:12px; border-radius:50%; background:linear-gradient(135deg, #ff7c93, #6d4fe0); }

.use-case-grid {
  display:grid; grid-template-columns: .95fr 1.35fr; gap:42px; align-items:start;
}
.use-tabs {
  margin-top:48px; border-top:1px solid rgba(20,19,32,.09);
}
.use-tab {
  width:100%; text-align:left; background:none; border:0; border-bottom:1px solid rgba(20,19,32,.09);
  padding:18px 0; font-size:17px; color:#7d7887; cursor:pointer; transition:color .2s ease, padding-left .2s ease;
}
.use-tab.active { color:var(--ink); font-weight:700; padding-left:8px; }
.use-case-display {
  min-height:472px; border:1px solid var(--line); border-radius:28px; background:rgba(255,255,255,.64); position:relative; overflow:hidden;
}
.usecase-card { position:absolute; inset:0; opacity:0; transform:translateY(18px); transition: opacity .45s var(--ease), transform .45s var(--ease); }
.usecase-card.active { opacity:1; transform:translateY(0); }
.floating-sheet {
  position:absolute; left:50%; top:22%; transform:translateX(-50%); width:min(420px, calc(100% - 48px)); background:rgba(255,255,255,.94);
  border-radius:20px; padding:24px; box-shadow:0 24px 50px rgba(20,19,32,.10); z-index:2;
}
.sheet-head {
  display:grid; grid-template-columns:auto 1fr; gap:6px 18px; color:#9993a4; font-size:13px; margin-bottom:26px;
}
.sheet-head strong { color:#33303b; font-weight:600; }
.floating-sheet h4 { margin:0 0 18px; font-size:22px; line-height:1.2; }
.sheet-lines {
  height:92px; background:
    linear-gradient(#ece8f4, #ece8f4) 0 0 / 94% 10px no-repeat,
    linear-gradient(#ece8f4, #ece8f4) 0 24px / 84% 10px no-repeat,
    linear-gradient(#ece8f4, #ece8f4) 0 48px / 88% 10px no-repeat,
    linear-gradient(#ece8f4, #ece8f4) 0 72px / 68% 10px no-repeat;
}
.usecase-wave {
  position:absolute; left:10%; right:10%; bottom:-8%; height:260px; border-radius:50% 50% 0 0/100% 100% 0 0; filter:blur(0px);
}
.wave-a { background:linear-gradient(120deg, rgba(255,185,120,.45), rgba(255,92,137,.55), rgba(124,92,228,.45)); }
.wave-b { background:linear-gradient(120deg, rgba(155,208,255,.42), rgba(124,92,228,.52), rgba(255,190,150,.45)); }
.wave-c { background:linear-gradient(120deg, rgba(255,200,140,.4), rgba(160,100,255,.5), rgba(255,92,137,.45)); }
.wave-d { background:linear-gradient(120deg, rgba(255,228,180,.5), rgba(255,92,137,.5), rgba(255,150,200,.35)); }

.gradient-heading {
  background:linear-gradient(90deg, #ef4268, #ff708f 34%, #cd93ff 85%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stats-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:920px; margin:0 auto 56px;
}
.stat-card {
  border:1px solid var(--line); border-radius:24px; padding:28px 24px; background:rgba(255,255,255,.62);
}
.stat-card strong, .stat-card span {
  font-family:"Cormorant Garamond", Georgia, serif; font-size:72px; line-height:1;
}
.stat-card p { margin:14px 0 0; color:#4d4856; font-size:16px; line-height:1.5; }
.logo-marquee {
  display:flex; flex-wrap:wrap; justify-content:center; gap:20px; color:#8d8897; font-size:18px; font-weight:600;
  padding:26px 10px;
}
.logo-marquee span {
  padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.7); border:1px solid rgba(20,19,32,.06);
}

.dark-shell {
  border-radius:30px; background:#060606; color:#fff; padding:28px; display:grid; grid-template-columns:260px 1fr; gap:34px;
}
.dark-left-nav { padding:12px 6px; }
.showcase-tab {
  display:block; width:100%; text-align:left; background:none; border:0; border-bottom:1px solid rgba(255,255,255,.10);
  color:#7e7a89; padding:18px 0; font-size:18px; font-weight:700; cursor:pointer; transition:color .2s ease;
}
.showcase-tab.active { color:#fff; position:relative; }
.showcase-tab.active::after {
  content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); width:10px; height:10px; border-radius:50%; background:#ff5b86;
}
.dark-main { min-width:0; }
.showcase-panel { display:none; }
.showcase-panel.active { display:block; }
.light { color:#fff; }
.showcase-panel > h2 { margin:6px 0 34px; font-size:clamp(50px,6vw,66px); max-width:700px; }
.showcase-browser {
  min-height:440px; border-radius:28px; padding:18px; position:relative; overflow:hidden;
}
.gradient-pink { background:linear-gradient(135deg, #efb25b, #ff6584 50%, #9f85f5); }
.gradient-rose { background:linear-gradient(135deg, #f1e8df, #ff7c66 36%, #cb6ae6 100%); }
.gradient-blue { background:linear-gradient(135deg, #b68ef0, #88c9ff); }
.browser-top {
  height:18px; width:54px; border-radius:999px; background:
    radial-gradient(circle, #ff715a 0 2px, transparent 3px),
    radial-gradient(circle, #ffd45a 0 2px, transparent 3px),
    radial-gradient(circle, #6bdc7d 0 2px, transparent 3px);
  background-size: 14px 14px; background-repeat:no-repeat; background-position:0 0, 18px 0, 36px 0;
}
.browser-layout {
  margin-top:16px; min-height:370px; border-radius:20px; background:rgba(255,255,255,.92); display:grid; overflow:hidden;
}
.chat-ui { grid-template-columns: 190px 1fr; }
.chat-ui aside { padding:16px; background:rgba(244,238,244,.94); border-right:1px solid rgba(20,19,32,.06); }
.side-badge {
  height:36px; border-radius:10px; background:linear-gradient(135deg, #ff6584, #9d84f6); color:#fff; display:flex; align-items:center; padding:0 12px; font-size:14px; margin-bottom:18px;
}
.chat-ui ul { list-style:none; padding:0; margin:0; display:grid; gap:10px; color:#5e5968; font-size:14px; }
.chat-feed { padding:24px; position:relative; }
.chat-msg {
  max-width:70%; padding:12px 14px; border-radius:14px; margin-bottom:14px; font-size:13px; line-height:1.45;
}
.chat-msg.right { margin-left:auto; background:#fff; }
.chat-msg.left { background:#f4efff; color:#352c56; }
.chat-entry {
  position:absolute; left:24px; right:24px; bottom:22px; height:56px; border-radius:16px; background:#fff; border:2px solid rgba(255,92,137,.5); display:flex; align-items:center; padding:0 14px; color:#776f84;
}
.showcase-bottom { display:grid; grid-template-columns: 1fr auto; gap:30px; align-items:start; padding:26px 8px 0; }
.showcase-bottom h3 { margin:0 0 10px; font-size:44px; }
.showcase-bottom p { margin:0; color:#c8c4d2; line-height:1.65; max-width:520px; }
.showcase-bottom ul { list-style:none; padding:0; margin:0; display:grid; gap:14px; }
.showcase-bottom li {
  display:flex; align-items:center; gap:12px; font-size:16px;
}
.showcase-bottom li::before {
  content:"✓"; width:22px; height:22px; display:grid; place-items:center; border-radius:50%;
  background:linear-gradient(135deg, #ff6c8a, #d563ea); color:#fff; font-size:12px; font-weight:700;
}
.workflow-ui {
  position:relative; height:360px; border-radius:22px; background:rgba(255,255,255,.92); margin-top:16px; overflow:hidden;
}
.flow-node {
  position:absolute; min-width:120px; padding:12px 14px; border-radius:14px; background:#fff; font-size:13px; box-shadow:0 10px 18px rgba(20,19,32,.08);
}
.node-a { left:8%; top:18%; }
.node-b { left:38%; top:12%; }
.node-c { right:10%; top:34%; }
.node-d { right:18%; bottom:18%; }
.flow-lines { position:absolute; inset:0; width:100%; height:100%; }
.flow-lines path { fill:none; stroke:rgba(20,19,32,.18); stroke-width:1; }
.analytics-ui {
  margin-top:16px; border-radius:20px; background:rgba(255,255,255,.92); min-height:360px; padding:26px;
}
.metric-strip { display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; }
.metric-strip div {
  padding:14px; background:#fff; border-radius:14px;
}
.metric-strip small { display:block; color:#807b89; margin-bottom:8px; }
.metric-strip strong { font-size:28px; }
.table-bars { margin-top:24px; display:grid; gap:14px; }
.table-bars div {
  display:grid; grid-template-columns:90px 1fr; gap:14px; align-items:center;
}
.table-bars span { color:#4d4857; }
.table-bars i {
  display:block; height:8px; border-radius:999px; background:linear-gradient(90deg, #1a1627, #1a1627);
  position:relative;
}
.table-bars i::after {
  content:""; position:absolute; inset:0; border-radius:999px; background:linear-gradient(90deg, #141320, #141320);
}

.integration-orbit {
  min-height:260px; position:relative; display:flex; align-items:center; justify-content:center; margin-top:10px;
}
.integration-chip {
  position:absolute; width:96px; height:64px; border-radius:18px; background:rgba(255,255,255,.78); border:1px solid rgba(20,19,32,.06);
  display:grid; place-items:center; color:#5a5664; box-shadow:0 16px 30px rgba(20,19,32,.06); backdrop-filter: blur(10px);
  animation:cardHover 6s ease-in-out infinite;
}
.i1 { left:6%; top:38%; animation-delay:-.8s; }
.i2 { left:18%; top:18%; }
.i3 { left:34%; top:16%; animation-delay:-1.6s; }
.i4 { left:16%; bottom:14%; }
.i5 { right:34%; top:18%; animation-delay:-2.1s; }
.i6 { right:18%; top:16%; }
.i7 { right:6%; top:38%; animation-delay:-1.3s; }
.i8 { right:18%; bottom:14%; }
.integration-core {
  width:220px; height:220px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:32px; font-weight:700;
  background: radial-gradient(circle at 60% 30%, #ffa3c4 0 10%, transparent 12%), linear-gradient(135deg, #ff4d6d, #ff708f 35%, #ff2b65 65%, #d64df3);
  box-shadow: 0 0 0 14px rgba(255,96,140,.08), 0 18px 60px rgba(255,73,114,.22);
}

.testimonial-stage {
  position:relative; min-height:760px; border-radius:32px; overflow:hidden; padding:80px 24px;
}
.testimonial-bg {
  position:absolute; inset:0; background:
    radial-gradient(circle at 18% 84%, rgba(255,43,101,.95), rgba(255,43,101,0) 28%),
    radial-gradient(circle at 42% 24%, rgba(255,190,205,.88), rgba(255,190,205,0) 32%),
    radial-gradient(circle at 72% 18%, rgba(255,124,150,.76), rgba(255,124,150,0) 38%),
    linear-gradient(135deg, #f1e9f4, #f7eef4 45%, #f6ddd4 100%);
  filter:saturate(1.05);
}
.on-stage { position:relative; z-index:2; }
.testimonial-note {
  max-width:780px; margin:12px auto 0; color:#6d6878;
}
.testimonial-stack {
  position:relative; z-index:2; width:min(640px, calc(100% - 36px)); margin:46px auto 0; min-height:400px;
}
.stack-card {
  position:absolute; inset:0; width:100%; margin:0; background:rgba(255,255,255,.94);
  border-radius:24px; box-shadow:0 26px 50px rgba(20,19,32,.12); padding:34px;
  cursor:grab; user-select:none; touch-action:pan-y;
  transition:transform .34s ease, box-shadow .34s ease, opacity .34s ease;
  will-change:transform;
}
.stack-card.is-top { box-shadow:0 30px 60px rgba(20,19,32,.16); }
.stack-card.is-dragging { cursor:grabbing; transition:none; box-shadow:0 42px 90px rgba(20,19,32,.20); }
.stack-card::before,
.stack-card::after {
  content:""; position:absolute; left:12px; right:12px; height:16px; background:rgba(255,255,255,.9); border-radius:0 0 18px 18px; z-index:-1;
}
.stack-card::before { bottom:-12px; }
.stack-card::after { bottom:-24px; left:24px; right:24px; opacity:.82; }
.stack-card[data-stack-position="1"]::after,
.stack-card[data-stack-position="2"]::after { opacity:.55; }
.quote-brand { font-size:34px; font-weight:800; margin-bottom:24px; }
.testimonial-card p { font-size:20px; line-height:1.45; margin:0 0 28px; }
.quote-person { display:flex; align-items:center; gap:14px; }
.avatar {
  width:54px; height:54px; border-radius:50%; background:linear-gradient(135deg, #f7d7cf, #c4c4cc);
}
.quote-person small { display:block; color:#8c8793; margin-top:4px; }
@keyframes stackFloatA {
  0%, 100% { transform:translate3d(0, 0, 0) scale(1) rotate(0deg); }
  50% { transform:translate3d(0, -8px, 0) scale(1) rotate(.3deg); }
}
@keyframes stackFloatB {
  0%, 100% { transform:translate3d(0, 18px, 0) scale(.97) rotate(-1deg); }
  50% { transform:translate3d(0, 10px, 0) scale(.97) rotate(-.4deg); }
}
@keyframes stackFloatC {
  0%, 100% { transform:translate3d(0, 36px, 0) scale(.94) rotate(1.2deg); }
  50% { transform:translate3d(0, 28px, 0) scale(.94) rotate(.5deg); }
}

.deployment-grid, .pricing-grid, .insights-grid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.deployment-card, .price-card, .insight-card {
  border:1px solid var(--line); border-radius:26px; background:rgba(255,255,255,.64); overflow:hidden; padding:20px;
}
.deploy-visual {
  min-height:220px; border-radius:20px; position:relative; overflow:hidden; margin-bottom:20px;
}
.grad-gold { background:linear-gradient(135deg, #f1d0a2, #ff9550 80%); }
.grad-rose { background:linear-gradient(135deg, #ffad5d, #ff4d7f 70%, #da6bf4); }
.grad-beige { background:linear-gradient(135deg, #ecd4c0, #f4b857); }
.deploy-bubble {
  position:absolute; left:26%; top:50%; transform:translateY(-50%); background:#fff; color:#ff4d72; border-radius:14px; padding:14px 18px; box-shadow:0 14px 24px rgba(20,19,32,.10); font-weight:700;
}
.deploy-bubble::before {
  content:"✦"; position:absolute; left:-34px; top:50%; transform:translateY(-50%); width:28px; height:28px; border-radius:50%; background:#fff; color:#ff4d72; display:grid; place-items:center;
}
.deploy-panel {
  position:absolute; left:28%; top:42%; padding:18px 22px; border-radius:16px; background:rgba(255,255,255,.85); box-shadow:0 16px 26px rgba(20,19,32,.10); font-size:18px;
}
.deploy-window {
  position:absolute; inset:36px; border-radius:16px; background:rgba(255,255,255,.82); box-shadow:0 16px 24px rgba(20,19,32,.10);
}
.deployment-card h3 { margin:0 0 10px; font-size:32px; display:flex; align-items:center; gap:10px; }
.deployment-card h3 span {
  width:30px; height:30px; display:grid; place-items:center; font-size:18px; border-radius:8px; border:1px solid rgba(20,19,32,.10);
}
.deployment-card p { margin:0; color:var(--muted); line-height:1.6; }

.price-card h3 { margin:6px 0 8px; font-size:48px; font-family:"Cormorant Garamond", Georgia, serif; font-weight:600; }
.price-card p { margin:0 0 24px; color:var(--muted); }
.price-card strong { display:block; font-size:28px; margin-bottom:18px; }
.price-card ul { list-style:none; padding:22px 0 0; margin:22px 0 0; border-top:1px solid rgba(20,19,32,.08); display:grid; gap:16px; color:#3f3b47; }
.price-card li::before { content:"✦"; margin-right:10px; color:#141320; }
.price-card.highlight { background:#050505; color:#fff; position:relative; overflow:hidden; }
.price-card.highlight::before {
  content:""; position:absolute; inset:auto -20% -30% auto; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle, rgba(255,63,106,.85), transparent 70%);
  filter:blur(10px);
}
.price-card.highlight p, .price-card.highlight ul { color:#ddd9e7; }
.price-card.highlight li::before { color:#fff; }

.security-grid {
  display:grid; grid-template-columns: repeat(6, 1fr); gap:0; border:1px solid var(--line); border-radius:24px; overflow:hidden;
}
.security-grid article {
  min-height:128px; background:rgba(255,255,255,.64); display:flex; flex-direction:column; align-items:center; justify-content:center;
  border-right:1px solid rgba(20,19,32,.08);
}
.security-grid article:last-child { border-right:0; }
.security-grid strong { font-size:34px; }
.security-grid small { color:#8d8897; margin-top:8px; }

.faq-layout {
  border:1px solid var(--line); border-radius:28px; padding:34px; background:rgba(255,255,255,.62); display:grid; grid-template-columns: .78fr 1.22fr; gap:30px;
}
.faq-intro h2 { margin:18px 0 0; font-size:clamp(46px, 5vw, 64px); }
.faq-list { display:grid; gap:16px; }
.faq-item {
  border-radius:20px; background:#fff; overflow:hidden; border:1px solid rgba(20,19,32,.04);
}
.faq-question {
  width:100%; display:flex; align-items:center; justify-content:space-between; padding:24px 24px; border:0; background:none; font:inherit; font-size:18px; font-weight:600; text-align:left; cursor:pointer;
}
.faq-answer {
  padding:0 24px 24px; color:var(--muted); line-height:1.7; display:none;
}
.faq-item.open .faq-answer { display:block; }
.faq-item.open .faq-question b { font-weight:400; }

.insights-head {
  display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:30px;
}
.insights-head h2 { margin:0; font-size:clamp(52px, 5vw, 68px); max-width:520px; }
.insight-cover {
  min-height:240px; border-radius:18px; color:#fff; display:grid; place-items:center; text-align:center; padding:30px; font-size:24px; font-weight:700; line-height:1.3;
}
.cover-a { background:linear-gradient(135deg, #ef91ab, #b545db); }
.cover-b { background:linear-gradient(135deg, #f0d5ca, #ff6f8d 72%, #ce50f3); }
.cover-c { background:linear-gradient(135deg, #efcc93, #f29654 30%, #f3b8c3); }
.insight-meta {
  display:flex; justify-content:space-between; gap:12px; margin:18px 0 14px; color:#66616f; font-size:13px; font-weight:600;
}
.insight-card h3 { margin:0; font-size:28px; line-height:1.2; }

.final-cta {
  min-height:520px; border-radius:30px; background:#050505; color:#fff; padding:80px 40px; display:grid; grid-template-columns: 1fr 1fr; align-items:center; gap:20px;
}
.cta-copy h2 { font-size:clamp(54px, 5vw, 72px); margin:0 0 18px; max-width:580px; }
.cta-copy p { margin:0; max-width:620px; color:#d4d0dc; font-size:20px; line-height:1.55; }
.cta-actions { display:flex; gap:14px; margin-top:28px; }
.cta-visual { height:320px; position:relative; }
.cta-orbit {
  position:absolute; left:50%; transform:translateX(-50%); border-radius:50% 50% 0 0/100% 100% 0 0;
}
.c1 {
  width:430px; height:160px; bottom:0; border:3px solid rgba(255,75,85,.85);
  background:linear-gradient(180deg, rgba(255,39,72,.55), rgba(255,110,170,.35)); box-shadow: inset 0 20px 50px rgba(255,255,255,.45);
}
.c2 {
  width:500px; height:180px; bottom:-18px; border:3px solid rgba(255,141,210,.85);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,170,210,.08));
}
.c3 {
  width:580px; height:220px; bottom:-36px; border:3px solid rgba(255,50,90,.8);
  background:linear-gradient(180deg, rgba(255,40,70,.22), rgba(255,40,70,.05));
}
.site-footer {
  display:grid; grid-template-columns: 1.2fr .8fr; gap:40px; padding:48px 10px 20px;
}
.footer-brand p { max-width:390px; color:#77717f; line-height:1.65; margin-top:18px; }
.footer-links { display:grid; grid-template-columns: repeat(3, 1fr); gap:28px; }
.footer-links h4 { margin:0 0 16px; font-size:14px; color:#8c8794; }
.footer-links a { display:block; margin-bottom:14px; }

.reveal {
  opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.reveal.is-visible { opacity:1; transform:translateY(0); }

@keyframes pulse {
  0%,100% { box-shadow:0 0 0 0 rgba(124,92,228,.35); }
  50% { box-shadow:0 0 0 8px rgba(124,92,228,0); }
}
@keyframes blink { 50% { opacity:0; } }
@keyframes orbBreath {
  0%,100% { transform:scale(1); box-shadow:0 0 18px rgba(124,92,228,.32); }
  50% { transform:scale(1.12); box-shadow:0 0 25px rgba(124,92,228,.50); }
}
@keyframes glowDrift {
  0%,100% { opacity:.14; transform:scaleX(.98); }
  50% { opacity:.28; transform:scaleX(1.015); }
}
@keyframes markFloat {
  0%,100% { transform:rotate(0deg); }
  50% { transform:rotate(12deg); }
}
@keyframes cardHover {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-10px); }
}
@keyframes orbitFloat {
  0%,100% { transform:translateX(-50%) translateY(0) scaleX(1); }
  50% { transform:translateX(-50%) translateY(-7px) scaleX(1.012); }
}
@keyframes sparkFloat {
  0%,100% { transform:translateY(0) rotate(0); opacity:.35; }
  50% { transform:translateY(-12px) rotate(15deg); opacity:.75; }
}
@keyframes softPulse {
  0%, 100% { transform:scale(1); opacity:.55; }
  50% { transform:scale(1.15); opacity:1; }
}
@keyframes softFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-10px); }
}

@media (max-width: 1100px) {
  .site-header { grid-template-columns: 1fr auto; }
  .nav { display:none; }
  .floating-card { display:none; }
  .feature-grid { grid-template-columns: 1fr 1fr; }
  .feature-wide { grid-column: span 2; }
  .use-case-grid, .dark-shell, .faq-layout, .final-cta, .site-footer { grid-template-columns: 1fr; }
  .showcase-bottom { grid-template-columns: 1fr; }
  .security-grid { grid-template-columns: repeat(3, 1fr); }
  .security-grid article:nth-child(3n) { border-right:0; }
}

@media (max-width: 820px) {
  .section { width:min(100% - 28px, 1280px); padding-top:82px; }
  .hero { padding:62px 16px 42px; min-height:auto; }
  .hero h1 { font-size:clamp(51px, 15vw, 72px); line-height:.95; letter-spacing:-4px; }
  .hero > .hero-content > p { font-size:17px; max-width:320px; }
  .chat-shell { margin-top:34px; }
  .chat-box { height:66px; padding-left:17px; }
  .type-line { font-size:14px; }
  .send-btn { width:50px; height:50px; }
  .prompt-chips {
    justify-content:flex-start; flex-wrap:nowrap; overflow-x:auto; padding:2px 2px 8px; scrollbar-width:none;
  }
  .prompt-chips::-webkit-scrollbar { display:none; }
  .prompt-chips button { white-space:nowrap; }
  .hero-actions { flex-direction:column; gap:14px; }
  .visual-wrap { height:270px; margin-top:32px; }
  .orbit-1 { width:720px; height:250px; }
  .orbit-2 { width:590px; height:210px; }
  .orbit-3 { width:470px; height:175px; }
  .orb-core { width:340px; height:145px; }
  .section-head h2, .showcase-panel > h2, .cta-copy h2 { font-size:clamp(40px, 12vw, 58px); }
  .problem-panel { grid-template-columns: 1fr; gap:20px; min-height:auto; }
  .problem-divider::before { height:1px; width:auto; left:12%; right:12%; top:50%; bottom:auto; }
  .problem-divider { min-height:56px; }
  .feature-grid, .deployment-grid, .pricing-grid, .insights-grid, .stats-grid { grid-template-columns:1fr; }
  .feature-wide { grid-column: auto; grid-template-columns:1fr; }
  .feature-tall { grid-row:auto; }
  .use-case-display { min-height:430px; }
  .security-grid { grid-template-columns: repeat(2, 1fr); }
  .security-grid article:nth-child(2n) { border-right:0; }
  .metric-strip { grid-template-columns:1fr; }
  .chat-ui { grid-template-columns:1fr; }
  .chat-ui aside { display:none; }
  .integration-core { width:170px; height:170px; font-size:24px; }
  .integration-chip { width:78px; height:56px; font-size:12px; }
  .testimonial-stage { min-height:620px; padding:60px 16px; }
  .faq-layout { padding:22px; }
  .final-cta { padding:50px 22px; }
  .cta-visual { height:240px; }
  .site-footer { padding-top:36px; }
  .footer-links { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .site-header {
    width:min(100% - 22px, 1440px); height:78px;
  }
  .header-actions .btn-ghost { display:none; }
  .brand-copy small { display:none; }
  .brand-copy strong { font-size:19px; }
  .brand-mark { width:32px; height:32px; transform:scale(.84); transform-origin:left center; }
  .showcase-tab { font-size:15px; }
  .integration-orbit { min-height:360px; }
  .i1 { left:2%; top:48%; }
  .i2 { left:20%; top:8%; }
  .i3 { left:36%; top:18%; }
  .i4 { left:16%; bottom:8%; }
  .i5 { right:36%; top:18%; }
  .i6 { right:20%; top:8%; }
  .i7 { right:2%; top:48%; }
  .i8 { right:16%; bottom:8%; }
  .footer-links { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}


/* ============================================================
   V3 MULTI-PAGE SYSTEM
   ============================================================ */

.inner-page {
  background:
    radial-gradient(circle at 10% 7%, rgba(124,92,228,.07), transparent 28rem),
    radial-gradient(circle at 90% 4%, rgba(184,163,255,.08), transparent 25rem),
    #FBFAFD;
}

.page-header {
  position: sticky;
  top: 0;
  background: rgba(251,250,253,.72);
  border-bottom: 1px solid rgba(20,19,32,.05);
}

.page-footer {
  width: min(1280px, calc(100% - 48px));
  margin: 70px auto 0;
  border-top: 1px solid rgba(20,19,32,.08);
}

.subpage-hero {
  width: min(1280px, calc(100% - 48px));
  min-height: 620px;
  margin: 18px auto 0;
  border: 1px solid rgba(20,19,32,.07);
  border-radius: 34px;
  padding: clamp(44px, 6vw, 78px);
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 50px;
  align-items: center;
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.56)),
    radial-gradient(circle at 72% 18%, rgba(124,92,228,.10), transparent 26rem);
  isolation: isolate;
}

.subpage-hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-3;
  background-image:
    linear-gradient(rgba(124,92,228,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,92,228,.03) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(to bottom, black 0%, transparent 80%);
}

.subpage-ambient {
  position:absolute;
  width:360px;
  height:360px;
  border-radius:50%;
  filter:blur(76px);
  pointer-events:none;
  z-index:-2;
}
.subpage-ambient.a1 { left:-140px; bottom:-160px; background:rgba(124,92,228,.14); }
.subpage-ambient.a2 { right:-130px; top:-160px; background:rgba(183,155,255,.14); }

.subpage-hero-copy {
  max-width: 650px;
}
.subpage-hero-copy h1 {
  margin: 22px 0 22px;
  font-size: clamp(64px, 7vw, 96px);
}
.subpage-hero-copy p {
  margin:0;
  color:var(--muted);
  font-size:19px;
  line-height:1.68;
  max-width:620px;
}

.subpage-hero-visual {
  min-height: 430px;
  display:grid;
  place-items:center;
  position:relative;
}

.subpage-section {
  width:min(1280px, calc(100% - 48px));
  margin:0 auto;
  padding:110px 0 20px;
}

.process-head {
  max-width: 780px;
  margin-bottom: 54px;
}
.process-head h2 {
  margin: 15px 0 14px;
  font-size: clamp(52px, 6vw, 72px);
}
.process-head p {
  margin:0;
  color:var(--muted);
  line-height:1.7;
  font-size:17px;
}

.section-kicker {
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  color:var(--brand-deep);
}

.subpage-cta {
  width:min(1280px, calc(100% - 48px));
  margin:110px auto 0;
  padding:80px 24px;
  border-radius:32px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 100%, rgba(124,92,228,.20), transparent 25rem),
    #08070C;
  color:#fff;
  overflow:hidden;
}
.subpage-cta h2 {
  max-width:760px;
  margin:20px auto 30px;
  font-size:clamp(48px, 6vw, 70px);
}

/* Methodology */
.method-orbit {
  width:min(470px, 90%);
  aspect-ratio:1;
  position:relative;
  border-radius:50%;
  border:1px solid rgba(124,92,228,.16);
  box-shadow:
    0 0 0 52px rgba(124,92,228,.025),
    0 0 0 104px rgba(124,92,228,.018);
}
.method-core {
  position:absolute;
  width:140px;
  height:140px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:700;
  background:radial-gradient(circle at 35% 28%, #baabff, #7C5CE4 44%, #5B3FC4);
  box-shadow:0 22px 60px rgba(91,63,196,.26);
  animation:orbBreath 4.4s ease-in-out infinite;
  z-index:2;
}
.method-node {
  position:absolute;
  z-index:3;
  padding:11px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(20,19,32,.08);
  box-shadow:0 14px 26px rgba(20,19,32,.07);
  font-size:13px;
  font-weight:700;
  animation:cardHover 6s ease-in-out infinite;
}
.method-node.n1 { left:-2%; top:12%; }
.method-node.n2 { right:-3%; top:8%; animation-delay:-1s; }
.method-node.n3 { right:-4%; bottom:10%; animation-delay:-2s; }
.method-node.n4 { left:-3%; bottom:8%; animation-delay:-3s; }
.method-lines {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.method-lines path {
  fill:none;
  stroke:rgba(124,92,228,.19);
  stroke-width:.6;
  stroke-dasharray:2 2;
  animation:dashFlow 10s linear infinite;
}

.method-steps {
  position:relative;
  max-width:980px;
  margin:0 auto;
}
.method-steps::before {
  content:"";
  position:absolute;
  left:37px;
  top:36px;
  bottom:36px;
  width:1px;
  background:linear-gradient(var(--brand), rgba(124,92,228,.08));
}
.method-step {
  display:grid;
  grid-template-columns:76px 1fr;
  gap:24px;
  padding:0 0 44px;
  position:relative;
}
.method-step > span {
  width:76px;
  height:76px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#fff;
  border:1px solid rgba(124,92,228,.18);
  color:var(--brand-deep);
  font-weight:800;
  box-shadow:0 10px 28px rgba(91,63,196,.08);
  position:relative;
  z-index:2;
}
.method-step h3 {
  margin:5px 0 8px;
  font-size:28px;
}
.method-step p {
  margin:0;
  color:var(--muted);
  line-height:1.7;
  max-width:760px;
}

.principle-panel,
.source-identity-panel,
.permission-banner {
  min-height:440px;
  border-radius:30px;
  border:1px solid rgba(20,19,32,.08);
  background:
    radial-gradient(circle at 86% 20%, rgba(124,92,228,.11), transparent 22rem),
    rgba(255,255,255,.68);
  padding:54px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
  align-items:center;
  overflow:hidden;
}
.principle-panel h2,
.source-identity-panel h2,
.permission-banner h2 {
  font-size:clamp(52px, 5vw, 68px);
  margin:18px 0 16px;
}
.principle-panel p,
.source-identity-panel p,
.permission-banner p {
  color:var(--muted);
  line-height:1.7;
  font-size:17px;
}

.record-stack {
  height:310px;
  position:relative;
}
.record-card {
  position:absolute;
  width:72%;
  min-height:120px;
  border-radius:22px;
  padding:24px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 22px 48px rgba(20,19,32,.08);
  transition:transform .35s var(--ease);
}
.record-card small { display:block; color:#9892a2; margin-bottom:8px; }
.record-card strong { font-size:22px; }
.record-card.r1 { left:4%; top:10%; transform:rotate(-5deg); }
.record-card.r2 { left:17%; top:32%; transform:rotate(2deg); }
.record-card.r3 { left:28%; top:56%; transform:rotate(6deg); }
.principle-panel:hover .r1 { transform:rotate(-8deg) translate(-8px,-6px); }
.principle-panel:hover .r2 { transform:rotate(0deg) translateY(-6px); }
.principle-panel:hover .r3 { transform:rotate(9deg) translate(8px,4px); }

/* Data schema */
.schema-map {
  width:min(520px, 96%);
  height:410px;
  position:relative;
}
.schema-map svg {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.schema-map path {
  fill:none;
  stroke:rgba(124,92,228,.24);
  stroke-width:.65;
  stroke-dasharray:3 2;
  animation:dashFlow 12s linear infinite;
}
.schema-entity {
  position:absolute;
  z-index:2;
  min-width:150px;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(20,19,32,.08);
  box-shadow:0 16px 32px rgba(20,19,32,.07);
  padding:18px 20px;
  animation:cardHover 7s ease-in-out infinite;
}
.schema-entity small { display:block; font-size:9px; letter-spacing:.14em; color:#9b95a3; margin-bottom:6px; }
.schema-entity strong { font-size:20px; }
.e-brand { left:3%; top:5%; }
.e-branch { left:38%; top:29%; animation-delay:-1s; }
.e-menu { right:2%; top:46%; animation-delay:-2s; }
.e-item { left:39%; bottom:4%; animation-delay:-3s; }
.e-observation { left:1%; bottom:2%; animation-delay:-4s; }

.schema-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.schema-card {
  min-height:260px;
  padding:28px;
  border-radius:26px;
  background:rgba(255,255,255,.67);
  border:1px solid rgba(20,19,32,.08);
  transition:transform .28s var(--ease), box-shadow .28s var(--ease);
}
.schema-card:hover {
  transform:translateY(-7px);
  box-shadow:0 24px 50px rgba(20,19,32,.07);
}
.schema-card > span { color:var(--brand); font-size:12px; font-weight:800; }
.schema-card h3 { margin:42px 0 9px; font-size:30px; }
.schema-card p { margin:0; color:var(--muted); line-height:1.62; }
.field-chips { display:flex; gap:7px; flex-wrap:wrap; margin-top:22px; }
.field-chips b {
  font-size:11px;
  font-weight:600;
  color:#675f74;
  padding:8px 10px;
  border-radius:999px;
  background:var(--brand-wash);
}

.merge-demo { display:grid; gap:10px; }
.raw-row,
.grouped-row {
  min-height:64px;
  padding:0 18px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(20,19,32,.07);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  box-shadow:0 10px 24px rgba(20,19,32,.05);
}
.raw-row span { color:#817b89; font-size:13px; }
.grouped-row {
  min-height:78px;
  background:linear-gradient(135deg, #F4F0FF, #fff);
  border-color:rgba(124,92,228,.18);
}
.grouped-row span { color:var(--brand-deep); font-size:13px; }
.merge-arrow { text-align:center; color:var(--brand); font-size:26px; }

/* Coverage */
.coverage-map {
  width:min(520px, 98%);
  height:430px;
  position:relative;
}
.map-outline {
  position:absolute;
  left:12%;
  right:10%;
  top:8%;
  bottom:8%;
  border:2px solid rgba(124,92,228,.18);
  clip-path:polygon(31% 2%, 50% 8%, 58% 20%, 79% 18%, 93% 40%, 82% 58%, 88% 80%, 67% 93%, 49% 85%, 30% 96%, 19% 74%, 3% 59%, 13% 37%);
  background:linear-gradient(180deg, rgba(124,92,228,.045), rgba(124,92,228,.01));
}
.map-dot {
  position:absolute;
  width:14px;
  height:14px;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 0 0 8px rgba(124,92,228,.10);
  animation:pulse 2.8s infinite;
}
.d1 { left:30%; top:34%; }
.d2 { left:48%; top:26%; animation-delay:-.4s; }
.d3 { right:26%; top:42%; animation-delay:-.8s; }
.d4 { left:39%; bottom:30%; animation-delay:-1.2s; }
.d5 { right:36%; bottom:18%; animation-delay:-1.6s; }
.d6 { left:20%; bottom:18%; animation-delay:-2s; }
.coverage-float {
  position:absolute;
  min-width:140px;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 16px 30px rgba(20,19,32,.07);
  animation:cardHover 6s ease-in-out infinite;
}
.coverage-float small { display:block; color:#9993a1; margin-bottom:4px; }
.coverage-float strong { font-size:14px; }
.c-f1 { left:-3%; top:6%; }
.c-f2 { right:-2%; top:13%; animation-delay:-2s; }
.c-f3 { right:4%; bottom:8%; animation-delay:-4s; }

.snapshot-strip {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border:1px solid rgba(20,19,32,.08);
  border-radius:24px;
  overflow:hidden;
  background:rgba(255,255,255,.66);
}
.snapshot-strip article {
  padding:28px;
  min-height:150px;
  border-right:1px solid rgba(20,19,32,.07);
}
.snapshot-strip article:last-child { border-right:0; }
.snapshot-strip small { display:block; color:#9892a2; font-size:10px; letter-spacing:.13em; margin-bottom:16px; }
.snapshot-strip strong { font-family:"Cormorant Garamond", Georgia, serif; font-size:58px; line-height:1; }
.snapshot-strip span { display:block; color:var(--muted); margin-top:6px; }
.snapshot-note,
.prototype-note {
  margin:14px 0 0;
  color:#938d9b;
  font-size:12px;
  line-height:1.6;
}

.coverage-cards {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.coverage-card {
  border-radius:27px;
  border:1px solid rgba(20,19,32,.08);
  background:rgba(255,255,255,.67);
  padding:18px 18px 28px;
  transition:transform .28s var(--ease);
}
.coverage-card:hover { transform:translateY(-7px); }
.coverage-card h3 { margin:20px 8px 8px; font-size:28px; }
.coverage-card p { margin:0 8px; color:var(--muted); line-height:1.65; }
.city-visual {
  height:250px;
  border-radius:21px;
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(124,92,228,.08), rgba(255,255,255,.5));
}
.city-visual span { font-family:"Cormorant Garamond", Georgia, serif; font-size:46px; position:relative; z-index:2; }
.city-visual i {
  position:absolute;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 0 0 8px rgba(124,92,228,.08);
  animation:softFloat 4s ease-in-out infinite;
}
.city-visual i:nth-of-type(1) { left:18%; top:28%; }
.city-visual i:nth-of-type(2) { right:17%; top:20%; animation-delay:-1s; }
.city-visual i:nth-of-type(3) { left:26%; bottom:18%; animation-delay:-2s; }
.city-visual i:nth-of-type(4) { right:24%; bottom:24%; animation-delay:-3s; }
.cv-jeddah { background:linear-gradient(135deg, rgba(255,182,125,.14), rgba(255,255,255,.5)); }
.cv-khobar { background:linear-gradient(135deg, rgba(127,199,255,.13), rgba(255,255,255,.5)); }

.lock-visual {
  width:320px;
  height:320px;
  margin:auto;
  position:relative;
  display:grid;
  place-items:center;
}
.lock-dot {
  width:95px;
  height:95px;
  border-radius:50%;
  background:linear-gradient(135deg, #9F87F5, #5B3FC4);
  box-shadow:0 18px 50px rgba(91,63,196,.28);
  z-index:2;
}
.lock-ring {
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(124,92,228,.20);
  animation:orbitSpin 14s linear infinite;
}
.lock-ring::after {
  content:"";
  position:absolute;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--brand);
  left:10%;
  top:14%;
}
.lock-ring.r-one { width:180px; height:180px; }
.lock-ring.r-two { width:280px; height:280px; animation-duration:20s; animation-direction:reverse; }
.lock-visual span {
  position:absolute;
  bottom:20px;
  padding:9px 13px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(20,19,32,.08);
  font-size:12px;
  color:#595362;
}

/* Tutorials */
.tutorial-player {
  width:min(530px, 98%);
  min-height:380px;
  position:relative;
}
.tutorial-window {
  position:absolute;
  inset:30px 0 0 20px;
  border-radius:28px;
  background:linear-gradient(135deg, #F2ECFF, #fff);
  border:1px solid rgba(124,92,228,.16);
  box-shadow:0 25px 60px rgba(91,63,196,.10);
  display:grid;
  grid-template-columns:90px 1fr;
  overflow:hidden;
}
.tutorial-sidebar {
  padding:28px 18px;
  border-right:1px solid rgba(20,19,32,.06);
  display:grid;
  align-content:start;
  gap:14px;
}
.tutorial-sidebar span {
  height:10px;
  border-radius:999px;
  background:#ddd5f8;
}
.tutorial-main { padding:38px 28px; position:relative; }
.tutorial-prompt {
  max-width:270px;
  padding:14px 16px;
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 24px rgba(20,19,32,.06);
  font-size:14px;
}
.tutorial-answer {
  margin-top:22px;
  width:86%;
  height:120px;
  border-radius:18px;
  background:
    linear-gradient(#e8e2f5,#e8e2f5) 18px 22px/70% 9px no-repeat,
    linear-gradient(#e8e2f5,#e8e2f5) 18px 48px/82% 9px no-repeat,
    linear-gradient(#e8e2f5,#e8e2f5) 18px 74px/58% 9px no-repeat,
    rgba(255,255,255,.82);
}
.tutorial-cursor {
  position:absolute;
  width:16px;
  height:22px;
  right:36px;
  bottom:46px;
  background:var(--brand);
  clip-path:polygon(0 0, 100% 58%, 59% 66%, 47% 100%);
  animation:cursorMove 4s ease-in-out infinite;
}
.tutorial-play {
  position:absolute;
  right:12px;
  top:8px;
  width:72px;
  height:72px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:var(--ink);
  box-shadow:0 14px 30px rgba(20,19,32,.14);
  z-index:3;
}

.tutorial-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.tutorial-card {
  border-radius:27px;
  border:1px solid rgba(20,19,32,.08);
  background:rgba(255,255,255,.68);
  padding:18px 18px 26px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
  transform-style:preserve-3d;
}
.tutorial-card:hover {
  box-shadow:0 24px 50px rgba(20,19,32,.07);
}
.tutorial-card > small {
  display:block;
  margin:18px 6px 8px;
  color:#948e9c;
  font-size:10px;
  letter-spacing:.12em;
  font-weight:700;
}
.tutorial-card h3 { margin:0 6px 8px; font-size:26px; }
.tutorial-card p { margin:0 6px; color:var(--muted); line-height:1.6; }
.tutorial-art {
  min-height:220px;
  border-radius:20px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:24px;
  color:#fff;
  overflow:hidden;
  position:relative;
}
.tutorial-art::after {
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  border-radius:50%;
  right:-50px;
  bottom:-70px;
  background:rgba(255,255,255,.20);
  box-shadow:0 0 0 22px rgba(255,255,255,.08);
}
.tutorial-art span { font-size:12px; letter-spacing:.12em; }
.tutorial-art div { font-size:30px; font-weight:700; line-height:1.05; max-width:220px; position:relative; z-index:2; }
.art-ai { background:linear-gradient(135deg, #5B3FC4, #9E88F1); }
.art-brand { background:linear-gradient(135deg, #141320, #5B3FC4); }
.art-menu { background:linear-gradient(135deg, #915EF0, #D08BFF); }
.art-price { background:linear-gradient(135deg, #E68B56, #9E67E8); }
.art-export { background:linear-gradient(135deg, #5271E6, #7C5CE4); }
.art-report { background:linear-gradient(135deg, #3B3850, #B98CF3); }

/* FAQ page */
.faq-hero-art {
  width:min(530px, 98%);
  height:420px;
  position:relative;
}
.faq-bubble {
  position:absolute;
  min-width:250px;
  padding:18px 20px;
  border-radius:18px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 16px 32px rgba(20,19,32,.07);
  font-size:14px;
  animation:cardHover 7s ease-in-out infinite;
}
.faq-bubble span {
  display:inline-grid;
  place-items:center;
  width:25px;
  height:25px;
  border-radius:50%;
  margin-right:10px;
  background:var(--brand-wash);
  color:var(--brand-deep);
}
.qb1 { left:3%; top:8%; }
.qb2 { right:0; top:28%; animation-delay:-1.4s; }
.qb3 { left:14%; bottom:26%; animation-delay:-2.8s; }
.qb4 { right:10%; bottom:4%; animation-delay:-4.2s; }

.faq-page-layout {
  display:grid;
  grid-template-columns:280px 1fr;
  gap:44px;
}
.faq-side {
  align-self:start;
  position:sticky;
  top:120px;
  display:grid;
  gap:10px;
}
.faq-side a {
  padding:12px 14px;
  border-radius:12px;
  color:#756f7d;
  transition:background .2s ease, color .2s ease;
}
.faq-side a:hover { background:var(--brand-wash); color:var(--brand-deep); }
.big-faq .faq-group-title {
  margin:28px 0 12px;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:42px;
}
.big-faq .faq-group-title:first-child { margin-top:0; }

/* Blog */
.blog-stack {
  width:min(500px,96%);
  height:400px;
  position:relative;
}
.blog-paper {
  position:absolute;
  width:72%;
  min-height:210px;
  border-radius:24px;
  padding:26px;
  background:#fff;
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 20px 42px rgba(20,19,32,.08);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.blog-paper small { color:#918b98; margin-bottom:8px; }
.blog-paper strong { font-family:"Cormorant Garamond", Georgia, serif; font-size:36px; line-height:1; }
.bp1 { left:3%; top:10%; transform:rotate(-8deg); background:linear-gradient(135deg,#fff,#F1ECFD); }
.bp2 { right:0; top:24%; transform:rotate(7deg); background:linear-gradient(135deg,#fff,#FBEDEB); }
.bp3 { left:16%; bottom:2%; transform:rotate(-1deg); background:linear-gradient(135deg,#fff,#EEE7FF); }

.featured-article {
  min-height:520px;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:38px;
  align-items:center;
}
.featured-art {
  min-height:470px;
  border-radius:30px;
  background:#08070C;
  position:relative;
  overflow:hidden;
}
.featured-art > span {
  position:absolute;
  left:28px;
  top:28px;
  z-index:3;
  color:#fff;
  font-size:11px;
  letter-spacing:.16em;
}
.featured-orb {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  border-radius:50% 50% 0 0/100% 100% 0 0;
}
.fo1 { width:86%; height:260px; bottom:-40px; background:linear-gradient(180deg,#9d84f6,#5B3FC4); }
.fo2 { width:70%; height:220px; bottom:-30px; border:4px solid rgba(255,255,255,.5); background:rgba(255,255,255,.08); }
.fo3 { width:56%; height:180px; bottom:-20px; border:3px solid rgba(255,255,255,.28); }
.featured-copy small { color:#948e9d; letter-spacing:.12em; font-size:10px; font-weight:700; }
.featured-copy h2 { font-size:clamp(54px, 5vw, 70px); margin:18px 0; }
.featured-copy p { color:var(--muted); line-height:1.7; font-size:18px; }

.blog-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.blog-card {
  border-radius:26px;
  border:1px solid rgba(20,19,32,.08);
  background:rgba(255,255,255,.67);
  padding:18px 18px 24px;
}
.blog-cover {
  min-height:220px;
  border-radius:20px;
  display:grid;
  place-items:center;
  color:#fff;
  text-align:center;
  padding:24px;
  font-size:21px;
  font-weight:700;
  letter-spacing:.02em;
}
.cover-violet { background:linear-gradient(135deg,#7C5CE4,#B58CF0); }
.cover-rose { background:linear-gradient(135deg,#E784A9,#C456DD); }
.cover-amber { background:linear-gradient(135deg,#E5A45D,#BF7BDD); }
.cover-blue { background:linear-gradient(135deg,#6686E6,#8564D9); }
.cover-lilac { background:linear-gradient(135deg,#AF8AE8,#E6B6F8); }
.cover-ink { background:linear-gradient(135deg,#141320,#5B3FC4); }
.blog-card > small {
  display:block;
  margin:18px 4px 8px;
  color:#948e9d;
  font-size:10px;
  letter-spacing:.12em;
  font-weight:700;
}
.blog-card h3 { margin:0 4px 8px; font-size:25px; line-height:1.22; }
.blog-card p { margin:0 4px; color:var(--muted); line-height:1.6; }

/* Legal */
.legal-visual,
.terms-visual {
  width:min(460px,94%);
  height:400px;
  position:relative;
  display:grid;
  place-items:center;
}
.legal-lock {
  width:190px;
  height:170px;
  border-radius:30px;
  background:linear-gradient(135deg,#8F74EA,#5B3FC4);
  display:grid;
  place-items:center;
  color:#fff;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:34px;
  box-shadow:0 20px 60px rgba(91,63,196,.22);
  position:relative;
  z-index:2;
}
.lock-shackle {
  position:absolute;
  width:110px;
  height:100px;
  border:18px solid #7C5CE4;
  border-bottom:0;
  border-radius:60px 60px 0 0;
  top:-78px;
  left:50%;
  transform:translateX(-50%);
}
.legal-ripple {
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(124,92,228,.18);
  animation:softPulse 5s ease-in-out infinite;
}
.lr1 { width:300px; height:300px; }
.lr2 { width:390px; height:390px; animation-delay:-2.5s; }

.terms-sheet {
  position:absolute;
  width:280px;
  height:330px;
  border-radius:24px;
  border:1px solid rgba(20,19,32,.08);
  box-shadow:0 20px 44px rgba(20,19,32,.08);
}
.terms-sheet.t1 { transform:rotate(-12deg) translate(-32px,6px); background:#EDE7FF; }
.terms-sheet.t2 { transform:rotate(10deg) translate(34px,8px); background:#F6F1FD; }
.terms-sheet.t3 {
  background:#fff;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:30px;
}
.terms-sheet.t3 span { font-family:"Cormorant Garamond", Georgia, serif; font-size:48px; }
.terms-sheet.t3 small { color:#918b99; margin-top:4px; }

.legal-layout {
  display:grid;
  grid-template-columns:270px 1fr;
  gap:54px;
  max-width:1100px;
  margin:0 auto;
}
.legal-toc {
  align-self:start;
  position:sticky;
  top:120px;
  display:grid;
  gap:8px;
}
.legal-toc strong { font-size:18px; margin:6px 0 8px; }
.legal-toc a {
  padding:10px 12px;
  border-radius:10px;
  color:#77717f;
  font-size:13px;
}
.legal-toc a:hover { background:var(--brand-wash); color:var(--brand-deep); }
.legal-copy {
  max-width:760px;
}
.legal-copy section {
  padding:0 0 42px;
  margin-bottom:42px;
  border-bottom:1px solid rgba(20,19,32,.08);
}
.legal-copy h2,
.legal-copy h3 {
  margin:10px 0 14px;
}
.legal-copy h2 { font-size:36px; }
.legal-copy h3 { font-size:28px; }
.legal-copy p {
  color:#5e5967;
  font-size:16px;
  line-height:1.8;
}
.legal-callout {
  margin-top:24px;
  padding:20px 22px;
  border-radius:16px;
  background:var(--brand-wash);
  color:#4F436E;
  border:1px solid rgba(124,92,228,.14);
}
.legal-num {
  color:var(--brand);
  font-size:11px;
  letter-spacing:.12em;
  font-weight:800;
}

/* Motion */
@keyframes dashFlow {
  to { stroke-dashoffset:-30; }
}
@keyframes orbitSpin {
  to { transform:rotate(360deg); }
}
@keyframes cursorMove {
  0%,100% { transform:translate(0,0) rotate(-15deg); }
  35% { transform:translate(-110px,-45px) rotate(-15deg); }
  70% { transform:translate(-30px,-115px) rotate(-15deg); }
}

@media (max-width: 1050px) {
  .subpage-hero { grid-template-columns:1fr; min-height:auto; }
  .subpage-hero-copy { text-align:center; margin:0 auto; }
  .subpage-hero-copy p { margin-inline:auto; }
  .subpage-hero-visual { min-height:380px; }
  .schema-grid,
  .coverage-cards,
  .tutorial-grid,
  .blog-grid { grid-template-columns:repeat(2,1fr); }
  .principle-panel,
  .source-identity-panel,
  .permission-banner,
  .featured-article { grid-template-columns:1fr; }
  .faq-page-layout,
  .legal-layout { grid-template-columns:1fr; }
  .faq-side,
  .legal-toc { position:static; }
  .faq-side { display:flex; flex-wrap:wrap; }
}

@media (max-width: 760px) {
  .subpage-hero,
  .subpage-section,
  .subpage-cta,
  .page-footer { width:min(100% - 28px, 1280px); }
  .subpage-hero { padding:44px 20px; border-radius:26px; }
  .subpage-hero-copy h1 { font-size:clamp(54px,15vw,72px); }
  .subpage-hero-visual { min-height:320px; }
  .schema-grid,
  .coverage-cards,
  .tutorial-grid,
  .blog-grid { grid-template-columns:1fr; }
  .snapshot-strip { grid-template-columns:1fr 1fr; }
  .snapshot-strip article:nth-child(2n) { border-right:0; }
  .principle-panel,
  .source-identity-panel,
  .permission-banner { padding:34px 22px; }
  .method-steps::before { left:28px; }
  .method-step { grid-template-columns:58px 1fr; gap:16px; }
  .method-step > span { width:58px; height:58px; }
  .method-orbit { transform:scale(.8); }
  .schema-map { transform:scale(.84); transform-origin:center; }
  .coverage-map { transform:scale(.84); transform-origin:center; }
  .tutorial-player { transform:scale(.86); transform-origin:center; }
  .featured-art { min-height:360px; }
}

@media (max-width: 520px) {
  .snapshot-strip { grid-template-columns:1fr; }
  .snapshot-strip article { border-right:0; border-bottom:1px solid rgba(20,19,32,.07); }
  .snapshot-strip article:last-child { border-bottom:0; }
  .method-node { font-size:11px; padding:8px 11px; }
  .record-card { width:82%; }
  .page-footer { padding-left:0; padding-right:0; }
}

.page-header .nav a.nav-current {
  color: var(--brand-deep);
  font-weight: 700;
}


/* V4 stability: content must never disappear when a page does not use homepage JS. */
.reveal { opacity: 1; transform: none; }
.motion-ready .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .72s var(--ease), transform .72s var(--ease);
}
.motion-ready .reveal.is-visible { opacity: 1; transform: translateY(0); }

/* V4 secondary-page direction — closer to the clean Auraform reference pages. */
.simple-page-hero {
  width: min(1280px, calc(100% - 48px));
  margin: 18px auto 0;
  min-height: 330px;
  border: 1px solid rgba(20,19,32,.07);
  border-radius: 28px;
  background: rgba(255,255,255,.62);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 54px 24px;
}
.simple-page-hero h1 {
  margin: 16px 0 10px;
  font-size: clamp(52px, 6vw, 74px);
}
.simple-page-hero p {
  margin: 0;
  color: var(--muted);
  max-width: 680px;
  line-height: 1.65;
}

/* Contact */
.contact-wrap { width:min(1280px,calc(100% - 48px)); margin:70px auto 0; }
.contact-panel {
  border:1px solid rgba(20,19,32,.08);
  border-radius:28px;
  background:rgba(255,255,255,.66);
  padding:28px;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:24px;
}
.contact-info {
  padding:22px;
  display:flex;
  flex-direction:column;
  min-height:440px;
}
.contact-info > p { color:var(--muted); line-height:1.65; max-width:500px; }
.contact-methods { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:28px; }
.contact-method { padding:18px; border-radius:18px; border:1px solid rgba(20,19,32,.07); background:#fff; }
.contact-method small { display:block; color:#938d9a; margin-bottom:8px; }
.contact-method a { font-weight:700; }
.contact-note {
  margin-top:auto;
  padding-top:28px;
  border-top:1px solid rgba(20,19,32,.08);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:28px;
  line-height:1.15;
}
.contact-form {
  background:#fff;
  border-radius:22px;
  padding:24px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  box-shadow:0 18px 40px rgba(20,19,32,.04);
}
.form-field { display:grid; gap:7px; }
.form-field.full { grid-column:1/-1; }
.form-field label { font-size:12px; color:#504a58; font-weight:700; }
.form-field input,.form-field textarea {
  width:100%; border:1px solid rgba(20,19,32,.08); border-radius:12px; background:#FAF9FC; font:inherit; padding:13px 14px; outline:none;
}
.form-field input:focus,.form-field textarea:focus { border-color:rgba(124,92,228,.45); box-shadow:0 0 0 4px rgba(124,92,228,.08); }
.form-field textarea { min-height:120px; resize:vertical; }
.contact-submit { grid-column:1/-1; border:0; min-height:48px; border-radius:999px; background:var(--ink); color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.contact-submit:hover { background:var(--brand-deep); }
.contact-status { grid-column:1/-1; color:var(--brand-deep); font-size:12px; margin:0; }

/* Compact Blog hint */
.blog-page .subpage-hero { min-height:360px; grid-template-columns:1fr; text-align:center; }
.blog-page .subpage-hero-copy { margin:auto; }
.blog-page .subpage-hero-visual { display:none; }
.blog-page .featured-article { display:none; }
.blog-page .blog-grid { grid-template-columns:repeat(3,1fr); }
.blog-page .blog-card { padding:12px 12px 20px; border-radius:18px; }
.blog-page .blog-cover { min-height:210px; border-radius:12px; font-size:18px; }
.blog-page .blog-card h3 { font-size:20px; }
.blog-page .blog-card p { display:none; }

/* Legal pages: white editorial reading pages, matching the hint more closely. */
.privacy-page .subpage-hero,
.terms-page .subpage-hero {
  min-height:300px;
  grid-template-columns:1fr;
  text-align:center;
  background:rgba(255,255,255,.58);
}
.privacy-page .subpage-hero-copy,
.terms-page .subpage-hero-copy { margin:auto; }
.privacy-page .subpage-hero-visual,
.terms-page .subpage-hero-visual { display:none; }
.privacy-page .legal-layout,
.terms-page .legal-layout {
  grid-template-columns:1fr;
  max-width:760px;
}
.privacy-page .legal-toc,
.terms-page .legal-toc { display:none; }
.privacy-page .legal-copy section,
.terms-page .legal-copy section { padding-bottom:34px; margin-bottom:34px; }
.privacy-page .legal-copy p,
.terms-page .legal-copy p { font-size:14px; line-height:1.75; color:#6e6876; }
.privacy-page .legal-copy h2,
.terms-page .legal-copy h2 { font-family:"Cormorant Garamond",Georgia,serif; font-size:31px; }

/* Compact shared footer on secondary pages. */
.page-footer { padding-top:44px; padding-bottom:26px; }
.page-footer .footer-brand p { font-size:13px; max-width:330px; }
.page-footer .footer-links a { font-size:13px; }

/* 404 */
.not-found-main { min-height:690px; display:grid; place-items:center; padding:36px 24px; }
.not-found-card {
  width:min(1280px,100%); min-height:520px; border:1px solid rgba(20,19,32,.08); border-radius:28px; background:rgba(255,255,255,.62);
  display:grid; place-items:center; text-align:center; position:relative; overflow:hidden;
}
.not-found-card::before { content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:rgba(124,92,228,.08); filter:blur(60px); }
.not-found-copy { position:relative; z-index:2; }
.not-found-copy strong { display:block; font-size:100px; line-height:1; color:var(--brand); font-weight:500; }
.not-found-copy h1 { margin:8px 0 10px; font-size:28px; }
.not-found-copy p { color:var(--muted); margin:0 0 24px; }

@media (max-width: 900px) {
  .contact-panel { grid-template-columns:1fr; }
  .contact-info { min-height:auto; }
  .contact-note { margin-top:36px; }
  .blog-page .blog-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 620px) {
  .contact-wrap,.simple-page-hero { width:min(100% - 28px,1280px); }
  .contact-form { grid-template-columns:1fr; }
  .form-field.full,.contact-submit,.contact-status { grid-column:auto; }
  .contact-methods { grid-template-columns:1fr; }
  .blog-page .blog-grid { grid-template-columns:1fr; }
}


/* ============================================================
   V5 AUTH + PRICING + LEGAL
   ============================================================ */

.pricing-control-wrap { max-width:1180px; margin:0 auto; }
.billing-toggle {
  width:fit-content; margin:0 auto 30px; padding:5px; border-radius:999px;
  display:flex; gap:4px; background:rgba(20,19,32,.055); border:1px solid rgba(20,19,32,.06);
}
.billing-option {
  min-height:44px; padding:0 20px; border:0; border-radius:999px; background:transparent;
  font:inherit; font-weight:700; color:#77717f; cursor:pointer; transition:.25s var(--ease);
}
.billing-option span { margin-left:7px; font-size:10px; color:var(--brand-deep); }
.billing-option.active { background:#fff; color:var(--ink); box-shadow:0 8px 20px rgba(20,19,32,.08); }
.pricing-grid-v5 { align-items:stretch; }
.plan-card { position:relative; padding:28px; overflow:visible; }
.plan-topline { display:flex; align-items:center; gap:9px; color:#8f8997; min-height:24px; }
.plan-topline small { font-size:9px; letter-spacing:.12em; font-weight:800; }
.plan-dot { width:8px; height:8px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 6px rgba(124,92,228,.08); }
.plan-card.highlight .plan-dot { background:#ff6a94; box-shadow:0 0 0 6px rgba(255,106,148,.08); }
.plan-card.highlight .plan-topline { color:#cfcad7; }
.plan-price { display:flex; align-items:baseline; gap:5px; min-height:66px; margin:6px 0 0; }
.plan-price .currency { font-size:14px; font-weight:800; color:#77717f; }
.plan-card.highlight .currency { color:#ccc7d5; }
.plan-price .price-value { font-size:54px; font-family:"Cormorant Garamond",Georgia,serif; line-height:1; margin:0; }
.plan-price .price-period { font-size:13px; color:#8c8694; }
.price-owner-note { min-height:28px; color:#a09aa6; font-size:10px; margin:-2px 0 18px; }
.enterprise-price { min-height:94px; display:flex; flex-direction:column; justify-content:center; }
.enterprise-price strong { margin:0 0 4px; font-family:"Cormorant Garamond",Georgia,serif; font-size:54px; line-height:1; }
.enterprise-price span { font-size:12px; color:#8c8694; }
.popular-badge { position:absolute; top:18px; right:18px; padding:7px 10px; border-radius:999px; background:linear-gradient(135deg,#ff6d91,#a35ee6); color:#fff; font-size:9px; letter-spacing:.08em; font-weight:800; }
.pricing-more { text-align:center; margin-top:22px; }
.pricing-disclaimer { max-width:820px; margin:22px auto 0; text-align:center; color:#948e9b; font-size:12px; line-height:1.65; }
.pricing-compare { border:1px solid var(--line); border-radius:28px; padding:46px; background:rgba(255,255,255,.68); display:grid; grid-template-columns:.8fr 1.2fr; gap:50px; }
.pricing-compare h2 { margin:18px 0 0; font-size:clamp(50px,5vw,68px); }
.pricing-compare-list { display:grid; gap:14px; }
.pricing-compare-list article { padding:20px; border-radius:18px; background:#fff; border:1px solid rgba(20,19,32,.05); }
.pricing-compare-list strong { font-size:20px; }
.pricing-compare-list p { margin:7px 0 0; color:var(--muted); line-height:1.55; }

.auth-page { min-height:100vh; }
.auth-page .page-footer { margin-top:20px; }
.auth-shell {
  width:min(1180px,calc(100% - 48px)); min-height:720px; margin:32px auto 70px;
  display:grid; grid-template-columns:1fr 520px; border:1px solid rgba(20,19,32,.07); border-radius:32px; overflow:hidden;
  background:rgba(255,255,255,.72); box-shadow:0 30px 80px rgba(58,43,90,.06);
}
.auth-visual {
  min-height:720px; padding:64px; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end;
  background:radial-gradient(circle at 50% 10%, rgba(124,92,228,.14), transparent 24rem), linear-gradient(180deg,#faf8ff,#f6f2ff);
}
.auth-visual h1 { max-width:570px; margin:18px 0 14px; font-size:clamp(58px,6vw,78px); }
.auth-visual > p { max-width:580px; color:var(--muted); line-height:1.65; font-size:17px; }
.auth-proof { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.auth-proof span { padding:9px 12px; border-radius:999px; background:rgba(255,255,255,.8); border:1px solid rgba(20,19,32,.06); font-size:11px; color:#686271; }
.auth-orb-wrap { position:absolute; left:50%; top:30px; width:420px; height:330px; transform:translateX(-50%); }
.auth-orb { position:absolute; left:50%; transform:translateX(-50%); border-radius:50% 50% 0 0/100% 100% 0 0; }
.ao1 { width:400px; height:190px; bottom:10px; background:linear-gradient(180deg,#BDAAFF,#7C5CE4); box-shadow:0 -16px 60px rgba(124,92,228,.18); }
.ao2 { width:330px; height:155px; bottom:16px; border:2px solid rgba(255,255,255,.7); background:rgba(255,255,255,.1); animation:orbitFloat 9s ease-in-out infinite; }
.ao3 { width:260px; height:120px; bottom:24px; border:2px solid rgba(255,255,255,.45); background:rgba(255,255,255,.08); animation:orbitFloat 7s ease-in-out infinite reverse; }
.auth-card { padding:58px 48px; display:flex; flex-direction:column; justify-content:center; background:#fff; }
.auth-card-head h2 { margin:0 0 7px; font-size:34px; }
.auth-card-head p { margin:0 0 25px; color:var(--muted); }
.google-auth-btn { width:100%; height:52px; border-radius:14px; background:#fff; border:1px solid rgba(20,19,32,.13); display:flex; align-items:center; justify-content:center; gap:11px; font:inherit; font-weight:700; cursor:pointer; transition:transform .2s var(--ease),box-shadow .2s var(--ease); }
.google-auth-btn:hover { transform:translateY(-2px); box-shadow:0 12px 24px rgba(20,19,32,.07); }
.google-g { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; color:#4285F4; font-weight:800; border:1px solid rgba(66,133,244,.18); }
.auth-divider { display:flex; align-items:center; gap:12px; color:#aaa4ae; font-size:11px; margin:22px 0; }
.auth-divider::before,.auth-divider::after { content:""; height:1px; flex:1; background:rgba(20,19,32,.08); }
.auth-form { display:grid; gap:16px; }
.auth-form label { display:grid; gap:7px; font-size:12px; font-weight:700; color:#514b58; }
.auth-form input[type="email"],.auth-form input[type="password"],.auth-form input[type="text"] { width:100%; height:50px; border-radius:13px; border:1px solid rgba(20,19,32,.12); padding:0 14px; font:inherit; outline:none; background:#fcfbfd; }
.auth-form input:focus { border-color:rgba(124,92,228,.55); box-shadow:0 0 0 4px rgba(124,92,228,.08); }
.auth-name-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.auth-row { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.check-row { display:flex!important; grid-template-columns:none!important; align-items:center; gap:8px!important; font-weight:500!important; color:#77717f!important; }
.check-row input { accent-color:var(--brand); }
.check-row a { color:var(--brand-deep); text-decoration:underline; }
.auth-submit { border:0; cursor:pointer; }
.auth-switch { text-align:center; color:#8b8592; font-size:13px; margin:22px 0 0; }
.auth-switch a { color:var(--brand-deep); font-weight:700; }
.auth-status { margin:0; padding:11px 13px; border-radius:12px; background:var(--brand-wash); color:#594676; font-size:12px; line-height:1.5; }
.signup-plan-box { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; align-items:center; padding:14px; border-radius:15px; background:#f8f5ff; border:1px solid rgba(124,92,228,.12); }
.signup-plan-box small { display:block; color:#9b95a3; font-size:8px; letter-spacing:.12em; margin-bottom:4px; }
.signup-plan-box strong { font-size:13px; }
.signup-plan-box a { color:var(--brand-deep); font-size:12px; font-weight:700; }
.legal-check { line-height:1.45; align-items:flex-start; }

.legal-review-banner { width:min(980px,calc(100% - 48px)); margin:34px auto 0; padding:17px 20px; border-radius:16px; background:#FFF8E9; border:1px solid rgba(196,137,23,.20); color:#6b562f; display:flex; gap:10px; align-items:flex-start; font-size:12px; line-height:1.55; }
.legal-review-banner strong { white-space:nowrap; }
.legal-layout { display:grid; grid-template-columns:250px 1fr; gap:54px; max-width:1100px; margin:0 auto; }
.legal-toc { position:sticky; top:120px; align-self:start; display:grid; gap:4px; max-height:calc(100vh - 150px); overflow:auto; padding-right:6px; }
.legal-toc a { padding:8px 10px; border-radius:10px; color:#7a7481; font-size:12px; }
.legal-toc a:hover { background:var(--brand-wash); color:var(--brand-deep); }

@media(max-width:1050px){.auth-shell{grid-template-columns:1fr;}.auth-visual{min-height:520px}.auth-card{max-width:none}.pricing-compare{grid-template-columns:1fr}.legal-layout{grid-template-columns:1fr}.legal-toc{position:static;max-height:none;grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.auth-shell{width:min(100% - 28px,1180px);margin-top:18px}.auth-visual{padding:36px 24px;min-height:500px}.auth-card{padding:38px 24px}.auth-name-grid{grid-template-columns:1fr}.auth-row{align-items:flex-start;flex-direction:column}.signup-plan-box{grid-template-columns:1fr 1fr}.signup-plan-box a{grid-column:1/-1}.billing-option span{display:none}.plan-card{padding:23px}.legal-review-banner{width:min(100% - 28px,980px);flex-direction:column}.legal-review-banner strong{white-space:normal}.legal-toc{grid-template-columns:1fr 1fr}}


/* =========================================================
   V6 — REAL SPOONINDEX MARK + LANGUAGE + POLISHED VISUALS
   ========================================================= */

.brand-real { gap: 12px; }
.brand-logo-img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  flex: 0 0 42px;
  filter: drop-shadow(0 8px 16px rgba(91,63,196,.12));
}
.footer-brand .brand-logo-img { width: 38px; height: 38px; flex-basis: 38px; }

.language-btn {
  min-height: 46px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.76);
  font-size: 13px;
  font-weight: 700;
  transition: transform .22s var(--ease), border-color .22s ease, background .22s ease;
}
.language-btn:hover {
  transform: translateY(-2px);
  border-color: rgba(124,92,228,.24);
  background: #fff;
}

/* Hero: replace the loose half-circle artwork with the real mark */
.logo-visual-wrap {
  height: 390px;
  max-width: 1100px;
  margin-top: 58px;
  display: grid;
  place-items: center;
}
.logo-halo {
  position: absolute;
  left: 50%;
  top: 54%;
  transform: translate(-50%,-50%);
  border-radius: 50%;
  border: 1px solid rgba(124,92,228,.17);
  background: radial-gradient(circle, rgba(124,92,228,.035), rgba(124,92,228,0) 68%);
}
.halo-outer { width: 650px; height: 650px; animation: haloBreath 8s ease-in-out infinite; }
.halo-middle { width: 480px; height: 480px; animation: haloBreath 7s ease-in-out infinite reverse; }
.halo-inner { width: 320px; height: 320px; background: rgba(124,92,228,.035); }
.hero-logo-core {
  width: 214px;
  height: 214px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(124,92,228,.14);
  box-shadow:
    0 34px 90px rgba(91,63,196,.16),
    inset 0 0 50px rgba(124,92,228,.05);
  backdrop-filter: blur(16px);
  position: relative;
  z-index: 4;
  animation: logoFloat 5.6s ease-in-out infinite;
}
.hero-logo-core::before {
  content:"";
  position:absolute;
  inset:18px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(124,92,228,.10), transparent 68%);
}
.hero-logo-core img {
  width: 142px;
  height: 142px;
  position: relative;
  z-index: 2;
}
.logo-orbit {
  position:absolute;
  left:50%;
  top:54%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  border:1px dashed rgba(124,92,228,.18);
}
.logo-orbit.orbit-a { width:390px; height:390px; animation: orbitSpinV6 18s linear infinite; }
.logo-orbit.orbit-b { width:560px; height:560px; animation: orbitSpinV6 26s linear infinite reverse; }
.logo-orbit i {
  position:absolute;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 0 0 7px rgba(124,92,228,.09);
}
.logo-orbit.orbit-a i:nth-child(1){left:7%;top:30%}
.logo-orbit.orbit-a i:nth-child(2){right:4%;top:45%}
.logo-orbit.orbit-a i:nth-child(3){left:48%;bottom:-5px}
.logo-orbit.orbit-b i:nth-child(1){right:12%;top:19%}
.logo-orbit.orbit-b i:nth-child(2){left:11%;bottom:18%}
.logo-spark {
  position:absolute;
  color:#8D72EA;
  animation:sparkFloat 5s ease-in-out infinite;
}
.ls1 { left:20%; top:30%; font-size:19px; }
.ls2 { right:19%; top:21%; font-size:12px; animation-delay:-1.8s; }
.ls3 { right:31%; bottom:22%; font-size:9px; animation-delay:-3s; }

/* Adaptive Learning: no placeholder human illustration */
.adaptive-ai-card {
  min-height: 300px;
  background:
    radial-gradient(circle at 50% 45%, rgba(124,92,228,.12), transparent 35%),
    linear-gradient(180deg, #FCFBFF, #F7F3FF);
}
.adaptive-ring {
  position:absolute;
  left:50%;
  top:43%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(124,92,228,.18);
  border-radius:50%;
}
.adaptive-ring.ar1 { width:190px; height:190px; }
.adaptive-ring.ar2 { width:260px; height:260px; border-style:dashed; animation:orbitSpinV6 20s linear infinite; }
.adaptive-logo {
  position:absolute;
  left:50%;
  top:43%;
  width:84px;
  height:84px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:#fff;
  display:grid;
  place-items:center;
  box-shadow:0 16px 36px rgba(91,63,196,.13);
  z-index:3;
}
.adaptive-logo img { width:57px; height:57px; }
.adaptive-chip {
  position:absolute;
  z-index:4;
  padding:9px 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 10px 22px rgba(20,19,32,.055);
  color:#5d5767;
  font-size:11px;
  font-weight:600;
  animation:softFloat 5s ease-in-out infinite;
}
.ac1 { left:12%; top:27%; }
.ac2 { right:12%; top:22%; animation-delay:-1.2s; }
.ac3 { left:15%; top:60%; animation-delay:-2.3s; }
.ac4 { right:10%; top:57%; animation-delay:-3.1s; }
.learning-trail {
  position:absolute;
  left:50%;
  bottom:67px;
  transform:translateX(-50%);
  width:78%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#80798C;
  font-size:9px;
  white-space:nowrap;
}
.learning-trail i {
  width:18px;
  height:1px;
  background:linear-gradient(90deg, rgba(124,92,228,.2), rgba(124,92,228,.6));
}

/* Coverage visual: map/network instead of another random circle cluster */
.coverage-mini-map {
  min-height:230px;
  background:linear-gradient(145deg,#FCFBFF,#F5F1FF);
}
.coverage-mini-map svg { position:absolute; inset:17%; width:66%; height:60%; overflow:visible; }
.coverage-mini-map path {
  fill:none;
  stroke:rgba(124,92,228,.24);
  stroke-width:.75;
  stroke-dasharray:2.4 2.8;
  animation:dashFlow 12s linear infinite;
}
.coverage-logo-watermark {
  position:absolute;
  width:86px;
  height:86px;
  left:50%;
  top:49%;
  transform:translate(-50%,-50%);
  opacity:.10;
}
.coverage-logo-watermark img { width:100%; height:100%; }
.map-p {
  position:absolute;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 0 0 7px rgba(124,92,228,.09);
  animation:pulse 3s infinite;
}
.m1{left:18%;top:61%}.m2{left:37%;top:46%;animation-delay:-.5s}.m3{left:53%;top:30%;animation-delay:-1s}.m4{right:22%;top:45%;animation-delay:-1.5s}.m5{right:14%;top:25%;animation-delay:-2s}
.map-label {
  position:absolute;
  padding:7px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(20,19,32,.06);
  font-size:10px;
  color:#5e5867;
}
.ml1{left:15%;bottom:16%}.ml2{right:13%;top:13%}

@keyframes orbitSpinV6 { to { transform:translate(-50%,-50%) rotate(360deg); } }
@keyframes haloBreath {
  0%,100% { transform:translate(-50%,-50%) scale(1); opacity:.65; }
  50% { transform:translate(-50%,-50%) scale(1.035); opacity:1; }
}
@keyframes logoFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-9px); }
}

/* Arabic / RTL */
html[dir="rtl"] body,
body.rtl-page {
  font-family:"IBM Plex Sans Arabic","Noto Sans Arabic","Tahoma",sans-serif;
  direction:rtl;
}
html[dir="rtl"] .serif-heading,
html[dir="rtl"] .hero h1,
html[dir="rtl"] .blog-paper strong,
html[dir="rtl"] .featured-copy h2,
html[dir="rtl"] .terms-sheet.t3 span {
  font-family:"Noto Naskh Arabic","IBM Plex Sans Arabic","Tahoma",serif;
  letter-spacing:0;
}
html[dir="rtl"] .site-header {
  grid-template-columns:1fr auto 1fr;
}
html[dir="rtl"] .brand { direction:ltr; }
html[dir="rtl"] .header-actions { justify-self:start; }
html[dir="rtl"] .brand { justify-self:end; }
html[dir="rtl"] .type-line { text-align:right; }
html[dir="rtl"] .use-tab,
html[dir="rtl"] .faq-question { text-align:right; }
html[dir="rtl"] .showcase-tab { text-align:right; }
html[dir="rtl"] .showcase-tab.active::after { right:auto; left:0; }
html[dir="rtl"] .method-steps::before { left:auto; right:37px; }
html[dir="rtl"] .method-step { grid-template-columns:1fr 76px; }
html[dir="rtl"] .method-step > span { grid-column:2; grid-row:1; }
html[dir="rtl"] .method-step > div { grid-column:1; grid-row:1; }
html[dir="rtl"] .legal-toc,
html[dir="rtl"] .faq-side { text-align:right; }
html[dir="rtl"] .auth-form label { text-align:right; }
html[dir="rtl"] .auth-card,
html[dir="rtl"] .auth-visual { text-align:right; }
html[dir="rtl"] .auth-divider::before,
html[dir="rtl"] .auth-divider::after { direction:ltr; }

@media(max-width:1100px){
  .language-btn { min-height:42px; padding:0 13px; }
}
@media(max-width:820px){
  .header-actions { gap:7px; }
  .language-btn { font-size:0; width:46px; padding:0; }
  .language-btn span { font-size:18px; }
  .header-actions .btn { padding-inline:14px; }
  .logo-visual-wrap { height:320px; }
  .halo-outer { width:480px; height:480px; }
  .halo-middle { width:360px; height:360px; }
  .halo-inner { width:250px; height:250px; }
  .hero-logo-core { width:170px; height:170px; }
  .hero-logo-core img { width:110px; height:110px; }
}
@media(max-width:560px){
  .header-actions .btn-ghost { display:none; }
  .brand-logo-img { width:36px; height:36px; flex-basis:36px; }
  html[dir="rtl"] .method-steps::before { right:28px; }
  html[dir="rtl"] .method-step { grid-template-columns:1fr 58px; }
}

.legal-language-note{
  width:min(1100px,calc(100% - 48px));
  margin:26px auto 0;
  padding:14px 18px;
  border-radius:14px;
  background:#F1ECFD;
  border:1px solid rgba(124,92,228,.14);
  color:#51456B;
  font-size:13px;
  line-height:1.7;
}


/* ============================================================
   V7 CLEANUP — STABLE BILINGUAL HEADER + RESTRAINED BRAND MARK
   ============================================================ */

.site-header {
  width: min(1480px, calc(100% - 40px));
  height: 84px;
  padding: 0 4px;
  display: flex;
  align-items: center;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 200;
  background: rgba(251,250,253,.90);
  border-bottom: 1px solid rgba(20,19,32,.06);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.site-header .brand {
  flex: 0 0 250px;
  justify-content: flex-start;
}
.site-header .nav {
  flex: 1 1 auto;
  justify-content: center;
  gap: clamp(18px, 2vw, 30px);
  white-space: nowrap;
}
.site-header .header-actions {
  flex: 0 0 auto;
  justify-self: auto;
  margin-left: auto;
  gap: 9px;
  white-space: nowrap;
}
.site-header .brand-logo-img {
  width: 36px;
  height: 36px;
  flex-basis: 36px;
  filter: none;
}
.site-header .brand-copy strong { font-size: 19px; }
.site-header .brand-copy small { font-size: 7px; letter-spacing: 1.7px; }
.header-demo { background:#fff; min-width:124px; }
.header-login { min-width:112px; }
.language-btn { min-width:76px; }

.hero {
  padding-top: clamp(64px, 7vh, 92px);
}
.hero-content { z-index: 10; }

/* Clean market visual: motion/data first, logo only as one small central node. */
.clean-market-visual {
  width:min(1080px, 94vw);
  height:300px;
  margin-top:52px;
}
.market-plane {
  position:absolute;
  inset:0;
  border-radius:30px;
  border:1px solid rgba(124,92,228,.10);
  background:
    radial-gradient(circle at 50% 50%, rgba(124,92,228,.075), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.65), rgba(247,244,255,.66));
  overflow:hidden;
}
.market-plane::before {
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(124,92,228,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,92,228,.032) 1px, transparent 1px);
  background-size:48px 48px;
}
.market-path {
  position:absolute;
  inset:16% 6%;
  width:88%;
  height:70%;
}
.market-path path {
  fill:none;
  stroke:rgba(124,92,228,.26);
  stroke-width:1.1;
  stroke-dasharray:5 7;
  animation:dashFlow 16s linear infinite;
}
.market-point {
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 0 0 7px rgba(124,92,228,.08);
  animation:pulse 3.4s infinite;
}
.market-point.p1{left:12%;top:68%}
.market-point.p2{left:28%;top:42%;animation-delay:-.6s}
.market-point.p3{left:45%;top:50%;animation-delay:-1.2s}
.market-point.p4{left:61%;top:25%;animation-delay:-1.8s}
.market-point.p5{right:22%;top:55%;animation-delay:-2.4s}
.market-point.p6{right:9%;top:22%;animation-delay:-3s}
.market-brand-node {
  position:absolute;
  left:50%;
  top:50%;
  width:72px;
  height:72px;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(124,92,228,.12);
  box-shadow:0 16px 40px rgba(91,63,196,.11);
  z-index:3;
  animation:softFloat 5.5s ease-in-out infinite;
}
.market-brand-node img { width:42px; height:42px; }
.market-mini-card {
  position:absolute;
  z-index:3;
  min-width:112px;
  padding:11px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(20,19,32,.065);
  box-shadow:0 12px 25px rgba(20,19,32,.055);
  backdrop-filter:blur(10px);
  animation:cardHover 7s ease-in-out infinite;
}
.market-mini-card small { display:block; color:#938c9c; font-size:9px; margin-bottom:3px; }
.market-mini-card strong { font-size:12px; }
.mc1{left:13%;top:17%}
.mc2{right:14%;top:20%;animation-delay:-2s}
.mc3{right:20%;bottom:12%;animation-delay:-4s}

/* Feature artwork: one small mark, organized network. */
.adaptive-clean-card {
  min-height:300px;
  background:linear-gradient(180deg,#FCFBFF,#F7F4FF);
}
.adaptive-network {
  position:absolute;
  inset:22px 20px 66px;
}
.adaptive-network svg { position:absolute; inset:0; width:100%; height:100%; }
.adaptive-network path {
  fill:none;
  stroke:rgba(124,92,228,.20);
  stroke-width:.65;
  stroke-dasharray:2 3;
  animation:dashFlow 14s linear infinite;
}
.adaptive-network > i {
  position:absolute;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 0 0 6px rgba(124,92,228,.08);
}
.an1{left:15%;top:62%}.an2{left:48%;top:38%}.an3{right:13%;top:22%}.an4{right:11%;bottom:17%}
.adaptive-center {
  position:absolute;
  left:49%;
  top:40%;
  width:58px;
  height:58px;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(124,92,228,.11);
  box-shadow:0 13px 28px rgba(91,63,196,.09);
}
.adaptive-center img { width:34px; height:34px; }
.adaptive-label {
  position:absolute;
  padding:7px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(20,19,32,.06);
  color:#5e5868;
  font-size:10px;
  box-shadow:0 8px 18px rgba(20,19,32,.045);
}
.al1{left:8%;top:19%}.al2{right:7%;top:11%}.al3{left:12%;bottom:9%}.al4{right:6%;bottom:15%}

/* Never let the actual logo blow up from generic image rules. */
.brand-logo-img,
.hero-logo-core img,
.adaptive-center img,
.market-brand-node img,
.coverage-logo-watermark img {
  object-fit:contain !important;
  max-width:100%;
  max-height:100%;
}

/* RTL is layout-safe: header stays physically stable, page text is RTL. */
html[dir="rtl"] .site-header { direction:ltr; }
html[dir="rtl"] .site-header .brand { direction:ltr; }
html[dir="rtl"] .site-header .nav { direction:ltr; }
html[dir="rtl"] .site-header .header-actions { direction:ltr; }
html[dir="rtl"] .site-header .nav a,
html[dir="rtl"] .site-header .header-actions a { unicode-bidi:plaintext; }
html[dir="rtl"] .hero-content,
html[dir="rtl"] .section-head,
html[dir="rtl"] .use-case-copy,
html[dir="rtl"] .faq-intro,
html[dir="rtl"] .legal-copy,
html[dir="rtl"] .footer-brand,
html[dir="rtl"] .footer-links { direction:rtl; }

html[dir="rtl"] .hero h1 {
  font-family:"Noto Naskh Arabic","IBM Plex Sans Arabic",Tahoma,serif;
  font-size:clamp(58px,6vw,88px);
  line-height:1.02;
  letter-spacing:0;
}
html[dir="rtl"] .hero > .hero-content > p { line-height:1.8; }
html[dir="rtl"] .serif-heading {
  font-family:"Noto Naskh Arabic","IBM Plex Sans Arabic",Tahoma,serif;
  letter-spacing:0;
  line-height:1.12;
}
html[dir="rtl"] .section-head h2 { font-size:clamp(46px,5.3vw,68px); }
html[dir="rtl"] .feature-card p,
html[dir="rtl"] .section-head p,
html[dir="rtl"] .use-case-copy p,
html[dir="rtl"] .faq-answer,
html[dir="rtl"] .legal-copy p { line-height:1.85; }

@media(max-width:1250px){
  .site-header .brand { flex-basis:205px; }
  .site-header .nav { gap:16px; font-size:13px; }
  .header-demo { min-width:112px; }
}
@media(max-width:1020px){
  .site-header .nav { display:none; }
  .site-header .brand { flex:1 1 auto; }
}
@media(max-width:720px){
  .site-header {
    width:min(100% - 20px,1480px);
    height:72px;
    gap:7px;
  }
  .site-header .brand-copy small { display:none; }
  .site-header .brand { min-width:0; }
  .language-btn { width:42px; min-width:42px; padding:0; font-size:0; }
  .language-btn span { font-size:17px; }
  .header-demo { display:none; }
  .header-login { min-width:auto; padding-inline:14px; }
  .clean-market-visual { height:250px; margin-top:34px; }
  .market-mini-card { display:none; }
  .market-brand-node { width:60px; height:60px; }
  .market-brand-node img { width:34px; height:34px; }
}


/* ============================================================
   V8 APPROVED HERO — CLEAN WEB IMPLEMENTATION
   ============================================================ */

.approved-hero {
  width:min(1480px, calc(100% - 40px));
  margin:0 auto;
  padding:70px 0 44px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.approved-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(90px);
  pointer-events:none;
  z-index:-1;
}
.glow-a{
  width:380px;height:380px;
  left:5%;top:10%;
  background:rgba(255,118,146,.10);
}
.glow-b{
  width:430px;height:430px;
  right:2%;top:6%;
  background:rgba(124,92,228,.10);
}

.approved-hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:64px;
  align-items:center;
  min-height:500px;
}

.approved-copy{
  max-width:760px;
  padding-left:34px;
}
.approved-copy h1{
  margin:20px 0 22px;
  font-size:clamp(58px,6vw,88px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:800;
  color:var(--ink);
}
.approved-copy h1 span{
  display:block;
  margin-top:10px;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:600;
  font-size:1.02em;
  letter-spacing:-.025em;
  background:linear-gradient(90deg,#ef5d73 0%,#c96fe8 50%,#7c5ce4 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.approved-copy > p{
  margin:0;
  max-width:640px;
  font-size:20px;
  line-height:1.7;
  color:#696372;
}
.approved-actions{
  display:flex;
  gap:14px;
  margin-top:34px;
}
.hero-primary,.hero-secondary{
  min-height:56px;
  padding-inline:28px;
  font-size:15px;
}

.approved-visual{
  min-height:460px;
  position:relative;
}
.network-lines{
  position:absolute;
  inset:2% 0 0;
  width:100%;
  height:96%;
}
.network-lines path{
  fill:none;
  stroke:rgba(124,92,228,.17);
  stroke-width:1.2;
}
.network-dot{
  position:absolute;
  width:12px;height:12px;
  border-radius:50%;
  background:#9a7cf0;
  box-shadow:0 0 0 8px rgba(124,92,228,.08);
  animation:pulse 3.2s infinite;
}
.nd1{left:14%;top:64%}.nd2{left:31%;top:39%;animation-delay:-.5s}.nd3{left:47%;top:20%;animation-delay:-1s}
.nd4{right:28%;top:47%;animation-delay:-1.5s}.nd5{right:10%;top:27%;animation-delay:-2s}.nd6{right:17%;bottom:17%;animation-delay:-2.5s}

.insight-card-visual{
  position:absolute;
  border-radius:24px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 22px 50px rgba(65,49,112,.09);
  backdrop-filter:blur(14px);
}
.insight-card-visual small{
  display:block;
  font-size:13px;
  font-weight:700;
  color:#4d4758;
}
.price-card-mini{
  width:220px;
  height:170px;
  right:6%;
  top:5%;
  padding:20px;
}
.price-card-mini svg{
  width:100%;
  height:105px;
  margin-top:10px;
}
.chart-grid{
  fill:none;
  stroke:rgba(20,19,32,.05);
  stroke-width:1;
}
.chart-line{
  fill:none;
  stroke:#7C5CE4;
  stroke-width:3;
  stroke-linecap:round;
}
.compare-card-mini{
  width:205px;
  height:155px;
  left:2%;
  top:46%;
  padding:20px;
}
.donut{
  width:68px;
  height:68px;
  border-radius:50%;
  background:conic-gradient(#7C5CE4 0 42%, #B999FF 42% 70%, #F088A7 70% 100%);
  position:absolute;
  left:20px;
  bottom:20px;
}
.donut::after{
  content:"";
  position:absolute;
  inset:16px;
  border-radius:50%;
  background:white;
}
.mini-lines{
  position:absolute;
  right:18px;
  bottom:28px;
  width:74px;
  display:grid;
  gap:10px;
}
.mini-lines i{
  height:6px;
  border-radius:999px;
  background:#e9e4f3;
}
.mini-lines i:nth-child(2){width:72%}
.mini-lines i:nth-child(3){width:54%}

.growth-card-mini{
  width:230px;
  height:160px;
  right:0;
  bottom:3%;
  padding:20px;
}
.bars{
  position:absolute;
  left:22px;
  right:22px;
  bottom:22px;
  height:88px;
  display:flex;
  align-items:flex-end;
  gap:10px;
}
.bars i{
  flex:1;
  border-radius:7px 7px 2px 2px;
  background:linear-gradient(180deg,#9d82f4,#7456df);
}
.bars i:nth-child(1){height:24%}
.bars i:nth-child(2){height:38%}
.bars i:nth-child(3){height:53%}
.bars i:nth-child(4){height:72%}
.bars i:nth-child(5){height:92%}

.center-brand-chip{
  position:absolute;
  width:132px;height:132px;
  left:47%;top:47%;
  transform:translate(-50%,-50%);
  border-radius:26px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(124,92,228,.11);
  box-shadow:0 22px 55px rgba(91,63,196,.11);
}
.center-brand-chip img{
  width:60px;height:60px;
  object-fit:contain;
}

.approved-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:18px;
  padding:0 34px;
}
.approved-stats article{
  min-height:180px;
  padding:28px 30px;
  border-radius:24px;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 15px 38px rgba(20,19,32,.035);
}
.stat-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.stat-top strong{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:64px;
  line-height:1;
  font-weight:600;
}
.stat-icon{
  width:48px;height:48px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#F1ECFD;
  color:var(--brand-deep);
  font-size:18px;
}
.approved-stats p{
  margin:18px 0 0;
  color:#5f5968;
  line-height:1.6;
  font-size:16px;
}

/* Arabic */
.approved-hero-ar .approved-hero-grid{
  direction:rtl;
}
.approved-hero-ar .approved-copy{
  padding-left:0;
  padding-right:34px;
  text-align:right;
}
.approved-hero-ar .approved-copy h1{
  font-family:"Noto Naskh Arabic","IBM Plex Sans Arabic",Tahoma,serif;
  letter-spacing:0;
  font-size:clamp(60px,6.1vw,90px);
  line-height:1.02;
}
.approved-hero-ar .approved-copy h1 span{
  font-family:"Cormorant Garamond",Georgia,serif;
  direction:ltr;
  text-align:right;
}
.approved-hero-ar .approved-copy > p{
  line-height:1.9;
}
.approved-hero-ar .approved-actions{
  justify-content:flex-start;
}
.approved-hero-ar .approved-stats{
  direction:rtl;
}
.approved-hero-ar .approved-stats article{
  text-align:right;
}
.approved-hero-ar .stat-top{
  flex-direction:row-reverse;
}
.approved-hero-ar .insight-card-visual{
  direction:rtl;
  text-align:right;
}

/* Header specific to approved homepage */
.hero-header{
  width:min(1480px,calc(100% - 40px));
  margin:0 auto;
  height:86px;
  padding:0;
  background:rgba(251,250,253,.92);
}
.hero-header .brand{
  flex:0 0 260px;
}
.hero-header .brand-logo-img{
  width:34px;height:34px;
}
.hero-header .nav{
  gap:clamp(18px,2vw,30px);
}
.hero-header .header-actions{
  gap:10px;
}

@media(max-width:1150px){
  .approved-hero-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .approved-copy{
    max-width:900px;
    text-align:center;
    margin:0 auto;
    padding:0 20px;
  }
  .approved-copy > p{
    margin-inline:auto;
  }
  .approved-actions{
    justify-content:center;
  }
  .approved-visual{
    min-height:420px;
    max-width:760px;
    width:100%;
    margin:0 auto;
  }
  .approved-hero-ar .approved-copy{
    text-align:center;
    padding:0 20px;
  }
  .approved-hero-ar .approved-copy h1 span{
    text-align:center;
  }
  .approved-hero-ar .approved-actions{
    justify-content:center;
  }
}
@media(max-width:860px){
  .approved-stats{
    grid-template-columns:1fr;
    padding:0;
  }
  .approved-visual{
    transform:scale(.92);
    transform-origin:center top;
    margin-bottom:-20px;
  }
}
@media(max-width:620px){
  .approved-hero{
    width:min(100% - 24px,1480px);
    padding-top:44px;
  }
  .approved-copy h1{
    font-size:clamp(48px,13vw,66px);
  }
  .approved-hero-ar .approved-copy h1{
    font-size:clamp(49px,13vw,66px);
  }
  .approved-copy > p{
    font-size:17px;
  }
  .approved-actions{
    flex-direction:column;
  }
  .approved-actions .btn{
    width:100%;
  }
  .approved-visual{
    min-height:360px;
    transform:scale(.78);
    width:128%;
    margin-left:-14%;
    margin-bottom:-60px;
  }
  .price-card-mini{right:2%}
  .growth-card-mini{right:2%}
  .compare-card-mini{left:2%}
  .approved-stats article{
    min-height:150px;
  }
  .stat-top strong{
    font-size:54px;
  }
}


/* ============================================================
   V9 — HERO AI SEARCH BAR + TYPING EFFECT
   ============================================================ */

.hero-search-module{
  margin-top:28px;
  max-width:680px;
}

.hero-search-shell{
  min-height:82px;
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 16px 0 18px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(124,92,228,.12);
  box-shadow:0 18px 42px rgba(65,49,112,.10);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.hero-search-dot{
  width:14px;
  height:14px;
  flex:0 0 14px;
  border-radius:50%;
  background:linear-gradient(135deg,#ef5d73 0%,#7c5ce4 100%);
  box-shadow:0 0 0 8px rgba(124,92,228,.07);
}

.hero-search-text{
  flex:1 1 auto;
  min-height:30px;
  display:flex;
  align-items:center;
  color:var(--ink);
  font-size:clamp(18px,1.5vw,30px);
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.hero-search-caret{
  width:2px;
  height:24px;
  border-radius:99px;
  background:rgba(124,92,228,.75);
  animation:heroCaretBlink 1s steps(1,end) infinite;
}

.hero-search-send{
  width:52px;
  height:52px;
  flex:0 0 52px;
  border:none;
  border-radius:50%;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,#141320 0%,#30283f 100%);
  box-shadow:0 12px 24px rgba(20,19,32,.16);
  font-size:20px;
}

.hero-prompt-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}

.hero-prompt-chips button{
  appearance:none;
  border:none;
  cursor:pointer;
  padding:12px 16px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(20,19,32,.08);
  color:#665f72;
  font-size:14px;
  box-shadow:0 8px 18px rgba(20,19,32,.035);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, color .2s ease;
}

.hero-prompt-chips button:hover{
  transform:translateY(-2px);
  border-color:rgba(124,92,228,.28);
  color:var(--brand-deep);
  box-shadow:0 12px 24px rgba(91,63,196,.09);
}

@keyframes heroCaretBlink{
  0%,49%{opacity:1}
  50%,100%{opacity:0}
}

/* Arabic home search alignment */
.approved-hero-ar .hero-search-module{
  margin-left:auto;
}

.approved-hero-ar .hero-search-shell{
  direction:rtl;
}

.approved-hero-ar .hero-search-text{
  text-align:right;
}

.approved-hero-ar .hero-prompt-chips{
  justify-content:flex-start;
}

.approved-hero-ar .hero-search-send{
  transform:scaleX(-1);
}

@media(max-width:1150px){
  .hero-search-module{
    max-width:760px;
    margin-inline:auto;
  }
  .hero-search-shell{
    min-height:76px;
  }
  .hero-prompt-chips{
    justify-content:center;
  }
  .approved-hero-ar .hero-prompt-chips{
    justify-content:center;
  }
}

@media(max-width:620px){
  .hero-search-shell{
    min-height:68px;
    gap:12px;
    padding:0 12px 0 14px;
  }
  .hero-search-send{
    width:44px;
    height:44px;
    flex-basis:44px;
    font-size:18px;
  }
  .hero-search-text{
    font-size:16px;
  }
  .hero-prompt-chips button{
    padding:10px 12px;
    font-size:13px;
  }
}


/* ============================================================
   V10 — PROBLEM HOVER INTERACTION
   ============================================================ */

.problem-panel{
  --focus-transition: .38s cubic-bezier(.2,.8,.2,1);
}
.problem-panel .problem-side{
  border-radius:22px;
  transition:
    opacity var(--focus-transition),
    filter var(--focus-transition),
    background var(--focus-transition),
    transform var(--focus-transition);
}
.problem-panel .problem-side.left,
.problem-panel .problem-side.right{
  padding:26px;
}
.problem-panel .dot-cloud span,
.problem-panel .dot-row span,
.problem-panel .problem-side small{
  transition:
    background var(--focus-transition),
    color var(--focus-transition),
    opacity var(--focus-transition),
    box-shadow var(--focus-transition),
    transform var(--focus-transition);
}

/* Left side active */
.problem-panel[data-active="left"] .problem-side.left{
  background:
    radial-gradient(circle at 35% 50%, rgba(124,92,228,.13), transparent 46%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(247,243,255,.92));
  transform:translateY(-2px);
}
.problem-panel[data-active="left"] .problem-side.right{
  opacity:.30;
  filter:grayscale(.85);
}
.problem-panel[data-active="left"] .problem-side.left small{
  color:var(--brand-deep);
}
.problem-panel[data-active="left"] .dot-cloud span{
  opacity:1;
  box-shadow:0 0 0 7px rgba(124,92,228,.06);
}
.problem-panel[data-active="left"] .dot-cloud span:nth-child(3n+1){background:#7C5CE4}
.problem-panel[data-active="left"] .dot-cloud span:nth-child(3n+2){background:#B99CFF}
.problem-panel[data-active="left"] .dot-cloud span:nth-child(3n){background:#EF7897}

/* Right side active */
.problem-panel[data-active="right"] .problem-side.right{
  background:
    radial-gradient(circle at 58% 46%, rgba(239,120,151,.11), transparent 44%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(249,245,255,.92));
  transform:translateY(-2px);
}
.problem-panel[data-active="right"] .problem-side.left{
  opacity:.28;
  filter:grayscale(.9);
}
.problem-panel[data-active="right"] .problem-side.right small{
  color:var(--brand-deep);
}
.problem-panel[data-active="right"] .accent-row span{
  background:linear-gradient(135deg,#EF6F91,#7C5CE4);
  box-shadow:0 0 0 7px rgba(239,111,145,.07);
}
.problem-panel[data-active="right"] .dark-row span{
  background:#7C5CE4;
  box-shadow:0 0 0 7px rgba(124,92,228,.06);
}
.problem-panel[data-active="right"] .problem-side.right .accent{
  color:#EF5D7B;
}

@media (hover:none){
  .problem-panel[data-active] .problem-side{
    opacity:1;
    filter:none;
  }
}

/* ============================================================
   V10 — REFERENCE-STYLE PRICING WITH SPOONINDEX COLORS
   ============================================================ */

.reference-pricing-shell{
  width:min(1120px, calc(100% - 40px));
  margin:0 auto;
  padding:74px 0 80px;
}
.reference-pricing-head{
  text-align:center;
  max-width:760px;
  margin:0 auto;
}
.reference-pricing-head h1{
  margin:18px 0 14px;
  font-family:"DM Sans",system-ui,sans-serif;
  font-size:clamp(42px,4.5vw,62px);
  line-height:1.02;
  letter-spacing:-.045em;
}
.reference-pricing-head p{
  margin:0 auto;
  max-width:700px;
  color:var(--muted);
  font-size:17px;
  line-height:1.65;
}
.audience-toggle{
  width:max-content;
  margin:42px auto 20px;
  display:flex;
  gap:3px;
  padding:4px;
  border-radius:999px;
  background:#F1EFF4;
  border:1px solid rgba(20,19,32,.06);
}
.audience-tab{
  min-width:118px;
  height:43px;
  padding:0 20px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#77717F;
  font:inherit;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,box-shadow .2s ease;
}
.audience-tab.active{
  background:#fff;
  color:var(--ink);
  box-shadow:0 2px 8px rgba(20,19,32,.08);
}
.audience-panel{display:none}
.audience-panel.active{display:block}

.reference-plan-grid{
  display:grid;
  gap:18px;
  margin:0 auto;
}
.reference-plan-grid.two-plans{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:840px;
}
.reference-plan-card{
  min-height:560px;
  padding:28px 28px 24px;
  display:flex;
  flex-direction:column;
  border-radius:22px;
  border:1px solid rgba(20,19,32,.08);
  background:#fff;
  box-shadow:0 18px 42px rgba(20,19,32,.035);
}
.pro-reference{
  border-color:rgba(124,92,228,.18);
  box-shadow:0 22px 50px rgba(91,63,196,.07);
}
.reference-plan-title{
  min-height:86px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}
.reference-plan-title h2{
  margin:0 0 7px;
  font-size:27px;
  letter-spacing:-.035em;
}
.reference-plan-title p{
  margin:0;
  max-width:330px;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}
.plan-symbol{
  color:var(--brand);
  font-size:.70em;
}
.annual-control{
  display:flex;
  align-items:center;
  gap:8px;
  color:#746E7C;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  user-select:none;
}
.annual-control input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.annual-control i{
  width:38px;
  height:22px;
  border-radius:999px;
  background:#77747A;
  position:relative;
  transition:background .2s ease;
}
.annual-control i::after{
  content:"";
  width:16px;
  height:16px;
  position:absolute;
  top:3px;
  left:3px;
  border-radius:50%;
  background:#fff;
  transition:transform .2s ease;
  box-shadow:0 1px 4px rgba(20,19,32,.15);
}
.annual-control input:checked + i{
  background:var(--brand);
}
.annual-control input:checked + i::after{
  transform:translateX(16px);
}
.reference-price-row{
  min-height:110px;
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  padding:22px 0 14px;
}
.currency-label{
  font-size:13px;
  color:#7A7480;
  font-weight:700;
}
.reference-price-value{
  font-size:44px;
  line-height:1;
  letter-spacing:-.045em;
}
.reference-price-period{
  color:#8A8490;
  font-size:13px;
}
.reference-saving{
  margin-left:auto;
  padding:6px 9px;
  border-radius:999px;
  background:#F1ECFD;
  color:var(--brand-deep);
  font-size:11px;
  font-weight:700;
  opacity:0;
  transform:translateY(3px);
  transition:opacity .2s ease,transform .2s ease;
}
.reference-plan-card.annual-active .reference-saving{
  opacity:1;
  transform:translateY(0);
}
.feature-caption{
  margin:8px 0 16px;
  color:#8A8490;
  font-size:13px;
}
.reference-feature-list{
  list-style:none;
  padding:0;
  margin:0 0 26px;
  display:grid;
  gap:14px;
  color:#37323E;
  font-size:14px;
}
.reference-feature-list li{
  position:relative;
  padding-left:26px;
  line-height:1.45;
}
.reference-feature-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:-1px;
  color:var(--brand-deep);
  font-weight:800;
}
.reference-plan-cta{
  margin-top:auto;
  min-height:52px;
  padding:0 22px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  background:linear-gradient(135deg,#8568E8,#6D4FE0);
  color:#fff;
  font-weight:800;
  font-size:14px;
  box-shadow:0 12px 28px rgba(91,63,196,.16);
  transition:transform .2s ease,box-shadow .2s ease;
}
.reference-plan-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 17px 34px rgba(91,63,196,.23);
}
.pro-cta{
  background:linear-gradient(135deg,#7C5CE4,#5B3FC4);
}
.enterprise-reference-wrap{
  max-width:620px;
  margin:0 auto;
}
.enterprise-reference{
  min-height:520px;
}
.enterprise-custom-price{
  padding:28px 0 26px;
  font-size:50px;
  font-weight:800;
  letter-spacing:-.04em;
}
.enterprise-features{
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:24px;
}
.reference-pricing-note{
  margin:20px auto 0;
  max-width:720px;
  color:#98919F;
  text-align:center;
  font-size:12px;
  line-height:1.5;
}

/* Arabic pricing */
.reference-pricing-ar{
  direction:rtl;
}
.reference-pricing-ar .reference-pricing-head h1{
  font-family:"IBM Plex Sans Arabic","Noto Naskh Arabic",Tahoma,sans-serif;
  letter-spacing:0;
  line-height:1.18;
}
.reference-pricing-ar .reference-plan-title,
.reference-pricing-ar .reference-price-row{
  direction:rtl;
}
.reference-pricing-ar .reference-plan-title p{
  line-height:1.75;
}
.reference-pricing-ar .annual-control input:checked + i::after{
  transform:translateX(-16px);
}
.reference-pricing-ar .annual-control i::after{
  left:auto;
  right:3px;
}
.reference-pricing-ar .reference-feature-list li{
  padding-left:0;
  padding-right:26px;
  line-height:1.75;
}
.reference-pricing-ar .reference-feature-list li::before{
  left:auto;
  right:0;
}
.reference-pricing-ar .reference-saving{
  margin-left:0;
  margin-right:auto;
}

/* Homepage pricing preview */
.home-reference-plan-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.home-plan-mini{
  min-height:250px;
  padding:26px;
  border-radius:22px;
  border:1px solid rgba(20,19,32,.08);
  background:#fff;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.home-plan-mini:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 40px rgba(20,19,32,.06);
  border-color:rgba(124,92,228,.18);
}
.home-plan-mini.featured-mini{
  background:linear-gradient(180deg,#fff,#F8F5FF);
}
.home-plan-mini small{
  color:var(--brand-deep);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}
.home-plan-mini h3{
  margin:9px 0 8px;
  font-size:30px;
}
.home-plan-mini p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}
.mini-plan-link{
  margin-top:26px;
  min-height:48px;
  border-radius:999px;
  background:var(--brand);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:13px;
  font-weight:800;
}

@media(max-width:820px){
  .reference-plan-grid.two-plans,
  .home-reference-plan-row{
    grid-template-columns:1fr;
  }
  .enterprise-features{
    grid-template-columns:1fr;
  }
}


/* ============================================================
   V11 — EMERGENT-LIKE TYPE SYSTEM (INTER) ACROSS ALL PAGES
   ============================================================ */

html,
body,
button,
input,
textarea,
select,
a,
p,
span,
small,
strong,
label,
li,
div {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

h1,h2,h3,h4,h5,h6,
.serif-heading,
.approved-copy h1,
.approved-copy h1 span,
.subpage-hero-copy h1,
.process-head h2,
.principle-panel h2,
.source-identity-panel h2,
.permission-banner h2,
.subpage-cta h2,
.featured-copy h2,
.blog-paper strong,
.stat-top strong,
.snapshot-strip strong,
.terms-sheet.t3 span {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: -0.035em;
}

html[dir="rtl"] body,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] a,
html[dir="rtl"] p,
html[dir="rtl"] span,
html[dir="rtl"] small,
html[dir="rtl"] strong,
html[dir="rtl"] label,
html[dir="rtl"] li,
html[dir="rtl"] div,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] .serif-heading {
  font-family: "Noto Sans Arabic", "Inter", Tahoma, sans-serif !important;
  letter-spacing: 0;
}

/* ============================================================
   V11 — FULL PRICING ON HOMEPAGE + PRICING PAGE
   ============================================================ */

.full-pricing-module {
  width: min(1220px, calc(100% - 40px));
  padding: 92px 0 88px;
}

.homepage-full-pricing {
  margin-top: 40px;
  border-top: 1px solid rgba(20,19,32,.06);
}

.reference-pricing-head h1,
.reference-pricing-head h2 {
  margin: 18px 0 14px;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(42px, 4vw, 58px);
  font-weight: 650;
  line-height: 1.04;
  letter-spacing: -0.045em;
}

.reference-pricing-head p {
  max-width: 710px;
  font-size: 16px;
}

.audience-toggle {
  margin-top: 38px;
  background: #f1eff3;
  border-color: rgba(20,19,32,.055);
}

.reference-plan-grid.individual-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 1180px;
  gap: 18px;
}

.reference-plan-grid.enterprise-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 820px;
  gap: 18px;
  margin: 0 auto;
}

.reference-plan-card {
  min-height: 590px;
  border-radius: 18px;
  padding: 28px 28px 24px;
  box-shadow: 0 14px 36px rgba(20,19,32,.032);
}

.reference-plan-title {
  min-height: 105px;
}

.reference-plan-title h3 {
  margin: 0 0 8px;
  font-size: 27px;
  font-weight: 650;
  letter-spacing: -0.04em;
}

.reference-plan-title p {
  font-size: 13.5px;
  line-height: 1.55;
}

.reference-price-row {
  min-height: 114px;
  align-items: baseline;
  padding: 20px 0 17px;
}

.currency-symbol {
  font-size: 36px;
  line-height: 1;
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -0.035em;
}

.reference-price-value {
  font-size: 39px;
  font-weight: 700;
}

.reference-price-period {
  font-size: 13px;
  color: #8a8490;
}

.reference-saving {
  margin-left: auto;
  opacity: 0;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  background: #eee8ff;
  color: #5b3fc4;
  font-size: 11px;
  font-weight: 700;
  transform: none;
}

.reference-plan-card.annual-active .reference-saving {
  opacity: 1;
}

.free-reference .reference-plan-title {
  padding-right: 72px;
}

.free-reference .reference-price-row {
  padding-top: 14px;
}

.reference-feature-list {
  gap: 13px;
  font-size: 13.5px;
}

.reference-feature-list li::before {
  color: #141320;
  font-weight: 700;
}

.pro-reference {
  border-color: rgba(124,92,228,.20);
  box-shadow: 0 18px 42px rgba(91,63,196,.055);
}

.reference-plan-cta {
  min-height: 50px;
  border-radius: 999px;
  background: linear-gradient(135deg, #8062e6, #6847d4);
  font-size: 13px;
}

.reference-plan-cta:hover {
  transform: translateY(-2px);
}

.enterprise-reference {
  min-height: 560px;
}

.enterprise-custom-price {
  padding: 20px 0 34px;
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -0.045em;
}

.annual-control {
  padding-top: 2px;
}

.annual-control i {
  width: 39px;
  height: 23px;
}

.annual-control i::after {
  width: 17px;
  height: 17px;
}

.annual-control input:checked + i::after {
  transform: translateX(16px);
}

/* Arabic pricing keeps $ values visually clean */
.reference-pricing-ar .reference-price-row {
  direction: rtl;
}

.reference-pricing-ar .currency-symbol,
.reference-pricing-ar .reference-price-value,
.reference-pricing-ar .reference-price-period,
.reference-pricing-ar .reference-saving {
  direction: ltr;
  unicode-bidi: isolate;
}

.reference-pricing-ar .reference-saving {
  margin-left: 0;
  margin-right: auto;
}

.reference-pricing-ar .reference-plan-title h3,
.reference-pricing-ar .reference-pricing-head h1,
.reference-pricing-ar .reference-pricing-head h2 {
  font-family: "Noto Sans Arabic", "Inter", Tahoma, sans-serif !important;
}

@media (max-width: 1040px) {
  .reference-plan-grid.individual-three {
    grid-template-columns: 1fr 1fr;
  }
  .free-reference {
    grid-column: 1 / -1;
    max-width: 580px;
    width: 100%;
    justify-self: center;
  }
}

@media (max-width: 760px) {
  .reference-plan-grid.individual-three,
  .reference-plan-grid.enterprise-two {
    grid-template-columns: 1fr;
  }
  .free-reference {
    grid-column: auto;
    max-width: none;
  }
  .reference-plan-card {
    min-height: auto;
  }
}


/* ============================================================
   V12 — CLEANER PROOF STATS + ARABIC FEATURE LAYOUT
   ============================================================ */

/* Remove duplicated feel by using only one animated stats section */
.proof-section .stats-grid {
  max-width: 1280px;
  gap: 22px;
  margin: 0 auto 56px;
}

.icon-stat-card {
  padding: 34px 34px 30px;
  border-radius: 32px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 18px 44px rgba(20,19,32,.035);
}

.icon-stat-card .stat-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 26px;
}

.icon-stat-card .stat-number-row {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
}

.icon-stat-card .stat-number-row strong,
.icon-stat-card .stat-number-row .count-suffix {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(68px, 7vw, 96px);
  line-height: .92;
  font-weight: 700;
  letter-spacing: -0.075em;
  color: #111022;
}

.icon-stat-card .stat-icon {
  width: 74px;
  height: 74px;
  border-radius: 999px;
  flex: 0 0 74px;
  display: grid;
  place-items: center;
  background: #efe9ff;
  color: #7256df;
  font-size: 30px;
}

.icon-stat-card p {
  margin: 0;
  color: #5d586d;
  font-size: 18px;
  line-height: 1.45;
  max-width: 26ch;
}

html[dir="rtl"] .icon-stat-card p {
  max-width: none;
}

html[dir="rtl"] .icon-stat-card .stat-top {
  flex-direction: row;
}

html[dir="rtl"] .icon-stat-card .stat-number-row {
  direction: ltr;
}

@media (max-width: 980px) {
  .proof-section .stats-grid {
    grid-template-columns: 1fr;
    max-width: 760px;
  }

  .icon-stat-card .stat-number-row strong,
  .icon-stat-card .stat-number-row .count-suffix {
    font-size: clamp(56px, 11vw, 84px);
  }
}

/* Arabic feature layout: match the requested image-3 arrangement */
@media (min-width: 1021px) {
  html[dir="rtl"] .feature-grid-ar-alt {
    grid-template-columns: 1.05fr 1.05fr 0.95fr;
    grid-template-areas:
      "dark dark tall"
      "reports coverage tall"
      ". . automation";
    align-items: start;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .area-dark {
    grid-area: dark;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .area-tall {
    grid-area: tall;
    grid-row: auto;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .area-reports {
    grid-area: reports;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .area-coverage {
    grid-area: coverage;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .area-automation {
    grid-area: automation;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .feature-card {
    min-height: 0;
  }

  html[dir="rtl"] .feature-grid-ar-alt > .area-automation .card-visual,
  html[dir="rtl"] .feature-grid-ar-alt > .area-reports .card-visual,
  html[dir="rtl"] .feature-grid-ar-alt > .area-coverage .card-visual {
    min-height: 180px;
  }
}


/* ============================================================
   V13 — COMPACT FEATURES GRID MATCHING APPROVED REFERENCE
   ============================================================ */

.feature-grid-section {
  padding-bottom: 96px;
}

.compact-feature-grid {
  direction: ltr;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    "dark dark adaptive"
    "reports coverage automation";
  gap: 18px;
  align-items: stretch;
  max-width: 1260px;
  margin-inline: auto;
}

.compact-feature-grid > .feature-card {
  min-height: 0;
  height: 100%;
  margin: 0;
  overflow: hidden;
}

.compact-area-dark {
  grid-area: dark;
  min-height: 360px !important;
}

.compact-area-adaptive {
  grid-area: adaptive;
  min-height: 360px !important;
}

.compact-area-reports {
  grid-area: reports;
  min-height: 350px !important;
}

.compact-area-coverage {
  grid-area: coverage;
  min-height: 350px !important;
}

.compact-area-automation {
  grid-area: automation;
  min-height: 350px !important;
}

/* The top two cards must align as one clean row. */
.compact-area-dark.dark-card {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  align-items: stretch;
  padding: 18px;
}

.compact-area-dark .dark-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 34px 28px;
}

.compact-area-dark .mock-window {
  min-height: 320px;
  align-self: stretch;
  margin: 0;
}

.compact-area-adaptive {
  padding: 16px;
}

.compact-area-adaptive .card-visual {
  min-height: 225px;
  margin-bottom: 18px;
}

.compact-area-reports .card-visual,
.compact-area-coverage .card-visual,
.compact-area-automation .card-visual {
  min-height: 205px;
  margin-bottom: 18px;
}

/* Keep the bottom row visually aligned. */
.compact-area-reports,
.compact-area-coverage,
.compact-area-automation {
  display: flex;
  flex-direction: column;
}

.compact-area-reports > p,
.compact-area-coverage > p,
.compact-area-automation > p {
  margin-bottom: 0;
}

/* Arabic uses the same physical card arrangement as the approved mockup:
   large black card on the LEFT, adaptive card on the RIGHT. */
html[dir="rtl"] .compact-feature-grid-ar {
  direction: ltr;
}

html[dir="rtl"] .compact-feature-grid-ar > .feature-card {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark {
  direction: ltr;
  grid-template-columns: 1.15fr 1fr;
}

html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .mock-window {
  grid-column: 1;
  direction: rtl;
}

html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .dark-copy {
  grid-column: 2;
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .compact-feature-grid-ar .compact-area-adaptive,
html[dir="rtl"] .compact-feature-grid-ar .compact-area-reports,
html[dir="rtl"] .compact-feature-grid-ar .compact-area-coverage,
html[dir="rtl"] .compact-feature-grid-ar .compact-area-automation {
  direction: rtl;
}

/* Remove the old V12 Arabic grid override. */
html[dir="rtl"] .feature-grid-ar-alt {
  display: grid;
}

/* Tablet */
@media (max-width: 1020px) {
  .compact-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "dark dark"
      "adaptive reports"
      "coverage automation";
  }

  .compact-area-dark {
    min-height: 350px !important;
  }
}

/* Mobile */
@media (max-width: 700px) {
  .compact-feature-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "dark"
      "adaptive"
      "reports"
      "coverage"
      "automation";
    gap: 14px;
  }

  .compact-area-dark.dark-card,
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark {
    grid-template-columns: 1fr;
    min-height: 0 !important;
  }

  .compact-area-dark .dark-copy,
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .dark-copy {
    grid-column: 1;
    grid-row: 1;
    padding: 26px 22px 18px;
  }

  .compact-area-dark .mock-window,
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .mock-window {
    grid-column: 1;
    grid-row: 2;
    min-height: 270px;
  }

  .compact-area-adaptive,
  .compact-area-reports,
  .compact-area-coverage,
  .compact-area-automation {
    min-height: 0 !important;
  }
}


.testimonial-stack[data-drag-ready="1"] .stack-card[data-stack-position="0"] { animation:stackFloatA 6s ease-in-out infinite; }
.testimonial-stack[data-drag-ready="1"] .stack-card[data-stack-position="1"] { animation:stackFloatB 6.6s ease-in-out infinite; }
.testimonial-stack[data-drag-ready="1"] .stack-card[data-stack-position="2"] { animation:stackFloatC 7.1s ease-in-out infinite; }

html[dir="rtl"] .testimonial-stack { direction:rtl; }
html[dir="rtl"] .quote-person { flex-direction:row-reverse; }
html[dir="rtl"] .quote-person div { text-align:right; }
html[dir="rtl"] .testimonial-card p, html[dir="rtl"] .quote-brand { text-align:right; }


/* ============================================================
   V15 — AI PROVIDERS / MODELS INTEGRATION ORBIT
   ============================================================ */

.integration-orbit {
  min-height: 390px;
  max-width: 1120px;
  margin: 20px auto 0;
}

.integration-chip {
  width: 142px;
  height: 70px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  border-radius: 19px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(20,19,32,.065);
  box-shadow: 0 16px 34px rgba(20,19,32,.07);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  animation: modelChipFloat 6s ease-in-out infinite;
}

.integration-chip .model-chip-icon {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-size: 11px;
  color: #fff;
}

.integration-chip .model-chip-label {
  font-size: 14px;
  font-weight: 650;
  color: #2d2934;
}

.model-claude { background: linear-gradient(135deg,#E89B71,#C86C42); }
.model-openai { background: linear-gradient(135deg,#151515,#525252); }
.model-google { background: linear-gradient(135deg,#4285F4,#34A853); }
.model-gemini { background: linear-gradient(135deg,#4B77FF,#B16CFF); }
.model-fable { background: linear-gradient(135deg,#9B57F5,#6E4ADF); }
.model-sol { background: linear-gradient(135deg,#FF7B7B,#FFB347); }
.model-luna { background: linear-gradient(135deg,#8B6CF4,#6548CC); }
.model-sonnet { background: linear-gradient(135deg,#7C5CE4,#B15CFF); }

.integration-side-label {
  position: absolute;
  top: 5%;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
  color: #9B95A2;
}
.integration-side-label.left { left: 13%; }
.integration-side-label.right { right: 15%; }

/* Left: Claude / OpenAI / Google AI / Gemini */
.integration-orbit .i1 { left: 4%; top: 14%; animation-delay:-.2s; }
.integration-orbit .i2 { left: 4%; top: 35%; animation-delay:-1.3s; }
.integration-orbit .i3 { left: 4%; top: 56%; animation-delay:-2.4s; }
.integration-orbit .i4 { left: 4%; top: 77%; bottom:auto; animation-delay:-3.2s; }

/* Right: Fable / Sol / Luna / Sonnet */
.integration-orbit .i5 { right: 4%; top: 14%; animation-delay:-.8s; }
.integration-orbit .i6 { right: 4%; top: 35%; animation-delay:-1.8s; }
.integration-orbit .i7 { right: 4%; top: 56%; animation-delay:-2.8s; }
.integration-orbit .i8 { right: 4%; top: 77%; bottom:auto; animation-delay:-3.8s; }

.integration-core {
  position: relative;
  z-index: 3;
}

.integration-orbit::before,
.integration-orbit::after {
  content:"";
  position:absolute;
  top:50%;
  width:34%;
  height:1px;
  border-top:1px dashed rgba(124,92,228,.19);
  z-index:0;
}
.integration-orbit::before { left:17%; }
.integration-orbit::after { right:17%; }

@keyframes modelChipFloat {
  0%,100% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(0,-7px,0); }
}

/* ============================================================
   V15 — TESTIMONIALS: ONE STORY AT A TIME
   ============================================================ */

.testimonial-stack {
  isolation: isolate;
}

.testimonial-stack .stack-card {
  background: #fff !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 0;
}

.testimonial-stack .stack-card.is-top {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 30;
}

/* While the top card is actually being moved, reveal the next card below it. */
.testimonial-stack.is-peeking .stack-card.is-next {
  opacity: 1;
  visibility: visible;
  pointer-events: none;
  z-index: 20;
  transform: translate3d(0,18px,0) scale(.97) rotate(-.7deg);
}

/* Fake stack edges without exposing another testimonial's content. */
.testimonial-stack .stack-card.is-top::before,
.testimonial-stack .stack-card.is-top::after {
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  height:18px;
  background:#fff;
  border-radius:0 0 18px 18px;
  z-index:-1;
  box-shadow:0 8px 18px rgba(20,19,32,.05);
}
.testimonial-stack .stack-card.is-top::before { bottom:-12px; }
.testimonial-stack .stack-card.is-top::after {
  left:28px;
  right:28px;
  bottom:-24px;
  opacity:.94;
}

.testimonial-stack .stack-card:not(.is-top)::before,
.testimonial-stack .stack-card:not(.is-top)::after {
  display:none;
}

.testimonial-card,
.stack-card {
  background-color:#fff !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

.testimonial-card p,
.quote-brand,
.quote-person,
.quote-person strong,
.quote-person small {
  opacity:1 !important;
}

/* Disable the old float transforms for hidden story cards; only the visible top card floats. */
.testimonial-stack[data-drag-ready="1"] .stack-card[data-stack-position="0"] {
  animation: stackFloatA 6s ease-in-out infinite;
}
.testimonial-stack[data-drag-ready="1"] .stack-card[data-stack-position="1"],
.testimonial-stack[data-drag-ready="1"] .stack-card[data-stack-position="2"] {
  animation: none !important;
}

@media (max-width: 820px) {
  .integration-orbit {
    min-height: 650px;
  }
  .integration-core {
    width: 170px;
    height: 170px;
    font-size: 24px;
  }
  .integration-chip {
    width: 130px;
    height: 62px;
  }
  .integration-side-label {
    display:none;
  }
  .integration-orbit .i1,
  .integration-orbit .i2,
  .integration-orbit .i3,
  .integration-orbit .i4 { left: 3%; }
  .integration-orbit .i5,
  .integration-orbit .i6,
  .integration-orbit .i7,
  .integration-orbit .i8 { right: 3%; }
}


/* ============================================================
   V16 — RECOGNIZABLE AI LOGOS + CONNECTING LINES
   ============================================================ */
.model-chip-icon {
  background: transparent !important;
  color: inherit !important;
  border-radius: 0 !important;
  overflow: visible;
}
.model-chip-icon svg {
  width: 28px;
  height: 28px;
  display: block;
}
.model-claude { color:#D97745 !important; }
.model-openai { color:#111 !important; }
.model-fable { color:#8E4CF0 !important; }
.model-sol { color:#FF6D73 !important; }
.model-luna { color:#8A65EA !important; }
.model-sonnet { color:#7C4DFF !important; }
.model-connection-lines {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
  overflow:visible;
}
.model-connection-lines path {
  fill:none;
  stroke:rgba(124,92,228,.23);
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-dasharray:3 5;
  animation:modelDashFlow 12s linear infinite;
}
.model-connection-lines path:nth-child(even) { animation-duration:15s; animation-direction:reverse; }
@keyframes modelDashFlow { to { stroke-dashoffset:-48; } }
.integration-chip { z-index:2; }
.integration-core { z-index:3; }

/* ============================================================
   V16 — TESTIMONIAL DRAG: ONLY THE ACTIVE CARD MOVES
   ============================================================ */
.testimonial-stack .stack-card {
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:none !important;
  animation:none !important;
}
.testimonial-stack .stack-card.is-top {
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translate3d(0,0,0) rotate(0deg) !important;
  animation:stackFloatA 6s ease-in-out infinite !important;
}
.testimonial-stack .stack-card.is-top.is-dragging {
  animation:none !important;
  transition:none !important;
}
/* Purely decorative layers; these are not testimonial cards. */
.testimonial-stack::before,
.testimonial-stack::after {
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  height:100%;
  border-radius:24px;
  background:#fff;
  pointer-events:none;
  z-index:4;
  box-shadow:0 14px 30px rgba(20,19,32,.05);
}
.testimonial-stack::before { top:14px; }
.testimonial-stack::after { top:27px; left:34px; right:34px; opacity:.96; }
.testimonial-stack .stack-card.is-top { z-index:10 !important; }
.testimonial-stack .stack-card.is-top::before,
.testimonial-stack .stack-card.is-top::after { display:none !important; }


/* ============================================================
   V17 — USER-SUPPLIED PROVIDER/MODEL ICONS
   ============================================================ */
.model-logo-img {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  object-fit: contain;
  object-position: center;
  display: block;
}
.integration-chip {
  width: 168px;
  height: 78px;
  gap: 14px;
  padding-inline: 18px;
}
.integration-chip .model-chip-label {
  font-size: 15px;
  font-weight: 700;
}
.model-connection-lines {
  opacity: .72;
  pointer-events: none;
}
.model-connection-lines path {
  stroke: rgba(124,92,228,.38);
  stroke-width: 1.45;
  stroke-dasharray: 4 6;
  fill: none;
  animation: connectorDash 13s linear infinite;
}
@keyframes connectorDash { to { stroke-dashoffset: -90; } }

/* ============================================================
   V17 — REACTIVE TESTIMONIAL STACK
   Only the top follows the cursor. The next cards respond with
   smaller, opposite/parallax motion and their text is revealed.
   ============================================================ */
.testimonial-stack .stack-card {
  background: #fff !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform-origin: 50% 65%;
  will-change: transform, opacity;
}
.testimonial-stack .stack-card.is-top {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 30;
}
.testimonial-stack.is-drag-active .stack-card.is-next,
.testimonial-stack.is-drag-active .stack-card.is-third {
  visibility: visible;
  pointer-events: none;
}
.testimonial-stack.is-drag-active .stack-card.is-next {
  opacity: var(--next-opacity, .92);
  z-index: 20;
}
.testimonial-stack.is-drag-active .stack-card.is-third {
  opacity: var(--third-opacity, .45);
  z-index: 10;
}
/* Hide old fake paper edges while real reactive cards are visible. */
.testimonial-stack.is-drag-active .stack-card.is-top::before,
.testimonial-stack.is-drag-active .stack-card.is-top::after { opacity: 0; }
.testimonial-stack .stack-card.is-next::before,
.testimonial-stack .stack-card.is-next::after,
.testimonial-stack .stack-card.is-third::before,
.testimonial-stack .stack-card.is-third::after { display:none !important; }

@media (max-width: 820px) {
  .model-logo-img { width: 36px; height: 36px; flex-basis: 36px; }
  .integration-chip { width: 148px; height: 68px; }
}


/* ============================================================
   V19 — RESTORED HOMEPAGE FOOTER + CORRECT SPOONINDEX BRAND LOCKUP
   ============================================================ */

.homepage-footer {
  width: min(1480px, calc(100% - 40px));
  margin: 0 auto;
  padding: 58px 8px 34px;
  border-top: 1px solid rgba(20,19,32,.08);
  display: grid;
  grid-template-columns: minmax(360px,1.15fr) minmax(520px,.85fr);
  gap: clamp(50px,7vw,110px);
  align-items: start;
}

.homepage-footer .footer-brand {
  min-width: 0;
}

.homepage-footer .footer-brand-link {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  text-decoration: none;
  color: var(--ink);
}

.homepage-footer .footer-logo-mark {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  object-fit: contain;
  display: block;
  filter: none;
}

.homepage-footer .footer-wordmark {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  line-height: 1;
}

.homepage-footer .footer-wordmark strong {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 23px;
  line-height: 1;
  font-weight: 760;
  letter-spacing: -.045em;
  color: #141320;
}

.homepage-footer .footer-wordmark strong span {
  color: #77717f;
  font-weight: 650;
}

.homepage-footer .footer-wordmark small {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 7px;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: .19em;
  color: #9b95a2;
  white-space: nowrap;
}

.homepage-footer .footer-brand p {
  max-width: 420px;
  margin: 24px 0 0;
  color: #77717f;
  font-size: 14px;
  line-height: 1.7;
}

.homepage-footer .footer-links {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 38px;
}

.homepage-footer .footer-links h4 {
  margin: 0 0 19px;
  color: #8c8794;
  font-size: 13px;
  font-weight: 700;
}

.homepage-footer .footer-links a {
  display: block;
  margin-bottom: 14px;
  color: #2f2b36;
  font-size: 13px;
  line-height: 1.45;
  text-decoration: none;
}

.homepage-footer .footer-links a:hover {
  color: var(--brand-deep);
}

/* Arabic footer keeps the SpoonIndex lockup on the right and links to the left. */
html[dir="rtl"] .homepage-footer-ar {
  direction: rtl;
  grid-template-columns: minmax(360px,1.15fr) minmax(520px,.85fr);
}

html[dir="rtl"] .homepage-footer-ar .footer-brand {
  text-align: right;
}

html[dir="rtl"] .homepage-footer-ar .footer-brand-link {
  direction: ltr;
}

html[dir="rtl"] .homepage-footer-ar .footer-wordmark {
  align-items: flex-start;
}

html[dir="rtl"] .homepage-footer-ar .footer-links {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .homepage-footer-ar .footer-brand p {
  margin-right: 0;
  margin-left: auto;
}

@media (max-width: 900px) {
  .homepage-footer,
  html[dir="rtl"] .homepage-footer-ar {
    grid-template-columns: 1fr;
    gap: 42px;
  }
  .homepage-footer .footer-links {
    max-width: 620px;
  }
}

@media (max-width: 620px) {
  .homepage-footer {
    width: min(100% - 28px,1480px);
    padding-top: 42px;
  }
  .homepage-footer .footer-links {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .homepage-footer .footer-links > div:last-child {
    grid-column: 1 / -1;
  }
  .homepage-footer .footer-logo-mark {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }
  .homepage-footer .footer-wordmark strong {
    font-size: 21px;
  }
}


/* ============================================================
   V20 — FAQ CLOSED BY DEFAULT
   ============================================================ */
.faq-item .faq-answer {
  display: none;
}
.faq-item.open .faq-answer {
  display: block;
}

/* ============================================================
   V20 — CENTERED INSIGHTS CTA / BLOG RENAMED TO INSIGHTS
   ============================================================ */
.insights-head-centered {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:22px;
  margin-bottom:38px;
}
.insights-head-centered h2 {
  max-width:760px;
  margin-inline:auto;
}
.insights-head-centered .btn {
  margin-inline:auto;
}

/* ============================================================
   V20 — SMALLER, BETTER-FITTING ABOUT NUMBERS
   ============================================================ */
.icon-stat-card {
  min-height: 250px;
  padding: 30px 30px 28px;
}
.icon-stat-card .stat-number-row strong,
.icon-stat-card .stat-number-row .count-suffix {
  font-size: clamp(52px, 5.2vw, 74px) !important;
  letter-spacing: -0.065em;
}
.icon-stat-card .stat-icon {
  width: 62px;
  height: 62px;
  flex-basis: 62px;
  font-size: 24px;
}
.icon-stat-card p {
  font-size: 17px;
  line-height: 1.45;
}

/* ============================================================
   V20 — FIX CONVERSATIONAL ANSWERS MINI CHAT
   ============================================================ */
.compact-area-dark .mini-chat {
  overflow:hidden;
  min-height:320px;
}
.compact-area-dark .mini-chat .bubble {
  max-width:72%;
  font-size:12.5px;
  line-height:1.38;
  padding:11px 13px;
  white-space:normal;
  overflow-wrap:anywhere;
}
.compact-area-dark .mini-chat .bubble-question-primary {
  top:22px !important;
  right:22px !important;
  left:auto !important;
  max-width:72%;
}
.compact-area-dark .mini-chat .bubble-ai {
  top:104px !important;
  left:22px !important;
  right:auto !important;
  max-width:72%;
}
.compact-area-dark .mini-chat .bubble-question-followup {
  top:196px !important;
  right:22px !important;
  left:auto !important;
  max-width:46%;
}
.compact-area-dark .mini-chat .mini-input {
  left:22px;
  right:22px;
  bottom:20px;
  height:52px;
  font-size:14px;
}
html[dir="rtl"] .compact-area-dark .mini-chat .bubble-question-primary {
  right:auto !important;
  left:22px !important;
  text-align:right;
}
html[dir="rtl"] .compact-area-dark .mini-chat .bubble-ai {
  left:auto !important;
  right:22px !important;
  text-align:right;
}
html[dir="rtl"] .compact-area-dark .mini-chat .bubble-question-followup {
  right:auto !important;
  left:22px !important;
  text-align:right;
}

/* ============================================================
   V20 — REAL TESTIMONIAL STACK
   All cards physically exist in the stack. Only the top one
   follows the pointer; lower cards react and their real text is
   naturally exposed as the top card moves away.
   ============================================================ */
.testimonial-stack {
  isolation:isolate;
  min-height:410px;
  overflow:visible;
}
.testimonial-stack::before,
.testimonial-stack::after {
  display:none !important;
}
.testimonial-stack .stack-card {
  opacity:1 !important;
  visibility:visible !important;
  background:#fff !important;
  pointer-events:none !important;
  animation:none !important;
  transform-origin:50% 70%;
  will-change:transform;
  transition:transform .34s cubic-bezier(.22,.75,.25,1), box-shadow .25s ease;
}
.testimonial-stack .stack-card.is-top {
  pointer-events:auto !important;
  z-index:30 !important;
  box-shadow:0 30px 66px rgba(20,19,32,.16);
}
.testimonial-stack .stack-card.is-next {
  z-index:20 !important;
  box-shadow:0 24px 52px rgba(20,19,32,.10);
}
.testimonial-stack .stack-card.is-third {
  z-index:10 !important;
  box-shadow:0 18px 40px rgba(20,19,32,.07);
}
.testimonial-stack .stack-card::before,
.testimonial-stack .stack-card::after {
  display:none !important;
}
.testimonial-stack .stack-card.is-dragging {
  transition:none !important;
  box-shadow:0 40px 90px rgba(20,19,32,.20);
}
.testimonial-stack .quote-brand,
.testimonial-stack .testimonial-card p,
.testimonial-stack .quote-person,
.testimonial-stack .quote-person strong,
.testimonial-stack .quote-person small {
  opacity:1 !important;
}

@media(max-width:700px){
  .testimonial-stack {
    min-height:470px;
  }
}

/* ============================================================
   V20 — INSIGHTS PAGE NAME
   ============================================================ */
.blog-page .pill-label {
  letter-spacing:.12em;
}


/* ============================================================
   V21 — HERO SEND BUTTON FIX
   Same violet treatment as the Sign In button.
   ============================================================ */
.hero-search-send {
  color:#fff !important;
  background:linear-gradient(135deg,#8568E8,#6D4FE0) !important;
  box-shadow:0 12px 35px rgba(91,63,196,.22) !important;
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.hero-search-send:hover {
  transform:translateY(-1px) scale(1.025);
  box-shadow:0 16px 40px rgba(91,63,196,.30) !important;
  filter:saturate(1.05);
}

/* Put the typing caret immediately before the text in the Arabic/RTL hero,
   rather than leaving it visually on the wrong side. */
.approved-hero-ar .hero-search-shell {
  direction:rtl;
}
.approved-hero-ar .hero-search-dot { order:1; }
.approved-hero-ar .hero-search-caret { order:2; }
.approved-hero-ar .hero-search-text { order:3; }
.approved-hero-ar .hero-search-send {
  order:4;
  transform:none !important;
}

/* English keeps natural text -> caret -> send order. */
.approved-hero:not(.approved-hero-ar) .hero-search-dot { order:1; }
.approved-hero:not(.approved-hero-ar) .hero-search-text { order:2; }
.approved-hero:not(.approved-hero-ar) .hero-search-caret { order:3; }
.approved-hero:not(.approved-hero-ar) .hero-search-send { order:4; }

/* ============================================================
   V21 — REAL SPOONINDEX PRODUCT SHOWCASE
   ============================================================ */
.real-product-showcase .dark-shell {
  border-radius:32px;
  padding:34px 34px 38px;
  background:
    radial-gradient(circle at 84% 12%, rgba(124,92,228,.09), transparent 28%),
    #050505;
  box-shadow:0 30px 72px rgba(20,19,32,.09);
}

.real-product-showcase .showcase-tab {
  min-height:58px;
  text-align:left;
  font-size:14px;
  transition:color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}
.real-product-showcase .showcase-tab:hover {
  color:#fff;
  transform:translateX(2px);
}
.real-product-showcase .showcase-tab.active {
  color:#fff;
  border:1px solid rgba(255,255,255,.78);
  border-radius:8px;
  padding-inline:14px;
  background:rgba(255,255,255,.025);
}
html[dir="rtl"] .real-product-showcase .showcase-tab {
  text-align:right;
}
html[dir="rtl"] .real-product-showcase .showcase-tab:hover {
  transform:translateX(-2px);
}

.real-product-showcase .showcase-title-row {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  align-items:end;
  gap:34px;
  margin:2px 0 26px;
}
.real-product-showcase .showcase-title-row h2 {
  margin:8px 0 0;
  max-width:760px;
  font-size:clamp(44px,5vw,68px);
  line-height:.98;
  letter-spacing:-.052em;
  font-weight:650;
}
.real-product-showcase .showcase-title-row > p {
  margin:0 0 4px;
  color:#c8c4d2;
  font-size:15px;
  line-height:1.62;
}

.showcase-kicker {
  color:#b7a5ff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}

.real-product-frame {
  padding:14px;
  border-radius:27px;
  overflow:hidden;
}
.real-product-frame .browser-top {
  min-height:32px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 4px 8px;
}
.real-product-frame .browser-top span {
  width:7px;
  height:7px;
  border-radius:50%;
  background:rgba(255,255,255,.72);
}
.real-product-frame .browser-top small {
  margin-left:auto;
  margin-right:8px;
  color:rgba(255,255,255,.76);
  font-size:10px;
}
html[dir="rtl"] .real-product-frame .browser-top small {
  margin-left:8px;
  margin-right:auto;
}

.product-shot-window {
  width:100%;
  border-radius:19px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.13);
}
.product-shot-window img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.product-shot-ai { aspect-ratio:16/8.7; }
.product-shot-menu { aspect-ratio:16/8.8; }
.product-shot-analytics { aspect-ratio:16/8.4; }

.product-shot-ai img {
  object-position:72% center;
}
.product-shot-menu img {
  object-position:center center;
}
.product-shot-analytics img {
  object-position:center 18%;
}

.real-product-showcase .showcase-bottom {
  margin-top:24px;
  gap:30px;
}
.real-product-showcase .showcase-bottom h3 {
  font-size:clamp(28px,3vw,38px);
  letter-spacing:-.035em;
}
.real-product-showcase .showcase-bottom p {
  max-width:680px;
}
.real-product-showcase .showcase-bottom li {
  font-size:14px;
}

@media(max-width:1000px) {
  .real-product-showcase .showcase-title-row {
    grid-template-columns:1fr;
    gap:14px;
  }
  .real-product-showcase .showcase-title-row > p {
    max-width:700px;
  }
}


/* ============================================================
   V22 — HERO TYPING CARET: PLACE BEFORE TEXT IN ENGLISH TOO
   ============================================================ */
.approved-hero:not(.approved-hero-ar) .hero-search-dot { order:1; }
.approved-hero:not(.approved-hero-ar) .hero-search-caret { order:2; }
.approved-hero:not(.approved-hero-ar) .hero-search-text { order:3; }
.approved-hero:not(.approved-hero-ar) .hero-search-send { order:4; }

/* ============================================================
   V22 — NATIVE PRODUCT SHOWCASE
   Uses the idea of the real product, not screenshots.
   ============================================================ */
.native-showcase-shell {
  border-radius:32px;
  background:
    radial-gradient(circle at 80% 8%, rgba(124,92,228,.09), transparent 25%),
    #050505;
  padding:34px;
  grid-template-columns:210px minmax(0,1fr);
  gap:34px;
  box-shadow:0 32px 80px rgba(20,19,32,.10);
}

.native-showcase-nav {
  position:sticky;
  top:26px;
  align-self:start;
}
.native-showcase-nav .showcase-tab {
  min-height:58px;
  padding:0 12px;
  text-align:left;
  font-size:13px;
  border-radius:9px;
}
.native-showcase-nav .showcase-tab.active {
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.70);
  color:#fff;
}
html[dir="rtl"] .native-showcase-nav .showcase-tab {
  text-align:right;
}

.native-showcase-intro {
  margin-bottom:22px;
}
.native-showcase-copy {
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);
  gap:34px;
  align-items:end;
}
.native-showcase-copy h2 {
  grid-column:1;
  margin:8px 0 0;
  font-size:clamp(45px,5vw,67px);
  line-height:.98;
  letter-spacing:-.052em;
  max-width:760px;
}
.native-showcase-copy p {
  grid-column:2;
  grid-row:1 / span 2;
  margin:0 0 5px;
  color:#c7c2cf;
  font-size:15px;
  line-height:1.65;
  max-width:440px;
}
.native-showcase-copy .showcase-kicker {
  grid-column:1;
}

.native-showcase-frame {
  border-radius:28px;
  padding:14px;
  overflow:hidden;
  background:linear-gradient(135deg,#ffab63,#ff5e7f 48%,#a963e8);
}
.native-frame-workflow {
  background:linear-gradient(135deg,#ffd0bd,#ff7a70 48%,#d75cca);
}
.native-frame-analytics {
  background:linear-gradient(135deg,#ad78f2,#9aa7ff 50%,#73b9ee);
}

.native-browser-bar {
  height:32px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 4px 8px;
  color:rgba(255,255,255,.76);
}
.native-browser-bar > span {
  width:7px; height:7px; border-radius:50%;
  background:rgba(255,255,255,.75);
}
.native-browser-bar small {
  margin-left:auto;
  margin-right:7px;
  font-size:10px;
  font-weight:700;
}
html[dir="rtl"] .native-browser-bar small {
  margin-left:7px;
  margin-right:auto;
}

.native-product-ui {
  background:#f9f8fc;
  border-radius:19px;
  min-height:430px;
  overflow:hidden;
  box-shadow:0 20px 54px rgba(0,0,0,.14);
}

/* AI STUDIO */
.ai-studio-native {
  display:grid;
  grid-template-columns:minmax(0,1fr) 195px;
}
.ai-native-workspace {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:42px 46px;
  text-align:center;
  background:
    radial-gradient(circle at 52% 36%, rgba(124,92,228,.065), transparent 28%),
    #fbfaff;
}
.ai-native-mark {
  font-size:28px;
  color:#7256df;
  margin-bottom:12px;
}
.ai-native-workspace h4 {
  margin:0;
  font-size:27px;
  color:#1a1727;
  letter-spacing:-.035em;
}
.ai-native-workspace > p {
  color:#757080;
  margin:10px auto 20px;
  font-size:13px;
}
.ai-native-prompts {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
  max-width:620px;
}
.ai-native-prompts span {
  background:#fff;
  border:1px solid #e8e5ee;
  border-radius:999px;
  padding:8px 12px;
  color:#595464;
  font-size:11px;
}
.ai-native-input {
  margin-top:50px;
  width:min(640px,90%);
  height:52px;
  background:#fff;
  border:1px solid #dfdbe8;
  border-radius:13px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px;
  box-shadow:0 8px 22px rgba(20,19,32,.06);
}
.ai-native-send {
  width:34px; height:34px; border-radius:50%;
  background:linear-gradient(135deg,#8c73e8,#7658df);
  color:#fff; display:grid; place-items:center;
}
.ai-native-placeholder {
  color:#8c8793; font-size:12px; flex:1; text-align:left;
}
html[dir="rtl"] .ai-native-placeholder { text-align:right; }

.ai-native-sidebar {
  padding:14px 10px;
  background:#f1edff;
  border-left:1px solid #e5defa;
}
html[dir="rtl"] .ai-native-sidebar {
  border-left:0;
  border-right:1px solid #e5defa;
}
.ai-native-brand {
  display:flex; align-items:center; justify-content:space-between;
  padding:7px 8px 15px; color:#171421;
}
.ai-native-flower { color:#7256df; font-size:20px; }
.ai-native-side-row {
  display:flex; align-items:center; gap:9px;
  padding:10px 9px; margin-bottom:4px;
  border-radius:9px; color:#494353; font-size:11px;
}
.ai-native-side-row.active {
  background:#e3dcff;
  color:#5b3fc4;
  font-weight:700;
}
.ai-native-side-row:nth-child(3).active {
  background:#7c5ce4;
  color:#fff;
}
.ai-native-side-icon { width:18px; text-align:center; }

/* MENU */
.menu-native {
  display:grid;
  grid-template-columns:1.05fr .95fr;
}
.menu-native-builder {
  padding:22px;
  background:#f8f7fb;
}
.menu-native-top, .menu-native-status {
  display:flex; gap:8px; flex-wrap:wrap;
  margin-bottom:14px;
}
.menu-native-tool, .menu-native-chip {
  background:#fff;
  border:1px solid #dcd8e4;
  border-radius:999px;
  padding:8px 12px;
  color:#332f3a;
  font-size:11px;
}
.menu-native-chip:last-child {
  background:#7c5ce4;
  color:#fff;
  border-color:#7c5ce4;
}
.menu-native-list {
  display:grid; gap:9px;
}
.menu-native-row {
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto 36px 36px;
  align-items:center;
  gap:8px;
  min-height:62px;
  border:1px solid #dfdbe7;
  border-radius:13px;
  background:#fff;
  padding:8px 10px;
  box-shadow:0 5px 13px rgba(20,19,32,.035);
}
.menu-native-name strong,
.menu-native-name small { display:block; }
.menu-native-name strong { color:#24202c; font-size:12px; }
.menu-native-name small { color:#88828f; font-size:9px; margin-top:3px; }
.menu-native-captured {
  border:1px solid #ddd7e7;
  border-radius:999px;
  padding:6px 8px;
  font-size:9px;
  color:#7c7683;
}
.menu-native-round {
  width:32px; height:32px;
  border:1px solid #d9d5df;
  border-radius:50%;
  background:#fff;
  font-size:16px;
}
.menu-native-preview {
  padding:18px 16px;
  border-left:1px solid #e6e2ea;
  background:#fff;
}
html[dir="rtl"] .menu-native-preview {
  border-left:0;
  border-right:1px solid #e6e2ea;
}
.menu-native-preview-head {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:14px; color:#2d2934; font-size:12px;
}
.menu-native-lang {
  border:1px solid #d9d4e3; padding:6px 9px; border-radius:999px;
  color:#6c55cf;
}
.menu-native-phone {
  width:255px;
  height:370px;
  margin:0 auto;
  border:5px solid #111;
  border-radius:32px;
  overflow:hidden;
  background:#fff;
  position:relative;
  box-shadow:0 18px 36px rgba(20,19,32,.13);
}
.menu-native-notch {
  width:78px; height:8px;
  background:#111;
  border-radius:0 0 8px 8px;
  margin:0 auto 9px;
}
.menu-native-rest {
  display:flex; gap:8px; align-items:center;
  padding:9px 10px;
  border-bottom:1px solid #eeeaf2;
}
.menu-native-rest-logo {
  width:35px; height:35px; border-radius:9px;
  display:grid; place-items:center;
  background:#fff2d9; color:#d79d24; font-weight:800;
}
.menu-native-rest strong, .menu-native-rest small { display:block; }
.menu-native-rest strong { font-size:11px; color:#292631; }
.menu-native-rest small { font-size:8px; color:#8e8993; margin-top:2px; }
.menu-native-tabs {
  display:flex; gap:5px; padding:7px 7px;
  overflow:hidden; border-bottom:1px solid #eeeaf2;
}
.menu-native-tab {
  padding:5px 8px; border:1px solid #e5e1e8;
  border-radius:999px; font-size:7px; white-space:nowrap;
}
.menu-native-tab.active {
  background:#7c5ce4; color:#fff; border-color:#7c5ce4;
}
.menu-native-item {
  display:flex; gap:8px; padding:9px 10px;
  border-bottom:1px solid #f0edf3;
}
.menu-native-food { font-size:20px; }
.menu-native-item strong, .menu-native-item small, .menu-native-item b { display:block; }
.menu-native-item strong { font-size:9px; color:#302c37; }
.menu-native-item small { font-size:7px; color:#8b8590; margin:2px 0; line-height:1.25; }
.menu-native-item b { font-size:8px; color:#1f1b25; }

/* ANALYTICS */
.analytics-native {
  padding:24px 25px;
  background:#fff;
}
.analytics-native-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:8px;
}
.analytics-native-head strong {
  display:block;
  color:#221e29;
  font-size:18px;
}
.analytics-native-head small {
  display:block;
  margin-top:5px;
  color:#8c8792;
  font-size:10px;
}
.analytics-native-badge {
  border-radius:999px;
  background:#eee9ff;
  color:#6b51d2;
  padding:7px 10px;
  font-size:9px;
  font-weight:700;
}
.analytics-native-chart {
  display:grid; gap:9px;
  margin-top:18px;
}
.analytics-native-row {
  display:grid;
  grid-template-columns:130px minmax(0,1fr) 58px;
  gap:12px;
  align-items:center;
}
.analytics-native-label strong,
.analytics-native-label small {
  display:block;
}
.analytics-native-label strong {
  color:#3a3540;
  font-size:10px;
}
.analytics-native-label small {
  color:#a09aa5;
  font-size:8px;
  margin-top:2px;
}
.analytics-native-track {
  height:12px;
  border-radius:999px;
  background:#f0eff3;
  overflow:hidden;
}
.analytics-native-fill {
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#896be9,#7455dd);
}
.analytics-native-pct {
  color:#4f4958;
  font-size:10px;
  text-align:right;
}
html[dir="rtl"] .analytics-native-pct { text-align:left; }

/* bottom copy */
.native-showcase-bottom {
  margin-top:24px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
}
.native-showcase-bottom h3 {
  margin:0 0 7px;
  font-size:clamp(27px,3vw,37px);
  letter-spacing:-.035em;
}
.native-showcase-bottom p {
  color:#bdb8c5;
  max-width:700px;
  line-height:1.55;
}
.native-benefit-chips {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
  max-width:360px;
}
.native-benefit-chips span {
  padding:8px 11px;
  border-radius:999px;
  background:#181818;
  border:1px solid #2f2f2f;
  color:#efedf3;
  font-size:10px;
}
html[dir="rtl"] .native-benefit-chips { justify-content:flex-start; }

@media(max-width:1050px){
  .native-showcase-shell { grid-template-columns:1fr; }
  .native-showcase-nav { position:static; display:flex; gap:8px; flex-wrap:wrap; }
  .native-showcase-nav .showcase-tab { flex:1; min-width:150px; text-align:center !important; }
  .native-showcase-copy { grid-template-columns:1fr; gap:10px; }
  .native-showcase-copy p { grid-column:1; grid-row:auto; max-width:720px; }
  .menu-native { grid-template-columns:1fr; }
  .menu-native-preview { border-left:0; border-top:1px solid #e6e2ea; }
}
@media(max-width:720px){
  .native-showcase-shell { padding:20px; border-radius:24px; }
  .native-showcase-copy h2 { font-size:42px; }
  .native-showcase-frame { padding:10px; border-radius:21px; }
  .ai-studio-native { grid-template-columns:1fr; }
  .ai-native-sidebar { display:none; }
  .native-showcase-bottom { grid-template-columns:1fr; }
  .native-benefit-chips { justify-content:flex-start; max-width:none; }
  .analytics-native-row { grid-template-columns:90px minmax(0,1fr) 50px; gap:8px; }
  .menu-native-phone { width:230px; }
}


/* ============================================================
   V23 — HOMEPAGE PRODUCT SHOWCASE: TWO FOCUSED PRODUCT VIEWS
   ============================================================ */
.native-showcase-shell {
  grid-template-columns: 190px minmax(0,1fr) !important;
  max-width: 1280px;
  margin-inline: auto;
}
.native-showcase-nav {
  display:flex;
  flex-direction:column;
  gap:4px;
}
.native-showcase-nav .showcase-tab {
  min-height:60px;
}
.native-showcase-main {
  min-width:0;
}
.native-showcase-panel .native-showcase-frame {
  margin-top: 4px;
}

/* ============================================================
   V23 — ARABIC: SAME PHYSICAL LAYOUT AS ENGLISH
   Arabic text stays RTL, but section geometry remains identical.
   ============================================================ */
html[dir="rtl"] .site-header,
html[dir="rtl"] .approved-hero-grid,
html[dir="rtl"] .problem-visual,
html[dir="rtl"] .compact-feature-grid-ar,
html[dir="rtl"] .use-case-layout,
html[dir="rtl"] .proof-grid,
html[dir="rtl"] .native-showcase-shell,
html[dir="rtl"] .integration-orbit,
html[dir="rtl"] .testimonial-stage,
html[dir="rtl"] .insights-head,
html[dir="rtl"] .insights-grid,
html[dir="rtl"] .pricing-grid,
html[dir="rtl"] .faq-layout,
html[dir="rtl"] .homepage-footer {
  direction:ltr;
}

html[dir="rtl"] .approved-copy,
html[dir="rtl"] .feature-card,
html[dir="rtl"] .use-case-copy,
html[dir="rtl"] .proof-card,
html[dir="rtl"] .native-showcase-panel,
html[dir="rtl"] .testimonial-card,
html[dir="rtl"] .insight-card,
html[dir="rtl"] .pricing-card,
html[dir="rtl"] .faq-intro,
html[dir="rtl"] .faq-item,
html[dir="rtl"] .footer-brand,
html[dir="rtl"] .footer-links {
  direction:rtl;
  text-align:right;
}

html[dir="rtl"] .approved-hero-ar .approved-hero-grid {
  grid-template-columns: minmax(0,1.05fr) minmax(470px,.95fr) !important;
}
html[dir="rtl"] .approved-hero-ar .approved-copy {
  grid-column:1 !important;
  grid-row:1 !important;
  text-align:right;
}
html[dir="rtl"] .approved-hero-ar .approved-visual {
  grid-column:2 !important;
  grid-row:1 !important;
}
html[dir="rtl"] .approved-hero-ar .approved-actions,
html[dir="rtl"] .approved-hero-ar .hero-prompt-chips {
  justify-content:flex-start !important;
}
html[dir="rtl"] .approved-hero-ar .approved-stats {
  direction:ltr;
}
html[dir="rtl"] .approved-hero-ar .approved-stats article {
  direction:rtl;
  text-align:right;
}

/* The black product section keeps navigation physically on the left in both languages. */
html[dir="rtl"] .native-showcase-nav {
  direction:rtl;
}
html[dir="rtl"] .native-showcase-main {
  direction:rtl;
}
html[dir="rtl"] .native-showcase-copy {
  direction:ltr;
}
html[dir="rtl"] .native-showcase-copy > * {
  direction:rtl;
}
html[dir="rtl"] .native-showcase-bottom {
  direction:ltr;
}
html[dir="rtl"] .native-showcase-bottom > * {
  direction:rtl;
  text-align:right;
}

/* ============================================================
   V23 — ALL INNER PAGES USE THE HOMEPAGE DESIGN SYSTEM
   ============================================================ */
body.site-consistent-page {
  background:
    radial-gradient(circle at 50% -5%, rgba(124,92,228,.09), transparent 32rem),
    #FBFAFD;
  color:var(--ink);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}
html[dir="rtl"] body.site-consistent-page {
  font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif !important;
}

body.site-consistent-page main {
  width:min(1320px,calc(100% - 48px));
  margin:0 auto;
}

body.site-consistent-page .subpage-hero,
body.site-consistent-page .simple-page-hero {
  position:relative;
  margin:28px auto 56px;
  padding:78px clamp(28px,5vw,72px);
  border:1px solid rgba(20,19,32,.08);
  border-radius:32px;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 18%, rgba(124,92,228,.12), transparent 30%),
    radial-gradient(circle at 14% 84%, rgba(255,93,137,.08), transparent 28%),
    rgba(255,255,255,.74);
  box-shadow:0 24px 70px rgba(20,19,32,.055);
}

body.site-consistent-page .subpage-hero-copy,
body.site-consistent-page .simple-page-hero > * {
  position:relative;
  z-index:2;
}

body.site-consistent-page .subpage-hero-copy h1,
body.site-consistent-page .simple-page-hero h1 {
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size:clamp(50px,6vw,82px);
  line-height:.96;
  font-weight:650;
  letter-spacing:-.06em;
  max-width:920px;
  margin:18px 0;
}
html[dir="rtl"] body.site-consistent-page .subpage-hero-copy h1,
html[dir="rtl"] body.site-consistent-page .simple-page-hero h1 {
  font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif !important;
  letter-spacing:-.035em;
  line-height:1.08;
}

body.site-consistent-page .subpage-hero-copy > p,
body.site-consistent-page .simple-page-hero > p {
  max-width:760px;
  color:var(--muted);
  font-size:18px;
  line-height:1.7;
}

body.site-consistent-page .subpage-section {
  margin:0 auto 70px;
  padding:0;
}
body.site-consistent-page .process-head {
  margin-bottom:28px;
}
body.site-consistent-page .process-head h2,
body.site-consistent-page .featured-copy h2,
body.site-consistent-page .legal-copy h2 {
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing:-.045em;
  font-weight:650;
}
html[dir="rtl"] body.site-consistent-page .process-head h2,
html[dir="rtl"] body.site-consistent-page .featured-copy h2,
html[dir="rtl"] body.site-consistent-page .legal-copy h2 {
  font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif !important;
  letter-spacing:-.025em;
}

/* Shared premium card treatment */
body.site-consistent-page .coverage-card,
body.site-consistent-page .schema-card,
body.site-consistent-page .tutorial-card,
body.site-consistent-page .blog-card,
body.site-consistent-page .featured-article,
body.site-consistent-page .faq-item,
body.site-consistent-page .contact-panel,
body.site-consistent-page .contact-form,
body.site-consistent-page .auth-card,
body.site-consistent-page .auth-visual,
body.site-consistent-page .principle-panel,
body.site-consistent-page .source-identity-panel,
body.site-consistent-page .permission-banner,
body.site-consistent-page .legal-review-banner {
  border:1px solid rgba(20,19,32,.085);
  border-radius:24px;
  background:rgba(255,255,255,.82);
  box-shadow:0 18px 46px rgba(20,19,32,.045);
}

body.site-consistent-page .coverage-card,
body.site-consistent-page .schema-card,
body.site-consistent-page .tutorial-card,
body.site-consistent-page .blog-card {
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
body.site-consistent-page .coverage-card:hover,
body.site-consistent-page .schema-card:hover,
body.site-consistent-page .tutorial-card:hover,
body.site-consistent-page .blog-card:hover {
  transform:translateY(-5px);
  border-color:rgba(124,92,228,.22);
  box-shadow:0 24px 60px rgba(20,19,32,.075);
}

/* More homepage-like headings and chips */
body.site-consistent-page .section-kicker,
body.site-consistent-page .pill-label {
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-weight:750;
  letter-spacing:.1em;
}
html[dir="rtl"] body.site-consistent-page .section-kicker,
html[dir="rtl"] body.site-consistent-page .pill-label {
  font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif !important;
  letter-spacing:0;
}

/* Pricing becomes visually part of the same family */
body.site-consistent-page .reference-pricing-shell {
  width:min(1240px,calc(100% - 48px));
  margin:38px auto 70px;
}
body.site-consistent-page .reference-plan-card {
  border-radius:24px;
  border:1px solid rgba(20,19,32,.085);
  box-shadow:0 18px 48px rgba(20,19,32,.045);
}
body.site-consistent-page .reference-plan-card:hover {
  border-color:rgba(124,92,228,.28);
  box-shadow:0 24px 60px rgba(20,19,32,.075);
}

/* FAQ page and homepage FAQ share the same calm accordion style */
body.site-consistent-page .big-faq .faq-item,
body.site-consistent-page .faq-list .faq-item {
  overflow:hidden;
}
body.site-consistent-page .faq-question {
  min-height:72px;
  font-size:16px;
}
body.site-consistent-page .faq-answer {
  color:var(--muted);
  line-height:1.75;
}

/* Contact */
body.site-consistent-page .contact-wrap {
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:20px;
}
body.site-consistent-page input,
body.site-consistent-page textarea,
body.site-consistent-page select {
  border-radius:13px !important;
  border-color:rgba(20,19,32,.11) !important;
  background:#fff !important;
}
body.site-consistent-page input:focus,
body.site-consistent-page textarea:focus,
body.site-consistent-page select:focus {
  outline:2px solid rgba(124,92,228,.18);
  border-color:rgba(124,92,228,.38) !important;
}

/* Auth pages */
body.site-consistent-page .auth-shell {
  width:min(1180px,calc(100% - 48px));
  margin:42px auto 72px;
  gap:20px;
}
body.site-consistent-page .google-auth-btn,
body.site-consistent-page .auth-submit {
  min-height:52px;
  border-radius:999px;
}

/* Legal */
body.site-consistent-page .legal-layout {
  gap:30px;
}
body.site-consistent-page .legal-toc {
  position:sticky;
  top:120px;
  align-self:start;
  border:1px solid rgba(20,19,32,.08);
  border-radius:20px;
  padding:22px;
  background:rgba(255,255,255,.82);
}
body.site-consistent-page .legal-copy {
  border:1px solid rgba(20,19,32,.08);
  border-radius:24px;
  background:rgba(255,255,255,.76);
  padding:clamp(28px,4vw,56px);
}

/* Insights */
body.site-consistent-page .featured-article {
  overflow:hidden;
}
body.site-consistent-page .blog-cover {
  border-radius:18px;
}
body.site-consistent-page .blog-grid {
  gap:18px;
}

/* Footer: inner pages now use the homepage footer markup */
body.site-consistent-page .homepage-footer {
  margin-top:76px;
}

/* Arabic inner pages: same physical composition as English, RTL inside content. */
html[dir="rtl"] body.site-consistent-page .subpage-hero,
html[dir="rtl"] body.site-consistent-page .simple-page-hero,
html[dir="rtl"] body.site-consistent-page .subpage-section,
html[dir="rtl"] body.site-consistent-page .contact-wrap,
html[dir="rtl"] body.site-consistent-page .auth-shell,
html[dir="rtl"] body.site-consistent-page .legal-layout,
html[dir="rtl"] body.site-consistent-page .coverage-cards,
html[dir="rtl"] body.site-consistent-page .schema-grid,
html[dir="rtl"] body.site-consistent-page .tutorial-grid,
html[dir="rtl"] body.site-consistent-page .blog-grid,
html[dir="rtl"] body.site-consistent-page .featured-article {
  direction:ltr;
}
html[dir="rtl"] body.site-consistent-page .subpage-hero-copy,
html[dir="rtl"] body.site-consistent-page .simple-page-hero > *,
html[dir="rtl"] body.site-consistent-page .contact-panel,
html[dir="rtl"] body.site-consistent-page .contact-form,
html[dir="rtl"] body.site-consistent-page .auth-card,
html[dir="rtl"] body.site-consistent-page .auth-visual,
html[dir="rtl"] body.site-consistent-page .legal-toc,
html[dir="rtl"] body.site-consistent-page .legal-copy,
html[dir="rtl"] body.site-consistent-page .coverage-card,
html[dir="rtl"] body.site-consistent-page .schema-card,
html[dir="rtl"] body.site-consistent-page .tutorial-card,
html[dir="rtl"] body.site-consistent-page .blog-card,
html[dir="rtl"] body.site-consistent-page .featured-copy {
  direction:rtl;
  text-align:right;
}

@media(max-width:980px){
  .native-showcase-shell {
    grid-template-columns:1fr !important;
  }
  .native-showcase-nav {
    position:static;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body.site-consistent-page .contact-wrap {
    grid-template-columns:1fr;
  }
}
@media(max-width:720px){
  body.site-consistent-page main,
  body.site-consistent-page .reference-pricing-shell,
  body.site-consistent-page .auth-shell {
    width:min(100% - 28px,1320px);
  }
  body.site-consistent-page .subpage-hero,
  body.site-consistent-page .simple-page-hero {
    padding:48px 22px;
    border-radius:24px;
  }
  body.site-consistent-page .subpage-hero-copy h1,
  body.site-consistent-page .simple-page-hero h1 {
    font-size:44px;
  }
  .native-showcase-nav {
    grid-template-columns:1fr;
  }
}


/* ============================================================
   V24 — CLEAN HEADER NAV
   Tutorials + Contact live in the middle navigation.
   Create Account replaces Book a Demo in the header.
   ============================================================ */
.site-header,
.hero-header {
  width:min(1540px,calc(100% - 32px));
  gap:16px;
}
.site-header .brand,
.hero-header .brand {
  flex:0 0 224px;
}
.site-header .nav,
.hero-header .nav {
  gap:clamp(10px,1.15vw,18px);
  font-size:12.5px;
}
.site-header .nav a {
  padding:9px 0;
}
.site-header .header-actions,
.hero-header .header-actions {
  gap:8px;
}
.header-account {
  background:#fff !important;
  min-width:126px;
  border-color:rgba(20,19,32,.11) !important;
}
.header-account:hover {
  border-color:rgba(124,92,228,.25) !important;
  background:#fff !important;
}
.header-login {
  min-width:110px;
}

/* Keep the navigation physically identical in Arabic and English. */
html[dir="rtl"] .site-header {
  direction:ltr !important;
}
html[dir="rtl"] .site-header .brand,
html[dir="rtl"] .site-header .nav,
html[dir="rtl"] .site-header .header-actions {
  direction:ltr !important;
}
html[dir="rtl"] .site-header .nav a,
html[dir="rtl"] .site-header .header-actions a {
  unicode-bidi:plaintext;
}

/* ============================================================
   V24 — ARABIC FEATURE GRID = ENGLISH FEATURE GRID
   Exact same card geometry; only the content itself is RTL.
   ============================================================ */
html[dir="rtl"] .compact-feature-grid-ar {
  direction:ltr !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  grid-template-areas:
    "dark dark adaptive"
    "reports coverage automation" !important;
}
html[dir="rtl"] .compact-feature-grid-ar > .feature-card {
  direction:rtl !important;
  text-align:right !important;
}
html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark {
  direction:ltr !important;
  grid-template-columns:1fr 1.15fr !important;
}
html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .dark-copy {
  grid-column:1 !important;
  grid-row:1 !important;
  direction:rtl !important;
  text-align:right !important;
}
html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .mock-window {
  grid-column:2 !important;
  grid-row:1 !important;
  direction:rtl !important;
}
html[dir="rtl"] .compact-feature-grid-ar .visual-input {
  direction:rtl;
}
html[dir="rtl"] .compact-feature-grid-ar .visual-input button {
  transform:scaleX(-1);
}

/* ============================================================
   V24 — CONTACT OWNS THE DEMO CTA
   ============================================================ */
.contact-hero-actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:28px;
}
.contact-demo-button {
  min-width:158px;
}
.contact-method:nth-child(2) {
  padding:16px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(124,92,228,.08),rgba(241,236,253,.75));
  border:1px solid rgba(124,92,228,.15);
}
.contact-method:nth-child(2) a {
  color:#5B3FC4;
  font-weight:700;
}

/* ============================================================
   V24 — PRODUCT SHOWCASE REMOVED
   Keep spacing clean where it used to sit.
   ============================================================ */
.feature-grid-section {
  padding-bottom:72px;
}

/* Header breakpoints with the larger middle nav. */
@media(max-width:1320px) {
  .site-header .brand,
  .hero-header .brand {
    flex-basis:198px;
  }
  .site-header .nav,
  .hero-header .nav {
    gap:10px;
    font-size:11.5px;
  }
  .header-account { min-width:112px; }
  .header-login { min-width:100px; }
}
@media(max-width:1120px) {
  .site-header .nav,
  .hero-header .nav {
    display:none;
  }
  .site-header .brand,
  .hero-header .brand {
    flex:1 1 auto;
  }
}
@media(max-width:1020px) {
  html[dir="rtl"] .compact-feature-grid-ar {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-template-areas:
      "dark dark"
      "adaptive reports"
      "coverage automation" !important;
  }
}
@media(max-width:700px) {
  html[dir="rtl"] .compact-feature-grid-ar {
    grid-template-columns:1fr !important;
    grid-template-areas:
      "dark"
      "adaptive"
      "reports"
      "coverage"
      "automation" !important;
  }
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark {
    grid-template-columns:1fr !important;
  }
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .dark-copy,
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .mock-window {
    grid-column:1 !important;
  }
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .dark-copy {
    grid-row:1 !important;
  }
  html[dir="rtl"] .compact-feature-grid-ar .compact-area-dark .mock-window {
    grid-row:2 !important;
  }
  .header-account {
    display:none;
  }
}


/* ============================================================
   V25 — NAV + CONTACT HERO CLEANUP
   ============================================================ */
.contact-hero-actions {
  display:none !important;
}

/* Keep the contact hero balanced without the redundant CTA row. */
body.site-consistent-page .simple-page-hero {
  padding-bottom:64px;
}


/* ============================================================
   V26 — COVERAGE / AUTH / CONTACT POLISH
   ============================================================ */

/* ---------- Saudi coverage map ---------- */
.coverage-map {
  isolation:isolate;
}
.saudi-map-svg {
  position:absolute;
  width:78%;
  height:84%;
  left:12%;
  top:7%;
  z-index:0;
  overflow:visible;
  filter:drop-shadow(0 18px 36px rgba(124,92,228,.06));
  animation:saudiMapDrift 9s ease-in-out infinite;
}
.saudi-map-country {
  fill:url(#saudiWash);
  stroke:rgba(124,92,228,.22);
  stroke-width:2.2;
  vector-effect:non-scaling-stroke;
}
.saudi-district-lines path {
  fill:none;
  stroke:rgba(124,92,228,.12);
  stroke-width:1.5;
  stroke-dasharray:6 9;
  vector-effect:non-scaling-stroke;
}
.coverage-map .map-dot,
.coverage-map .coverage-float {
  z-index:2;
}
.coverage-map .coverage-float {
  backdrop-filter:blur(12px);
  box-shadow:0 14px 36px rgba(20,19,32,.07);
  animation:coverageFloat 6s ease-in-out infinite;
}
.coverage-map .c-f2 { animation-delay:-2s; }
.coverage-map .c-f3 { animation-delay:-4s; }

@keyframes saudiMapDrift {
  0%,100% { transform:translate3d(0,0,0) scale(1); }
  50% { transform:translate3d(0,-5px,0) scale(1.012); }
}
@keyframes coverageFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-7px); }
}

/* ---------- Authentication ---------- */
.auth-shell {
  grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
  min-height:740px;
  border-radius:34px;
  background:#fff;
  box-shadow:0 34px 90px rgba(41,31,66,.09);
}
.auth-visual {
  min-height:740px;
  padding:54px 58px;
  display:block;
  background:
    radial-gradient(circle at 20% 15%, rgba(255,110,151,.11), transparent 28%),
    radial-gradient(circle at 78% 16%, rgba(124,92,228,.17), transparent 29%),
    linear-gradient(145deg,#fbfaff 0%,#f6f2ff 60%,#fcf9ff 100%);
}
.auth-visual::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(124,92,228,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,92,228,.035) 1px, transparent 1px);
  background-size:54px 54px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 78%);
}
.auth-visual-inner {
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  flex-direction:column;
}
.auth-eyebrow {
  align-self:flex-start;
}
html[dir="rtl"] .auth-eyebrow {
  align-self:flex-end;
}
.auth-hero-title {
  margin:24px 0 12px;
  font-size:clamp(48px,5.2vw,72px);
  line-height:.98;
  letter-spacing:-.055em;
  font-weight:680;
  max-width:640px;
}
html[dir="rtl"] .auth-hero-title {
  letter-spacing:-.025em;
  line-height:1.08;
}
.auth-hero-copy {
  margin:0;
  color:var(--muted);
  max-width:570px;
  line-height:1.65;
  font-size:16px;
}
.auth-scene {
  position:relative;
  height:330px;
  margin:34px 0 18px;
  border-radius:28px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(124,92,228,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 24px 60px rgba(72,52,117,.07);
  overflow:hidden;
}
.auth-scene::before {
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(124,92,228,.17),rgba(124,92,228,.03) 48%,transparent 70%);
  animation:authPulse 5s ease-in-out infinite;
}
.auth-scene-lines {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.auth-scene-lines path {
  fill:none;
  stroke:rgba(124,92,228,.22);
  stroke-width:1.4;
  stroke-dasharray:5 8;
  animation:authDash 14s linear infinite;
}
.auth-scene-center {
  position:absolute;
  left:50%;
  top:50%;
  width:142px;
  height:142px;
  transform:translate(-50%,-50%);
  border-radius:38px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  background:linear-gradient(145deg,#fff,#f4efff);
  border:1px solid rgba(124,92,228,.14);
  box-shadow:0 24px 54px rgba(83,62,136,.15);
  animation:authCenterFloat 6s ease-in-out infinite;
}
.auth-scene-center img {
  width:44px;
  height:44px;
  object-fit:contain;
}
.auth-scene-center strong {
  font-size:13px;
}
.auth-scene-node {
  position:absolute;
  min-width:128px;
  height:52px;
  padding:0 15px;
  border-radius:16px;
  display:flex;
  align-items:center;
  gap:9px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 13px 30px rgba(20,19,32,.07);
  font-size:12px;
  font-weight:700;
  animation:authNodeFloat 6.5s ease-in-out infinite;
}
.auth-scene-node-dot {
  width:9px;
  height:9px;
  border-radius:50%;
  background:linear-gradient(135deg,#ff6f91,#7c5ce4);
  box-shadow:0 0 0 5px rgba(124,92,228,.07);
}
.auth-scene-node.n1 { left:5%; top:14%; animation-delay:-1s; }
.auth-scene-node.n2 { right:5%; top:15%; animation-delay:-2.5s; }
.auth-scene-node.n3 { left:4%; bottom:15%; animation-delay:-4s; }
.auth-scene-node.n4 { right:4%; bottom:16%; animation-delay:-5.2s; }

.auth-proof-polished {
  margin-top:auto;
}
.auth-proof-polished span {
  padding:10px 13px;
  background:#fff;
  box-shadow:0 8px 22px rgba(20,19,32,.04);
}
.auth-card {
  padding:52px 46px;
  background:rgba(255,255,255,.97);
  position:relative;
}
.auth-card::before {
  content:"";
  position:absolute;
  top:0;
  left:44px;
  right:44px;
  height:3px;
  border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,#7C5CE4,#CB78E8,#FF6A8D);
}
.auth-card-head h2 {
  font-size:38px;
  letter-spacing:-.04em;
}
.google-auth-btn {
  height:56px;
  border-radius:16px;
  gap:12px;
  color:#24212d;
  box-shadow:0 5px 18px rgba(20,19,32,.035);
}
.google-logo {
  width:25px;
  height:25px;
  object-fit:contain;
  flex:0 0 25px;
}
.auth-form input[type="email"],
.auth-form input[type="password"],
.auth-form input[type="text"] {
  height:54px;
  border-radius:15px;
  background:#fff;
}
.auth-submit {
  min-height:54px;
  box-shadow:0 13px 28px rgba(124,92,228,.18);
}
.signup-plan-box {
  padding:16px;
  border-radius:17px;
  background:linear-gradient(135deg,#f8f5ff,#fff);
}
@keyframes authPulse {
  0%,100% { transform:translate(-50%,-50%) scale(.94); opacity:.75; }
  50% { transform:translate(-50%,-50%) scale(1.08); opacity:1; }
}
@keyframes authDash {
  to { stroke-dashoffset:-120; }
}
@keyframes authCenterFloat {
  0%,100% { transform:translate(-50%,-50%); }
  50% { transform:translate(-50%,calc(-50% - 8px)); }
}
@keyframes authNodeFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-8px); }
}

/* ---------- Contact ---------- */
.contact-wrap {
  margin:58px auto 90px;
}
.contact-panel {
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:30px;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  align-items:stretch;
}
.contact-info,
.contact-form {
  border:1px solid rgba(20,19,32,.08);
  border-radius:28px;
  box-shadow:0 24px 58px rgba(20,19,32,.055);
}
.contact-info {
  min-height:560px;
  padding:38px;
  background:
    radial-gradient(circle at 85% 5%,rgba(124,92,228,.14),transparent 24%),
    linear-gradient(145deg,#f9f6ff,#fff 62%);
}
.contact-card-label {
  display:inline-flex;
  width:max-content;
  padding:8px 11px;
  margin-bottom:18px;
  border:1px solid rgba(124,92,228,.12);
  border-radius:999px;
  background:#fff;
  color:#6b55ca;
  font-size:10px;
  font-weight:800;
  letter-spacing:.09em;
}
.contact-methods {
  grid-template-columns:1fr;
  gap:12px;
  margin-top:28px;
}
.contact-method {
  padding:19px 20px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.contact-method:hover {
  transform:translateY(-4px);
  border-color:rgba(124,92,228,.2);
  box-shadow:0 16px 30px rgba(20,19,32,.065);
}
.contact-method:nth-child(2) {
  background:linear-gradient(135deg,#efe9ff,#fff);
}
.contact-note {
  margin-top:auto;
  padding:26px;
  border:1px solid rgba(124,92,228,.10);
  border-radius:21px;
  background:rgba(255,255,255,.72);
  font-family:inherit !important;
  font-size:25px;
  font-weight:620;
  letter-spacing:-.035em;
  line-height:1.2;
}
.contact-form {
  padding:38px;
  gap:16px;
  background:#fff;
}
.contact-form-head {
  grid-column:1/-1;
  margin-bottom:4px;
}
.contact-form-head h2 {
  margin:0;
  font-size:31px;
  letter-spacing:-.04em;
}
.contact-form-head p {
  margin:8px 0 10px;
  color:var(--muted);
  line-height:1.55;
  font-size:13px;
  max-width:560px;
}
.contact-submit {
  min-height:54px;
  background:linear-gradient(135deg,#8063e7,#6a47db);
  box-shadow:0 14px 28px rgba(124,92,228,.20);
  transition:transform .22s ease, box-shadow .22s ease;
}
.contact-submit:hover {
  transform:translateY(-2px);
  background:linear-gradient(135deg,#7658df,#5b3fc4);
  box-shadow:0 18px 34px rgba(124,92,228,.25);
}

/* Give the FAQ section breathing room after Contact. */
.contact-wrap + .big-faq,
.contact-wrap + section {
  margin-top:84px;
}

html[dir="rtl"] .contact-card-label {
  letter-spacing:0;
}
html[dir="rtl"] .contact-note,
html[dir="rtl"] .contact-form-head {
  text-align:right;
}

@media(max-width:1050px) {
  .auth-shell {
    grid-template-columns:1fr;
  }
  .auth-visual {
    min-height:auto;
    padding:46px;
  }
  .auth-scene {
    max-width:720px;
  }
  .contact-panel {
    grid-template-columns:1fr;
  }
  .contact-info {
    min-height:auto;
  }
}
@media(max-width:720px) {
  .auth-visual {
    padding:34px 22px;
  }
  .auth-hero-title {
    font-size:43px;
  }
  .auth-scene {
    height:280px;
  }
  .auth-scene-center {
    width:118px;
    height:118px;
    border-radius:31px;
  }
  .auth-scene-node {
    min-width:100px;
    height:45px;
    padding:0 10px;
  }
  .auth-card {
    padding:38px 23px;
  }
  .contact-info,
  .contact-form {
    padding:25px;
    border-radius:23px;
  }
}

/* ============================================================
   V29 — UNIFIED BRAND LOCKUP + INSIGHT ART + SMOOTH TESTIMONIAL DRAG
   ============================================================ */

/* One identical SpoonIndex lockup in English and Arabic.
   Keep the brand itself LTR, and keep the descriptor on one line. */
.brand.brand-real,
.footer-brand-link {
  direction:ltr !important;
  width:max-content;
  max-width:100%;
}
.brand-copy,
.footer-wordmark {
  min-width:0;
}
.brand-copy small,
.footer-wordmark small {
  white-space:nowrap !important;
}
.site-header .brand {
  flex:0 0 286px;
  min-width:286px;
}
.site-header .brand-logo-img {
  width:38px;
  height:38px;
  flex:0 0 38px;
}
.site-header .brand-copy strong {
  font-size:21px;
  line-height:1;
  letter-spacing:-.045em;
}
.site-header .brand-copy small {
  display:block;
  margin-top:5px;
  font-size:7px;
  line-height:1.15;
  letter-spacing:.18em;
}

/* Article artwork on the homepage insight strip. */
.media-insight-cover {
  position:relative;
  overflow:hidden;
  padding:0 !important;
  display:block !important;
  background:#f7f4ff !important;
  isolation:isolate;
}
.media-insight-cover img {
  width:100%;
  height:100%;
  min-height:240px;
  object-fit:cover;
  display:block;
  transition:transform .5s cubic-bezier(.2,.75,.2,1), filter .5s ease;
}
.media-insight-cover::after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:48%;
  background:linear-gradient(180deg,rgba(20,19,32,0),rgba(20,19,32,.28));
  pointer-events:none;
  z-index:1;
}
.media-insight-cover span {
  position:absolute;
  z-index:2;
  left:28px;
  right:28px;
  bottom:24px;
  color:#fff;
  text-align:left;
  font-size:clamp(18px,1.5vw,24px);
  font-weight:800;
  line-height:1.16;
  text-shadow:0 8px 24px rgba(20,19,32,.28);
}
html[dir="rtl"] .media-insight-cover span {
  text-align:right;
}
.insight-card:hover .media-insight-cover img {
  transform:scale(1.035);
  filter:saturate(1.04);
}

/* Full Insights page: real artwork instead of empty gradients. */
.media-blog-cover {
  position:relative;
  overflow:hidden;
  padding:0 !important;
  display:block !important;
  background:#f7f4ff !important;
  min-height:220px;
  isolation:isolate;
}
.media-blog-cover img {
  width:100%;
  height:100%;
  min-height:220px;
  object-fit:cover;
  display:block;
  transition:transform .5s cubic-bezier(.2,.75,.2,1);
}
.media-blog-cover::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 48%,rgba(20,19,32,.28));
  pointer-events:none;
}
.media-blog-cover span {
  position:absolute;
  left:22px;
  right:22px;
  bottom:18px;
  z-index:2;
  color:#fff;
  font-size:15px;
  font-weight:800;
  letter-spacing:.08em;
  text-align:left;
  text-shadow:0 6px 20px rgba(20,19,32,.30);
}
html[dir="rtl"] .media-blog-cover span { text-align:right; }
.blog-card:hover .media-blog-cover img { transform:scale(1.035); }

/* Smooth testimonial stack.
   The pointer only moves the active card; the next two react with transform-only
   motion. Avoid expensive shadow changes on every frame. */
.testimonial-stack {
  contain:layout paint style;
}
.testimonial-stack .stack-card {
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  perspective:1000px;
  will-change:transform, opacity;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
}
.testimonial-stack .stack-card.is-dragging {
  cursor:grabbing;
  transition:none !important;
  box-shadow:0 28px 64px rgba(20,19,32,.16) !important;
}
.testimonial-stack.is-drag-active .stack-card.is-next,
.testimonial-stack.is-drag-active .stack-card.is-third {
  will-change:transform;
}

@media (max-width: 1180px) {
  .site-header .brand { flex-basis:245px; min-width:245px; }
  .site-header .brand-logo-img { width:35px; height:35px; flex-basis:35px; }
  .site-header .brand-copy strong { font-size:19px; }
  .site-header .brand-copy small { font-size:6.5px; letter-spacing:.16em; }
}
@media (max-width: 900px) {
  .site-header .brand { flex-basis:auto; min-width:0; }
  .site-header .brand-copy small { display:none; }
  .media-insight-cover img { min-height:210px; }
  .media-blog-cover img { min-height:200px; }
}

/* ============================================================
   V30 — TESTIMONIAL DRAG MOTION FIX
   ============================================================ */
.testimonial-stack {
  overflow:visible !important;
  contain:layout style !important;
}
.testimonial-stack .stack-card {
  touch-action:none !important;
  transform-origin:50% 72% !important;
  backface-visibility:hidden !important;
  -webkit-backface-visibility:hidden !important;
  will-change:transform !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  cursor:grab;
}
.testimonial-stack .stack-card.is-top {
  cursor:grab;
}
.testimonial-stack .stack-card.is-dragging {
  cursor:grabbing !important;
  transition:none !important;
  will-change:transform !important;
}
html.testimonial-dragging,
html.testimonial-dragging body {
  cursor:grabbing !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}
.testimonial-stack.is-drag-active .stack-card.is-next,
.testimonial-stack.is-drag-active .stack-card.is-third {
  opacity:1 !important;
  visibility:visible !important;
}
/* Keep the real lower cards present behind the active card; their content is
   revealed physically as the front card moves. */
.testimonial-stack .stack-card.is-next,
.testimonial-stack .stack-card.is-third {
  background:#fff !important;
}
@media (pointer:coarse) {
  .testimonial-stack .stack-card { touch-action:none !important; }
}




/* ============================================================
   V31 — VISIBLE TESTIMONIAL DRAG
   ============================================================ */
.testimonial-stack {
  overflow:visible !important;
  contain:layout style !important;
  isolation:isolate;
}
.testimonial-stack .stack-card {
  --card-x:0px;
  --card-y:0px;
  --card-scale:1;
  --card-rotate:0deg;
  transform:translate3d(var(--card-x),var(--card-y),0) scale(var(--card-scale)) rotate(var(--card-rotate)) !important;
  animation:none !important;
  backface-visibility:hidden !important;
  -webkit-backface-visibility:hidden !important;
  transform-origin:50% 68% !important;
  will-change:transform !important;
  touch-action:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  cursor:grab !important;
}
.testimonial-stack .stack-card.is-top {
  pointer-events:auto !important;
  cursor:grab !important;
}
.testimonial-stack .stack-card.is-dragging {
  cursor:grabbing !important;
  transition:none !important;
  box-shadow:0 42px 92px rgba(20,19,32,.20) !important;
}
.testimonial-stack.is-drag-active .stack-card.is-next,
.testimonial-stack.is-drag-active .stack-card.is-third {
  opacity:1 !important;
  visibility:visible !important;
}
html.testimonial-dragging,
html.testimonial-dragging body {
  cursor:grabbing !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}

/* ============================================================
   V32 — RESTORE PROVEN TESTIMONIAL DRAG FROM V28
   This intentionally overrides the later V30/V31 experiments.
   ============================================================ */
.testimonial-stack {
  position:relative !important;
  overflow:visible !important;
  contain:none !important;
  isolation:isolate;
}
.testimonial-stack .stack-card {
  touch-action:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  cursor:grab !important;
  transform-origin:50% 65% !important;
  will-change:transform, opacity !important;
  backface-visibility:hidden !important;
  -webkit-backface-visibility:hidden !important;
  animation:none !important;
  background:#fff !important;
}
.testimonial-stack .stack-card.is-top {
  pointer-events:auto !important;
  cursor:grab !important;
}
.testimonial-stack .stack-card.is-dragging {
  cursor:grabbing !important;
  transition:none !important;
  box-shadow:0 42px 90px rgba(20,19,32,.20) !important;
}
.testimonial-stack.is-drag-active .stack-card.is-next,
.testimonial-stack.is-drag-active .stack-card.is-third {
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:none !important;
}
/* The v28 JS writes the live transform inline with !important. Clear the
   experimental CSS-variable transform layer so it cannot fight the pointer. */
.testimonial-stack .stack-card {
  --card-x:initial;
  --card-y:initial;
  --card-scale:initial;
  --card-rotate:initial;
}
html.testimonial-dragging,
html.testimonial-dragging body {
  cursor:grabbing !important;
  user-select:none !important;
  -webkit-user-select:none !important;
}


/* v33 — full supplied legal drafts */
.legal-page .legal-hero{padding-bottom:clamp(34px,5vw,72px)}
.legal-page .legal-hero h1{max-width:1050px;margin:18px auto 0;font-size:clamp(46px,7vw,96px);line-height:.92;letter-spacing:-.055em;text-align:center}
.legal-page .legal-date-row{display:flex;justify-content:center;gap:14px 28px;flex-wrap:wrap;margin-top:24px;color:var(--muted,#6b6878);font-size:14px}
.legal-page .legal-date-row span{padding:10px 14px;border:1px solid rgba(20,19,32,.09);border-radius:999px;background:rgba(255,255,255,.74);box-shadow:0 10px 30px rgba(61,43,130,.05)}
.legal-publication-warning{max-width:1180px;margin:0 auto 22px;background:linear-gradient(135deg,rgba(241,236,253,.95),rgba(255,255,255,.98));border:1px solid rgba(124,92,228,.18);border-radius:24px;padding:20px 24px;display:grid;gap:6px;box-shadow:0 16px 45px rgba(91,63,196,.07)}
.legal-publication-warning strong{font-size:15px;color:#5B3FC4}.legal-publication-warning span{color:#5C5870;line-height:1.75}
.legal-page .legal-layout{align-items:start;gap:28px;max-width:1320px;margin:0 auto}
.legal-page .legal-toc{top:110px;max-height:calc(100vh - 140px);overflow:auto;padding:20px;border:1px solid rgba(20,19,32,.08);border-radius:24px;background:rgba(255,255,255,.82);backdrop-filter:blur(16px);box-shadow:0 18px 60px rgba(32,24,74,.06)}
.legal-page .legal-toc a{display:block;padding:9px 10px;border-radius:10px;font-size:13px;line-height:1.35;color:#5C5870;text-decoration:none;transition:background .18s ease,color .18s ease,transform .18s ease}
.legal-page .legal-toc a:hover{background:#F1ECFD;color:#5B3FC4;transform:translateX(2px)}
.legal-page .legal-copy-full{display:grid;gap:16px;min-width:0}
.legal-page .legal-section-card{padding:clamp(24px,3.2vw,42px);border:1px solid rgba(20,19,32,.08);border-radius:28px;background:rgba(255,255,255,.9);box-shadow:0 18px 55px rgba(35,26,78,.045)}
.legal-page .legal-section-card h2{margin:0 0 16px;font-size:clamp(24px,2.2vw,34px);line-height:1.08;letter-spacing:-.035em;color:#141320}
.legal-page .legal-section-card h3{margin:24px 0 8px;font-size:18px;color:#141320}
.legal-page .legal-section-card p,.legal-page .legal-section-card li{font-size:15px;line-height:1.82;color:#514d61}
.legal-page .legal-section-card p{margin:0 0 14px}.legal-page .legal-section-card p:last-child{margin-bottom:0}
.legal-page .legal-section-card ul,.legal-page .legal-section-card ol{margin:12px 0 18px;padding-inline-start:22px;display:grid;gap:7px}
.legal-page .legal-section-card a{color:#5B3FC4;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.legal-page .legal-section-card strong{color:#28243a}
.rtl-page .legal-toc a:hover{transform:translateX(-2px)}
.rtl-page .legal-section-card,.rtl-page .legal-toc{text-align:right}
.rtl-page .legal-section-card p,.rtl-page .legal-section-card li{font-family:'Noto Sans Arabic','Inter',sans-serif;line-height:1.95}
.rtl-page .legal-section-card h2,.rtl-page .legal-section-card h3{font-family:'Noto Sans Arabic','Inter',sans-serif;letter-spacing:0}
@media(max-width:980px){.legal-page .legal-layout{display:block}.legal-page .legal-toc{position:relative;top:auto;max-height:none;margin-bottom:20px;display:flex;gap:8px;overflow-x:auto;white-space:nowrap}.legal-page .legal-toc .section-kicker{display:none}.legal-page .legal-toc a{flex:0 0 auto}.legal-page .legal-hero h1{font-size:clamp(42px,12vw,72px)}}


/* V34 — legal visibility, current footer coverage, and above-fold stability. */
.homepage-footer .footer-links.footer-links-all {
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 30px;
  min-width: min(760px, 100%);
}
.homepage-footer .footer-links.footer-links-all > div:last-child { grid-column: auto; }

/* Never allow the homepage hero or legal body to disappear because an observer did not fire. */
.motion-ready .approved-hero .reveal,
.motion-ready .legal-page .reveal,
.approved-hero .reveal,
.legal-page .reveal {
  opacity: 1 !important;
  transform: none !important;
}
.legal-page .legal-content-section { min-height: 420px; }

@media (max-width: 1000px) {
  .homepage-footer .footer-links.footer-links-all { grid-template-columns: repeat(2,minmax(0,1fr)); min-width:0; }
}
@media (max-width: 620px) {
  .homepage-footer .footer-links.footer-links-all { grid-template-columns: 1fr 1fr; }
  .homepage-footer .footer-links.footer-links-all > div:last-child { grid-column:auto; }
}
@media (max-width: 430px) {
  .homepage-footer .footer-links.footer-links-all { grid-template-columns: 1fr; }
}
\n\n/* ============================================================\n   V35 — pricing polish + in-page signup plan picker\n   ============================================================ */\n.reference-plan-card{\n  position:relative;\n  isolation:isolate;\n  transition:transform .28s cubic-bezier(.2,.75,.25,1),border-color .28s ease,box-shadow .28s ease;\n}\n.reference-plan-card::after{\n  content:"";\n  position:absolute;\n  inset:-1px;\n  border-radius:inherit;\n  pointer-events:none;\n  background:linear-gradient(125deg,transparent 18%,rgba(124,92,228,.08) 48%,transparent 74%);\n  opacity:0;\n  transform:translateX(-8px);\n  transition:opacity .28s ease,transform .35s ease;\n  z-index:-1;\n}\n.reference-plan-card:hover{\n  transform:translateY(-7px);\n  border-color:rgba(124,92,228,.22);\n  box-shadow:0 28px 60px rgba(91,63,196,.10);\n}\n.reference-plan-card:hover::after{opacity:1;transform:translateX(8px)}\n.audience-panel.active{animation:pricingPanelIn .28s cubic-bezier(.2,.75,.25,1) both}\n@keyframes pricingPanelIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}\n.free-price-row{align-items:center}\n.reference-free-note{\n  margin-inline-start:6px;\n  padding:6px 10px;\n  border-radius:999px;\n  background:#F1ECFD;\n  color:var(--brand-deep);\n  font-size:11px;\n  font-weight:800;\n}\n.reference-pricing-ar .free-price-row{direction:rtl}\n.reference-pricing-ar .reference-price-period{direction:rtl;unicode-bidi:plaintext}\n.reference-pricing-ar .reference-plan-title h3{font-family:"Noto Sans Arabic","IBM Plex Sans Arabic",Tahoma,sans-serif}\n.reference-pricing-ar .reference-plan-cta{font-family:"Noto Sans Arabic","IBM Plex Sans Arabic",Tahoma,sans-serif}\n\n.signup-plan-box{\n  position:relative;\n  overflow:hidden;\n  grid-template-columns:1fr 1fr auto;\n  gap:14px;\n  transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;\n}\n.signup-plan-box::before{\n  content:"";position:absolute;inset:0;pointer-events:none;\n  background:radial-gradient(circle at 84% 20%,rgba(124,92,228,.12),transparent 34%);\n  opacity:.45;\n}\n.signup-plan-box:hover{border-color:rgba(124,92,228,.28);box-shadow:0 16px 32px rgba(91,63,196,.08);transform:translateY(-1px)}\n.signup-plan-box > *{position:relative;z-index:1}\n.signup-plan-change{\n  min-height:40px;padding:0 16px;border:1px solid rgba(124,92,228,.18);border-radius:999px;\n  background:#fff;color:var(--brand-deep);font:inherit;font-size:12px;font-weight:800;cursor:pointer;\n  box-shadow:0 6px 14px rgba(91,63,196,.06);\n  transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;\n}\n.signup-plan-change:hover{transform:translateY(-2px);background:var(--brand);color:#fff;box-shadow:0 10px 22px rgba(91,63,196,.18)}\n.signup-plan-box.plan-updated{animation:planBoxUpdated .5s cubic-bezier(.2,.8,.25,1)}\n@keyframes planBoxUpdated{0%{box-shadow:0 0 0 0 rgba(124,92,228,.32)}55%{box-shadow:0 0 0 8px rgba(124,92,228,.07)}100%{box-shadow:0 0 0 0 rgba(124,92,228,0)}}\n\n.plan-picker-modal{\n  position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:22px;\n  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,visibility .22s ease;\n}\n.plan-picker-modal.is-open{opacity:1;visibility:visible;pointer-events:auto}\n.plan-picker-backdrop{position:absolute;inset:0;border:0;background:rgba(20,19,32,.28);backdrop-filter:blur(9px);cursor:default}\n.plan-picker-dialog{\n  position:relative;width:min(620px,100%);padding:28px;border:1px solid rgba(124,92,228,.14);border-radius:28px;\n  background:rgba(255,255,255,.97);box-shadow:0 32px 90px rgba(20,19,32,.20);\n  transform:translateY(16px) scale(.975);opacity:0;\n  transition:transform .26s cubic-bezier(.2,.8,.25,1),opacity .2s ease;\n}\n.plan-picker-modal.is-open .plan-picker-dialog{transform:none;opacity:1}\n.plan-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:22px;margin-bottom:22px}\n.plan-picker-head h3{margin:10px 0 6px;font-size:30px;letter-spacing:-.035em}\n.plan-picker-head p{margin:0;max-width:440px;color:var(--muted);font-size:14px;line-height:1.55}\n.plan-picker-close{width:40px;height:40px;flex:0 0 40px;border:1px solid rgba(20,19,32,.08);border-radius:50%;background:#fff;font-size:26px;line-height:1;cursor:pointer;transition:transform .18s ease,background .18s ease}\n.plan-picker-close:hover{transform:rotate(5deg) scale(1.05);background:#f7f4ff}\n.plan-picker-billing{display:flex;width:max-content;padding:4px;margin-bottom:18px;border:1px solid rgba(20,19,32,.07);border-radius:999px;background:#f3f1f5}\n.plan-picker-billing-btn{min-width:92px;height:38px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:#7a7480;font:inherit;font-size:13px;font-weight:800;cursor:pointer;transition:background .18s ease,color .18s ease,box-shadow .18s ease}\n.plan-picker-billing-btn.active{background:#fff;color:var(--ink);box-shadow:0 4px 12px rgba(20,19,32,.08)}\n.plan-picker-options{display:grid;gap:10px}\n.plan-picker-option{\n  width:100%;min-height:82px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;\n  border:1px solid rgba(20,19,32,.08);border-radius:19px;background:#fff;text-align:left;color:var(--ink);font:inherit;cursor:pointer;\n  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;\n}\n.plan-picker-option:hover{transform:translateY(-3px);border-color:rgba(124,92,228,.25);box-shadow:0 16px 30px rgba(91,63,196,.08);background:linear-gradient(135deg,#fff,#faf8ff)}\n.plan-picker-option.selected{border-color:rgba(124,92,228,.42);box-shadow:inset 0 0 0 1px rgba(124,92,228,.16),0 14px 30px rgba(91,63,196,.08)}\n.plan-picker-option span{display:grid;gap:4px}\n.plan-picker-option strong{font-size:18px}\n.plan-picker-option small{color:var(--muted);font-size:12px}\n.plan-picker-option b{font-size:14px;color:var(--brand-deep);white-space:nowrap}\n.plan-picker-enterprise{display:flex;justify-content:center;gap:9px;margin-top:18px;padding-top:17px;border-top:1px solid rgba(20,19,32,.07);color:var(--brand-deep);font-size:13px;font-weight:800}\nbody.plan-picker-open{overflow:hidden}\nhtml[dir="rtl"] .plan-picker-dialog{text-align:right}\nhtml[dir="rtl"] .plan-picker-head h3{font-family:"Noto Sans Arabic","IBM Plex Sans Arabic",Tahoma,sans-serif;letter-spacing:0}\nhtml[dir="rtl"] .plan-picker-option{text-align:right}\nhtml[dir="rtl"] .plan-picker-option b{direction:rtl;unicode-bidi:plaintext}\nhtml[dir="rtl"] .signup-plan-change{font-family:"Noto Sans Arabic","IBM Plex Sans Arabic",Tahoma,sans-serif}\n@media(max-width:760px){\n  .signup-plan-box{grid-template-columns:1fr 1fr}.signup-plan-change{grid-column:1/-1}\n  .plan-picker-modal{padding:14px}.plan-picker-dialog{padding:22px 18px;border-radius:23px}.plan-picker-head h3{font-size:25px}\n  .plan-picker-option{min-height:76px;padding:14px}.plan-picker-option b{font-size:12px}.plan-picker-billing{width:100%}.plan-picker-billing-btn{flex:1}\n}\n

/* ============================================================
   V36 — DIRECT PRICING REDIRECT + IDENTICAL EN/AR BRAND LOCKUP
   ============================================================ */
/* The SpoonIndex lockup must render identically on English and Arabic pages. */
.brand.brand-real,
.footer-brand-link {
  direction:ltr !important;
  unicode-bidi:isolate;
  flex-direction:row !important;
  text-align:left !important;
  font-family:"DM Sans","Inter",system-ui,sans-serif !important;
}
.brand-copy,
.footer-wordmark,
.brand-copy strong,
.brand-copy small,
.footer-wordmark strong,
.footer-wordmark small {
  direction:ltr !important;
  unicode-bidi:isolate;
  text-align:left !important;
  font-family:"DM Sans","Inter",system-ui,sans-serif !important;
}
.site-header .brand.brand-real {
  width:286px !important;
  min-width:286px !important;
  max-width:286px !important;
  gap:13px !important;
}
.site-header .brand-logo-img {
  width:38px !important;
  height:38px !important;
  flex:0 0 38px !important;
  object-fit:contain;
}
.site-header .brand-copy {
  width:228px !important;
  min-width:228px !important;
}
.site-header .brand-copy strong {
  font-size:21px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:-.045em !important;
  white-space:nowrap !important;
}
.site-header .brand-copy small {
  display:block !important;
  width:max-content !important;
  margin-top:5px !important;
  font-size:7px !important;
  line-height:1.15 !important;
  letter-spacing:.18em !important;
  white-space:nowrap !important;
}
html[dir="rtl"] .site-header .brand.brand-real,
html[dir="rtl"] .footer-brand-link { direction:ltr !important; }

/* Selected-plan panel: premium static summary; changing the plan opens Pricing. */
.signup-plan-box {
  min-height:112px;
  padding:22px 24px !important;
  border:1px solid rgba(124,92,228,.16) !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 86% 10%,rgba(124,92,228,.10),transparent 32%),
    radial-gradient(circle at 8% 96%,rgba(184,163,255,.13),transparent 30%),
    linear-gradient(135deg,#fff 0%,#fbf9ff 58%,#f7f3ff 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 12px 34px rgba(91,63,196,.055);
  overflow:hidden;
}
.signup-plan-box::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.42;
  background:
    repeating-radial-gradient(ellipse at 5% 10%,transparent 0 15px,rgba(124,92,228,.055) 16px 17px,transparent 18px 25px),
    repeating-radial-gradient(ellipse at 96% 88%,transparent 0 15px,rgba(124,92,228,.05) 16px 17px,transparent 18px 25px);
  mask-image:linear-gradient(90deg,#000 0 17%,transparent 28% 72%,#000 83% 100%);
}
.signup-plan-box > div small {
  color:#9a94a6 !important;
  font-size:10px !important;
  letter-spacing:.12em !important;
  font-weight:600;
}
.signup-plan-box > div strong {
  display:block;
  margin-top:7px;
  color:var(--ink);
  font-size:18px !important;
  line-height:1.2;
  font-weight:800;
}
.signup-plan-change.signup-plan-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 18px;
  border:1px solid rgba(124,92,228,.16);
  border-radius:999px;
  background:rgba(255,255,255,.82);
  color:var(--brand-deep);
  font-size:13px;
  font-weight:800;
  box-shadow:0 8px 22px rgba(91,63,196,.08);
  transition:transform .2s var(--ease),background .2s ease,color .2s ease,box-shadow .2s ease;
}
.signup-plan-change.signup-plan-link:hover {
  transform:translateY(-2px);
  background:linear-gradient(135deg,#8568E8,#6D4FE0);
  color:#fff;
  box-shadow:0 13px 30px rgba(91,63,196,.20);
}
html[dir="rtl"] .signup-plan-box {
  grid-template-columns:1fr 1fr auto !important;
  text-align:right;
}
html[dir="rtl"] .signup-plan-box > div strong,
html[dir="rtl"] .signup-plan-box > div small {
  font-family:"Noto Sans Arabic","IBM Plex Sans Arabic",Tahoma,sans-serif !important;
  letter-spacing:0 !important;
}
html[dir="rtl"] .signup-plan-change.signup-plan-link {
  font-family:"Noto Sans Arabic","IBM Plex Sans Arabic",Tahoma,sans-serif !important;
}
/* The old V35 picker no longer exists. */
.plan-picker-modal { display:none !important; }
body.plan-picker-open { overflow:auto !important; }

@media(max-width:1080px){
  .site-header .brand.brand-real{width:250px !important;min-width:250px !important;max-width:250px !important}
  .site-header .brand-copy{width:198px !important;min-width:198px !important}
  .site-header .brand-copy strong{font-size:19px !important}
  .site-header .brand-copy small{font-size:6.5px !important;letter-spacing:.15em !important}
}
@media(max-width:760px){
  .signup-plan-box,
  html[dir="rtl"] .signup-plan-box { grid-template-columns:1fr 1fr !important; }
  .signup-plan-change.signup-plan-link { grid-column:1/-1; width:100%; }
}
@media(max-width:620px){
  .site-header .brand.brand-real{width:auto !important;min-width:0 !important;max-width:none !important}
  .site-header .brand-copy{width:auto !important;min-width:0 !important}
  .site-header .brand-copy small{display:none !important}
}

/* ============================================================
   V37 — CLICK TESTIMONIALS + AUTO-ROTATING USE CASES
   ============================================================ */

/* Use-case timer: advances automatically until the visitor selects a tab. */
.use-case-grid.auto-usecase .use-tab {
  position:relative;
  overflow:hidden;
}
.use-case-grid.auto-usecase .use-tab::after {
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  height:2px;
  width:100%;
  transform:scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg,#7C5CE4,#ff5d88,#d976e8);
  opacity:0;
}
.use-case-grid.auto-usecase .use-tab.active.timer-reset::after {
  opacity:1;
  animation:usecaseTimer 6.2s linear forwards;
}
.use-case-grid.manual-usecase .use-tab::after { display:none !important; }
@keyframes usecaseTimer { to { transform:scaleX(1); } }
html[dir="rtl"] .use-case-grid.auto-usecase .use-tab::after {
  left:auto;
  right:0;
  transform-origin:right center;
}

/* Live mini conversation inside each use-case scene. */
.usecase-live-sheet {
  top:10%;
  width:min(520px,calc(100% - 42px));
  padding:22px 24px 24px;
  overflow:hidden;
  transform:translateX(-50%) translateY(8px) scale(.985);
}
.usecase-card.active .usecase-live-sheet {
  animation:usecaseSheetIn .62s cubic-bezier(.18,.82,.22,1) both;
}
.usecase-sequence {
  display:grid;
  gap:9px;
  margin:0 0 18px;
}
.sequence-bubble {
  width:fit-content;
  max-width:88%;
  padding:10px 13px;
  border-radius:14px;
  font-size:13px;
  line-height:1.35;
  opacity:0;
  transform:translateY(8px) scale(.985);
}
.sequence-user {
  justify-self:end;
  background:#fff;
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 8px 24px rgba(20,19,32,.05);
}
.sequence-ai {
  justify-self:start;
  background:#f2edff;
  color:#3f3755;
}
.sequence-status {
  justify-self:start;
  color:#766f82;
  font-size:11px;
  font-weight:700;
  opacity:0;
  transform:translateY(5px);
}
.sequence-status b { color:#5B3FC4; }
.usecase-card.active.sequence-restart .sequence-user { animation:sequenceBubbleIn .4s .20s both; }
.usecase-card.active.sequence-restart .sequence-ai { animation:sequenceBubbleIn .46s 1.05s both; }
.usecase-card.active.sequence-restart .sequence-status { animation:sequenceStatusIn .4s 1.82s both; }
.usecase-card.active.sequence-restart h4 { animation:sequenceHeadlineIn .48s 2.14s both; }
.usecase-card.active.sequence-restart .sheet-lines { animation:sequenceLinesIn .55s 2.35s both; }
.usecase-card:not(.active) .sequence-bubble,
.usecase-card:not(.active) .sequence-status { opacity:0; }
@keyframes usecaseSheetIn {
  from { opacity:.45; transform:translateX(-50%) translateY(22px) scale(.975); }
  to { opacity:1; transform:translateX(-50%) translateY(8px) scale(.985); }
}
@keyframes sequenceBubbleIn {
  from { opacity:0; transform:translateY(10px) scale(.985); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes sequenceStatusIn {
  from { opacity:0; transform:translateY(5px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes sequenceHeadlineIn {
  from { opacity:.2; transform:translateY(6px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes sequenceLinesIn {
  from { opacity:.22; filter:blur(2px); }
  to { opacity:1; filter:blur(0); }
}
html[dir="rtl"] .sequence-user { justify-self:start; text-align:right; }
html[dir="rtl"] .sequence-ai,
html[dir="rtl"] .sequence-status { justify-self:end; text-align:right; }
html[dir="rtl"] .usecase-live-sheet { transform:translateX(50%) translateY(8px) scale(.985); left:auto; right:50%; }
html[dir="rtl"] .usecase-card.active .usecase-live-sheet { animation:usecaseSheetInRtl .62s cubic-bezier(.18,.82,.22,1) both; }
@keyframes usecaseSheetInRtl {
  from { opacity:.45; transform:translateX(50%) translateY(22px) scale(.975); }
  to { opacity:1; transform:translateX(50%) translateY(8px) scale(.985); }
}

/* Testimonial interaction is now click-only — no drag state, no grab cursor. */
.testimonial-stack .stack-card {
  cursor:pointer !important;
  touch-action:manipulation !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  transition:transform .54s cubic-bezier(.2,.82,.24,1), box-shadow .42s ease, opacity .32s ease !important;
}
.testimonial-stack .stack-card.is-top {
  cursor:pointer !important;
}
.testimonial-stack .stack-card.is-top:hover {
  box-shadow:0 36px 76px rgba(20,19,32,.18) !important;
  transform:translate3d(0,-4px,0) scale(1.003) rotate(0deg) !important;
}
.testimonial-stack.is-card-cycling .stack-card.is-top:hover {
  box-shadow:0 30px 66px rgba(20,19,32,.16) !important;
}
.testimonial-stack .stack-card:focus-visible {
  outline:3px solid rgba(124,92,228,.35);
  outline-offset:5px;
}
.testimonial-stack .stack-card.is-moving-back {
  box-shadow:0 22px 54px rgba(20,19,32,.10) !important;
}
@media (prefers-reduced-motion: reduce) {
  .use-case-grid.auto-usecase .use-tab.active.timer-reset::after { animation:none; transform:scaleX(1); }
  .usecase-card.active.sequence-restart * { animation-duration:.01ms !important; animation-delay:0ms !important; }
  .testimonial-stack .stack-card { transition-duration:.01ms !important; }
}


/* ============================================================
   V38 — TESTIMONIAL QUEUE, PRICING SPACING, DATA SCHEMA, RESET
   ============================================================ */

/* Pricing starts directly under the header. */
body.pricing-page main {
  padding-top:0 !important;
  margin-top:0 !important;
}
body.pricing-page .reference-pricing-shell {
  margin-top:0 !important;
  padding-top:18px !important;
}
body.pricing-page .reference-pricing-head {
  margin-top:0 !important;
}

/* True click queue: more visible depth and clean click feedback. */
.testimonial-stack {
  overflow:visible !important;
  perspective:1200px;
}
.testimonial-stack .stack-card {
  transform-origin:50% 54% !important;
  transition:transform .72s cubic-bezier(.18,.84,.22,1), box-shadow .45s ease, opacity .32s ease !important;
  will-change:transform;
}
.testimonial-stack .stack-card.is-top {
  box-shadow:0 30px 66px rgba(20,19,32,.16) !important;
}
.testimonial-stack .stack-card.is-top:hover {
  transform:translate3d(0,-5px,0) scale(1.004) rotate(0deg) !important;
  box-shadow:0 38px 82px rgba(20,19,32,.19) !important;
}
.testimonial-stack.is-card-cycling .stack-card.is-top:hover {
  transform:none !important;
}
.testimonial-stack.is-card-cycling .stack-card { pointer-events:none !important; }
.testimonial-stack .stack-card.is-next { filter:saturate(.98); }
.testimonial-stack .stack-card.is-third { filter:saturate(.95); }

/* ---------------- Data Schema ---------------- */
.schema-page main {
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
}
.schema-v38-hero,
.schema-v38-section,
.schema-v38-evidence,
.schema-v38-cta {
  width:min(1460px,calc(100% - 40px));
  margin-left:auto;
  margin-right:auto;
}
.schema-v38-hero {
  min-height:690px;
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(620px,1.12fr);
  gap:52px;
  align-items:center;
  padding:54px 58px;
  margin-top:18px;
  border-radius:36px;
  border:1px solid rgba(20,19,32,.075);
  background:
    radial-gradient(circle at 86% 8%,rgba(124,92,228,.16),transparent 29%),
    radial-gradient(circle at 8% 92%,rgba(255,102,145,.07),transparent 27%),
    linear-gradient(145deg,#fff,#fbfaff);
  box-shadow:0 28px 76px rgba(20,19,32,.055);
  overflow:hidden;
  position:relative;
}
.schema-v38-hero::before {
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(124,92,228,.034) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,228,.034) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 88%);
}
.schema-v38-copy {position:relative;z-index:2}
.schema-v38-copy h1 {
  margin:22px 0 20px;
  max-width:690px;
  font-family:"Inter",system-ui,sans-serif !important;
  font-size:clamp(56px,5.4vw,82px);
  line-height:.94;
  letter-spacing:-.064em;
  font-weight:690;
}
html[dir="rtl"] .schema-v38-copy h1 {
  font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif !important;
  letter-spacing:-.025em;
  line-height:1.08;
}
.schema-v38-copy>p {max-width:680px;margin:0;color:var(--muted);font-size:17px;line-height:1.72}
.schema-v38-proof {display:flex;flex-wrap:wrap;gap:9px;margin-top:27px}
.schema-v38-proof span {padding:9px 13px;border:1px solid rgba(20,19,32,.075);border-radius:999px;background:rgba(255,255,255,.86);box-shadow:0 8px 20px rgba(20,19,32,.035);font-size:10.5px;font-weight:700}
.schema-v38-board {
  position:relative;min-height:500px;border-radius:30px;background:rgba(255,255,255,.66);border:1px solid rgba(124,92,228,.12);box-shadow:0 28px 70px rgba(72,52,117,.09),inset 0 1px 0 rgba(255,255,255,.9);overflow:hidden;z-index:2
}
.schema-v38-board::before {content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 48%,rgba(124,92,228,.12),transparent 31%),linear-gradient(rgba(124,92,228,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,228,.04) 1px,transparent 1px);background-size:auto,38px 38px,38px 38px}
.schema-v38-links {position:absolute;inset:5%;width:90%;height:90%;z-index:1}
.schema-v38-links path {fill:none;stroke:rgba(124,92,228,.24);stroke-width:2.2;stroke-dasharray:8 10;animation:schemaDash 16s linear infinite}
.schema-node {position:absolute;width:154px;min-height:94px;padding:15px;border-radius:19px;background:rgba(255,255,255,.95);border:1px solid rgba(20,19,32,.075);box-shadow:0 16px 35px rgba(20,19,32,.07);z-index:3;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;animation:schemaFloat 7s ease-in-out infinite}
.schema-node:hover {transform:translateY(-7px) scale(1.015);border-color:rgba(124,92,228,.24);box-shadow:0 24px 48px rgba(72,52,117,.13)}
.schema-node small{display:block;color:#948d9e;font-size:8.5px;font-weight:800;letter-spacing:.06em;margin-bottom:8px}.schema-node strong{display:block;font-size:15px;margin-bottom:5px}.schema-node span{display:block;color:#817a89;font-size:9.5px;line-height:1.4}
.schema-node.active{background:linear-gradient(145deg,#8266e7,#6544d0);color:#fff;border-color:transparent}.schema-node.active small,.schema-node.active span{color:rgba(255,255,255,.72)}
.sn-brand{left:5%;top:9%;animation-delay:-1s}.sn-source{left:5%;bottom:9%;animation-delay:-4s}.sn-branch{left:39%;top:36%;animation-delay:-2s}.sn-menu{right:5%;top:8%;animation-delay:-3s}.sn-item{right:5%;bottom:9%;animation-delay:-5s}.sn-snapshot{left:39%;bottom:6%;animation-delay:-6s}
.schema-flow-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:#7c5ce4;box-shadow:0 0 0 8px rgba(124,92,228,.08);z-index:2;animation:schemaPulse 3s ease-in-out infinite}.sf1{left:30%;top:31%}.sf2{right:29%;top:29%;animation-delay:-1s}.sf3{right:30%;bottom:27%;animation-delay:-2s}
.schema-v38-section{padding:105px 8px 24px}.schema-v38-head{max-width:820px;margin:0 auto 46px;text-align:center}.schema-v38-head h2{margin:12px 0 14px;font-size:clamp(44px,4.6vw,66px);line-height:1;letter-spacing:-.055em;font-family:"Inter",system-ui,sans-serif}.schema-v38-head p{margin:0;color:var(--muted);line-height:1.7}.schema-v38-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.schema-v38-card{position:relative;min-height:300px;padding:26px;border-radius:25px;border:1px solid rgba(20,19,32,.08);background:linear-gradient(180deg,#fff,#fcfbff);overflow:hidden;transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease}.schema-v38-card::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-85px;bottom:-90px;background:radial-gradient(circle,rgba(124,92,228,.13),transparent 70%)}.schema-v38-card:hover{transform:translateY(-7px);border-color:rgba(124,92,228,.2);box-shadow:0 24px 54px rgba(20,19,32,.075)}.schema-v38-card>b{position:absolute;right:20px;top:20px;color:#aaa3af;font-size:10px;letter-spacing:.08em}.schema-card-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:15px;background:#f0eaff;color:#684bd3;font-size:22px;margin-bottom:36px;box-shadow:inset 0 0 0 1px rgba(124,92,228,.08)}.schema-v38-card h3{margin:0 0 10px;font-size:24px;letter-spacing:-.04em}.schema-v38-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.65;max-width:430px}.schema-v38-card .field-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:22px}.schema-v38-card .field-chips span{padding:7px 9px;border-radius:999px;background:#f5f2fa;color:#6f6877;font-size:9px;font-weight:700}
html[dir="rtl"] .schema-v38-card>b{right:auto;left:20px}.schema-v38-evidence{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:60px;align-items:center;margin-top:96px;padding:58px;border-radius:34px;background:#0d0c11;color:#fff;position:relative;overflow:hidden}.schema-v38-evidence::after{content:"";position:absolute;width:480px;height:480px;border-radius:50%;right:-180px;top:-220px;background:radial-gradient(circle,rgba(124,92,228,.38),transparent 68%)}.schema-v38-evidence>div{position:relative;z-index:2}.schema-v38-evidence h2{margin:18px 0 15px;font-size:clamp(42px,4.2vw,64px);line-height:.98;letter-spacing:-.055em}.schema-v38-evidence p{margin:0;color:rgba(255,255,255,.67);line-height:1.7}.schema-merge-v38{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.merge-source,.merge-result{padding:16px;border-radius:16px;background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px)}.merge-source small,.merge-result small{display:block;color:rgba(255,255,255,.48);font-size:8.5px;margin-bottom:6px}.merge-source strong,.merge-result strong{display:block;font-size:13px}.merge-source span,.merge-result span{display:block;margin-top:5px;color:rgba(255,255,255,.65);font-size:9px}.merge-connector{grid-column:1/-1;text-align:center;color:#a58cf6;font-size:28px;line-height:1}.merge-result{grid-column:1/-1;background:linear-gradient(135deg,rgba(124,92,228,.45),rgba(255,255,255,.08));text-align:center;padding:19px}.schema-v38-cta{margin-top:95px !important;margin-bottom:72px !important}.schema-v38-cta h2{max-width:760px;margin-left:auto;margin-right:auto}
@keyframes schemaDash{to{stroke-dashoffset:-180}}@keyframes schemaPulse{0%,100%{transform:scale(.78);opacity:.5}50%{transform:scale(1.2);opacity:1}}@keyframes schemaFloat{0%,100%{margin-top:0}50%{margin-top:-6px}}

/* ---------------- Forgot Password ---------------- */
.reset-shell{min-height:700px}.reset-visual{background:radial-gradient(circle at 20% 15%,rgba(255,110,151,.10),transparent 28%),radial-gradient(circle at 78% 16%,rgba(124,92,228,.17),transparent 29%),linear-gradient(145deg,#fbfaff,#f6f2ff 60%,#fcf9ff)}.reset-visual-card{position:relative;height:270px;margin:38px 0 24px;border-radius:28px;background:rgba(255,255,255,.6);border:1px solid rgba(124,92,228,.11);display:grid;place-items:center;overflow:hidden;box-shadow:0 22px 58px rgba(72,52,117,.07)}.reset-envelope{position:relative;width:170px;height:116px;border-radius:18px;background:linear-gradient(145deg,#fff,#eee8ff);box-shadow:0 24px 48px rgba(84,61,142,.16);border:1px solid rgba(124,92,228,.12);animation:resetFloat 5.2s ease-in-out infinite}.reset-envelope::before,.reset-envelope::after{content:"";position:absolute;left:0;right:0;bottom:0;height:74px}.reset-envelope::before{clip-path:polygon(0 100%,50% 28%,100% 100%);background:#f7f3ff}.reset-envelope-flap{position:absolute;left:0;right:0;top:0;height:76px;clip-path:polygon(0 0,100% 0,50% 82%);background:#ded3fb;transform-origin:top;animation:resetFlap 5.2s ease-in-out infinite}.reset-spark{position:absolute;color:#7c5ce4;font-size:15px;animation:resetSpark 3s ease-in-out infinite}.rs1{left:-35px;top:-18px}.rs2{right:-42px;top:14px;animation-delay:-1s}.rs3{right:-25px;bottom:-28px;animation-delay:-2s}.reset-flow-line{position:absolute;width:180px;height:2px;left:50%;top:75%;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#a891ef,transparent);animation:resetLine 2.6s ease-in-out infinite}.reset-lock{position:absolute;right:11%;bottom:13%;width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:#fff;color:#6548cf;font-weight:900;box-shadow:0 13px 28px rgba(72,52,117,.11);animation:resetLock 4.8s ease-in-out infinite}.reset-card{align-self:center}.reset-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:17px;background:#f0eaff;color:#684bd3;font-size:24px;margin-bottom:22px}.reset-form{margin-top:25px}.reset-success{padding:24px;border-radius:20px;background:linear-gradient(145deg,#f4f0ff,#fff);border:1px solid rgba(124,92,228,.12);animation:resetSuccessIn .45s cubic-bezier(.2,.82,.24,1) both}.reset-success-mark{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:#7c5ce4;color:#fff;font-weight:900;margin-bottom:14px;box-shadow:0 10px 25px rgba(124,92,228,.22)}.reset-success h3{margin:0 0 8px;font-size:24px}.reset-success p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.reset-back{margin-top:24px}.reset-back a{font-weight:700}.auth-submit:disabled{opacity:.72;cursor:wait}
@keyframes resetFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1deg)}}@keyframes resetFlap{0%,24%,100%{transform:rotateX(0)}42%,68%{transform:rotateX(18deg)}}@keyframes resetSpark{0%,100%{transform:scale(.75);opacity:.35}50%{transform:scale(1.15);opacity:1}}@keyframes resetLine{0%,100%{opacity:.3;transform:translateX(-50%) scaleX(.45)}50%{opacity:1;transform:translateX(-50%) scaleX(1)}}@keyframes resetLock{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes resetSuccessIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}

/* Responsive */
@media(max-width:1120px){.schema-v38-hero{grid-template-columns:1fr;padding:48px;min-height:auto}.schema-v38-board{min-height:500px}.schema-v38-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.schema-v38-evidence{grid-template-columns:1fr}.reset-shell{grid-template-columns:1fr}.reset-visual{min-height:auto}}
@media(max-width:720px){body.pricing-page .reference-pricing-shell{padding-top:8px !important}.schema-v38-hero{padding:34px 22px;border-radius:27px}.schema-v38-copy h1{font-size:48px}.schema-v38-board{min-height:590px}.schema-node{width:126px;min-height:84px;padding:12px}.sn-brand{left:4%;top:7%}.sn-menu{right:4%;top:7%}.sn-branch{left:29%;top:34%}.sn-source{left:4%;bottom:7%}.sn-item{right:4%;bottom:7%}.sn-snapshot{left:29%;bottom:25%}.schema-v38-section{padding-top:78px}.schema-v38-grid{grid-template-columns:1fr}.schema-v38-evidence{padding:34px 22px;border-radius:28px}.schema-merge-v38{grid-template-columns:1fr}.merge-connector,.merge-result{grid-column:1}.reset-visual-card{height:230px}.testimonial-note{max-width:92%}}

/* ============================================================
   V39 — CONTINUOUS TESTIMONIAL QUEUE + LIVE FOUR-STAGE SCENES
   ============================================================ */

/* Testimonial cards use independent transform properties in V39 so the
   outgoing card can trace one uninterrupted arc around the stack. */
.testimonial-stack {
  overflow:visible !important;
  perspective:1500px;
}
.testimonial-stack .stack-card {
  transform:none !important;
  transform-origin:center center !important;
  will-change:translate,scale,rotate,box-shadow !important;
  transition:box-shadow .38s ease, filter .38s ease, opacity .28s ease !important;
  backface-visibility:hidden;
}
.testimonial-stack .stack-card.is-top:hover {
  transform:none !important;
  box-shadow:0 39px 84px rgba(20,19,32,.19) !important;
  filter:saturate(1.01);
}
.testimonial-stack.is-card-cycling .stack-card,
.testimonial-stack.is-card-cycling .stack-card.is-top:hover {
  transform:none !important;
  pointer-events:none !important;
}
.testimonial-stack .stack-card.is-moving-back {
  box-shadow:0 24px 58px rgba(20,19,32,.11) !important;
}

/* A scene itself now glides/cross-fades instead of switching abruptly. */
.usecase-card {
  transform:none !important;
  opacity:0;
  translate:0 28px;
  scale:.982;
  filter:blur(5px);
  transition:
    opacity .72s cubic-bezier(.18,.72,.18,1),
    translate .84s cubic-bezier(.16,.78,.18,1),
    scale .84s cubic-bezier(.16,.78,.18,1),
    filter .58s ease !important;
  pointer-events:none;
}
.usecase-card.active {
  opacity:1;
  translate:0 0;
  scale:1;
  filter:blur(0);
  pointer-events:auto;
}
.use-case-grid.auto-usecase .use-tab.active.timer-reset::after {
  animation-duration:7.6s !important;
}

/* Four-stage progress rail: question -> AI response -> sent -> report. */
.sequence-steps {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  margin:-4px 0 14px;
}
.sequence-steps span {
  position:relative;
  overflow:hidden;
  border:1px solid rgba(124,92,228,.11);
  border-radius:999px;
  padding:5px 6px;
  background:rgba(248,246,255,.72);
  color:#9b94a6;
  font-size:9px;
  font-weight:800;
  letter-spacing:.025em;
  text-align:center;
  opacity:.62;
  transform:translateY(3px);
}
.sequence-steps span::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(124,92,228,.13),rgba(255,101,143,.10));
  transform:scaleX(0);
  transform-origin:left center;
  z-index:-1;
}
html[dir="rtl"] .sequence-steps span::before { transform-origin:right center; }
.usecase-card.active.sequence-restart .sequence-steps .step-1 { animation:sequenceStepOn .42s .18s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-2 { animation:sequenceStepOn .42s 1.72s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-3 { animation:sequenceStepOn .42s 2.94s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-4 { animation:sequenceStepOn .42s 3.70s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-1::before { animation:sequenceStepFill .38s .18s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-2::before { animation:sequenceStepFill .38s 1.72s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-3::before { animation:sequenceStepFill .38s 2.94s both; }
.usecase-card.active.sequence-restart .sequence-steps .step-4::before { animation:sequenceStepFill .38s 3.70s both; }

/* Chat flow: prompt, thinking, answer, completion, then the report unfolds. */
.usecase-sequence { gap:8px; }
.sequence-thinking {
  justify-self:start;
  display:flex;
  align-items:center;
  gap:4px;
  width:44px;
  height:26px;
  padding:0 9px;
  border-radius:12px;
  background:#f2edff;
  opacity:0;
  transform:translateY(7px) scale(.97);
}
.sequence-thinking i {
  width:4px;
  height:4px;
  border-radius:50%;
  background:#7C5CE4;
  opacity:.42;
}
.usecase-card.active.sequence-restart .sequence-user {
  animation:sequenceBubbleIn .52s .36s cubic-bezier(.16,.82,.2,1) both;
}
.usecase-card.active.sequence-restart .sequence-thinking {
  animation:sequenceThinkingIn .68s 1.10s cubic-bezier(.18,.78,.2,1) both;
}
.usecase-card.active.sequence-restart .sequence-thinking i:nth-child(1) { animation:sequenceTypingDot .72s 1.18s ease-in-out 2; }
.usecase-card.active.sequence-restart .sequence-thinking i:nth-child(2) { animation:sequenceTypingDot .72s 1.30s ease-in-out 2; }
.usecase-card.active.sequence-restart .sequence-thinking i:nth-child(3) { animation:sequenceTypingDot .72s 1.42s ease-in-out 2; }
.usecase-card.active.sequence-restart .sequence-ai {
  animation:sequenceBubbleIn .58s 1.82s cubic-bezier(.16,.82,.2,1) both;
}
.usecase-card.active.sequence-restart .sequence-status {
  animation:sequenceStatusIn .48s 2.96s cubic-bezier(.16,.82,.2,1) both;
}
.usecase-card.active.sequence-restart .sequence-status b {
  display:inline-block;
  animation:sequenceCheckPulse .52s 3.12s cubic-bezier(.16,.82,.2,1) both;
}
.sequence-report {
  position:relative;
  margin-top:4px;
  padding-top:14px;
  border-top:1px solid rgba(20,19,32,.065);
  opacity:0;
  transform:translateY(12px) scale(.988);
  transform-origin:50% 0;
}
.usecase-card.active.sequence-restart .sequence-report {
  animation:sequenceReportIn .68s 3.68s cubic-bezier(.16,.82,.2,1) both;
}
.usecase-card.active.sequence-restart .sequence-report h4 {
  animation:sequenceHeadlineIn .52s 3.84s cubic-bezier(.16,.82,.2,1) both;
}
.usecase-card.active.sequence-restart .sequence-report .sheet-lines {
  clip-path:inset(0 100% 0 0 round 3px);
  animation:sequenceReportDraw .92s 4.08s cubic-bezier(.18,.74,.2,1) both;
}
html[dir="rtl"] .usecase-card.active.sequence-restart .sequence-report .sheet-lines {
  clip-path:inset(0 0 0 100% round 3px);
  animation-name:sequenceReportDrawRtl;
}
.sequence-report .sheet-lines { position:relative; overflow:hidden; }
.sequence-report .sheet-lines::after {
  content:"";
  position:absolute;
  inset:-10px -40%;
  background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.72) 50%,transparent 65%);
  transform:translateX(-75%);
  opacity:0;
}
.usecase-card.active.sequence-restart .sequence-report .sheet-lines::after {
  animation:sequenceReportShine .9s 4.32s ease-out both;
}

@keyframes sequenceStepOn {
  from { opacity:.62; color:#9b94a6; transform:translateY(3px); border-color:rgba(124,92,228,.11); }
  to { opacity:1; color:#5B3FC4; transform:translateY(0); border-color:rgba(124,92,228,.26); }
}
@keyframes sequenceStepFill { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes sequenceThinkingIn {
  from { opacity:0; transform:translateY(7px) scale(.97); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes sequenceTypingDot {
  0%,100% { opacity:.32; transform:translateY(0); }
  45% { opacity:1; transform:translateY(-3px); }
}
@keyframes sequenceCheckPulse {
  from { opacity:0; transform:scale(.55); }
  55% { opacity:1; transform:scale(1.28); }
  to { opacity:1; transform:scale(1); }
}
@keyframes sequenceReportIn {
  from { opacity:0; transform:translateY(12px) scale(.988); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes sequenceReportDraw {
  from { clip-path:inset(0 100% 0 0 round 3px); filter:blur(1.5px); }
  to { clip-path:inset(0 0 0 0 round 3px); filter:blur(0); }
}
@keyframes sequenceReportDrawRtl {
  from { clip-path:inset(0 0 0 100% round 3px); filter:blur(1.5px); }
  to { clip-path:inset(0 0 0 0 round 3px); filter:blur(0); }
}
@keyframes sequenceReportShine {
  0% { opacity:0; transform:translateX(-75%); }
  18% { opacity:.65; }
  100% { opacity:0; transform:translateX(75%); }
}

html[dir="rtl"] .sequence-thinking { justify-self:end; }
html[dir="rtl"] .sequence-report { text-align:right; }

@media (prefers-reduced-motion: reduce) {
  .testimonial-stack .stack-card { transition-duration:.01ms !important; }
  .usecase-card { transition-duration:.01ms !important; }
  .use-case-grid.auto-usecase .use-tab.active.timer-reset::after { animation:none !important; transform:scaleX(1); }
  .usecase-card.active.sequence-restart .sequence-steps span,
  .usecase-card.active.sequence-restart .sequence-steps span::before,
  .usecase-card.active.sequence-restart .sequence-user,
  .usecase-card.active.sequence-restart .sequence-thinking,
  .usecase-card.active.sequence-restart .sequence-thinking i,
  .usecase-card.active.sequence-restart .sequence-ai,
  .usecase-card.active.sequence-restart .sequence-status,
  .usecase-card.active.sequence-restart .sequence-status b,
  .usecase-card.active.sequence-restart .sequence-report,
  .usecase-card.active.sequence-restart .sequence-report h4,
  .usecase-card.active.sequence-restart .sequence-report .sheet-lines,
  .usecase-card.active.sequence-restart .sequence-report .sheet-lines::after {
    animation-duration:.01ms !important;
    animation-delay:0ms !important;
  }
}

/* ============================================================
   V41 — QUEUE LAYERING, LIVE FEATURE CARDS, INSIGHTS FILTERS,
   AND THE SITEWIDE FOOTER
   ============================================================ */

/* The outgoing testimonial really becomes the back card once it clears the lane. */
.testimonial-stack .stack-card.is-behind {
  z-index:2 !important;
  filter:saturate(.96) brightness(.995) !important;
  box-shadow:0 17px 42px rgba(20,19,32,.065) !important;
}
.testimonial-stack .stack-card.is-incoming-front {
  z-index:86 !important;
  box-shadow:0 31px 70px rgba(20,19,32,.16) !important;
}
.testimonial-stack.is-card-cycling .stack-card.is-behind { pointer-events:none !important; }

/* Keep the staged use-case animation, but never show a labelled progress rail. */
.sequence-steps { display:none !important; }
html[dir="rtl"] .use-case-grid { direction:rtl; }
html[dir="rtl"] .use-case-copy,
html[dir="rtl"] .use-tabs,
html[dir="rtl"] .use-tab { text-align:right; }
html[dir="rtl"] .use-tabs { direction:rtl; }

/* ---------- Home feature cards: each visual behaves like a living product ---------- */
.compact-feature-grid .feature-card {
  transition:transform .35s cubic-bezier(.18,.82,.22,1), box-shadow .35s ease, border-color .35s ease;
}
.compact-feature-grid .feature-card:hover {
  transform:translateY(-5px);
  box-shadow:0 26px 64px rgba(24,18,42,.08);
  border-color:rgba(124,92,228,.14);
}
.compact-area-dark:hover { box-shadow:0 30px 76px rgba(20,19,32,.19) !important; }

.feature-chat-playing .bubble-question-primary {
  animation:featureBubbleIn .48s .08s cubic-bezier(.16,.82,.2,1) both;
}
.feature-chat-playing .bubble-ai {
  animation:featureBubbleIn .52s 1.00s cubic-bezier(.16,.82,.2,1) both;
}
.feature-chat-playing .bubble-question-followup {
  animation:featureBubbleIn .48s 2.05s cubic-bezier(.16,.82,.2,1) both;
}
.feature-chat-playing .mini-input {
  animation:featureInputWake 1.15s 2.68s cubic-bezier(.18,.78,.2,1) both;
}
@keyframes featureBubbleIn {
  from { opacity:0; translate:0 11px; scale:.985; filter:blur(2px); }
  to { opacity:1; translate:0 0; scale:1; filter:blur(0); }
}
@keyframes featureInputWake {
  0% { box-shadow:0 0 0 0 rgba(255,102,145,0); }
  42% { box-shadow:0 0 0 5px rgba(255,102,145,.10),0 11px 28px rgba(255,102,145,.08); }
  100% { box-shadow:0 0 0 0 rgba(255,102,145,0); }
}

/* Adaptive-learning network: flowing paths, pulsing nodes, rotating prompt. */
.compact-area-adaptive .adaptive-network path {
  stroke-dasharray:5 7 !important;
  animation:featureNetworkFlow 8.5s linear infinite;
}
.compact-area-adaptive .adaptive-network path:nth-child(2) { animation-duration:10.5s; animation-direction:reverse; }
.compact-area-adaptive .adaptive-network path:nth-child(3) { animation-duration:9.4s; }
.compact-area-adaptive .adaptive-network path:nth-child(4) { animation-duration:11.2s; animation-direction:reverse; }
.compact-area-adaptive .adaptive-network > i {
  animation:featureNodePulse 3.4s ease-in-out infinite;
}
.compact-area-adaptive .adaptive-network > i:nth-of-type(2){animation-delay:-.8s}
.compact-area-adaptive .adaptive-network > i:nth-of-type(3){animation-delay:-1.6s}
.compact-area-adaptive .adaptive-network > i:nth-of-type(4){animation-delay:-2.4s}
.compact-area-adaptive .adaptive-center {
  animation:featureCenterBreathe 4.6s ease-in-out infinite;
}
.feature-prompt-swap { animation:featurePromptSwap .58s cubic-bezier(.16,.82,.2,1) both; }
@keyframes featureNetworkFlow { to { stroke-dashoffset:-84; } }
@keyframes featureNodePulse {
  0%,100% { scale:.84; opacity:.55; box-shadow:0 0 0 0 rgba(124,92,228,.04); }
  48% { scale:1.16; opacity:1; box-shadow:0 0 0 9px rgba(124,92,228,.075); }
}
@keyframes featureCenterBreathe {
  0%,100% { scale:1; box-shadow:0 14px 30px rgba(124,92,228,.16); }
  50% { scale:1.045; box-shadow:0 19px 42px rgba(124,92,228,.24); }
}
@keyframes featurePromptSwap {
  from { opacity:0; translate:0 7px; filter:blur(2px); }
  to { opacity:1; translate:0 0; filter:blur(0); }
}

/* AI report card: generation shimmer + changing report names. */
.compact-area-reports .mini-task-window {
  overflow:hidden;
}
.compact-area-reports .mini-task-window::after {
  content:"";
  position:absolute;
  inset:-35% -55%;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.84) 50%,transparent 62%);
  translate:-60% 0;
  opacity:0;
  pointer-events:none;
}
.feature-report-playing .mini-task-window::after {
  animation:featureReportSweep 1.25s ease-out both;
}
.feature-report-playing .mini-task-window strong {
  animation:featureReportTitle .62s 1.02s cubic-bezier(.16,.82,.2,1) both;
}
.feature-report-playing .task-lines {
  animation:featureReportLines .95s 1.10s cubic-bezier(.16,.78,.2,1) both;
}
.feature-report-playing .mini-btn {
  animation:featureReportButton .58s 1.05s cubic-bezier(.16,.82,.2,1) both;
}
@keyframes featureReportSweep {
  0% { opacity:0; translate:-60% 0; }
  22% { opacity:.7; }
  100% { opacity:0; translate:70% 0; }
}
@keyframes featureReportTitle {
  from { opacity:.2; translate:0 7px; }
  to { opacity:1; translate:0 0; }
}
@keyframes featureReportLines {
  from { clip-path:inset(0 100% 0 0); opacity:.35; }
  to { clip-path:inset(0 0 0 0); opacity:1; }
}
html[dir="rtl"] .feature-report-playing .task-lines {
  animation-name:featureReportLinesRtl;
}
@keyframes featureReportLinesRtl {
  from { clip-path:inset(0 0 0 100%); opacity:.35; }
  to { clip-path:inset(0 0 0 0); opacity:1; }
}
@keyframes featureReportButton {
  from { scale:.94; opacity:.55; }
  60% { scale:1.045; opacity:1; }
  to { scale:1; opacity:1; }
}

/* Coverage card: scanning line, path flow and pulsing markets. */
.coverage-mini-map { overflow:hidden; }
.coverage-mini-map::after {
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  left:50%;
  top:50%;
  border:1px solid rgba(124,92,228,.22);
  border-radius:50%;
  translate:-50% -50%;
  scale:.28;
  opacity:0;
  animation:featureCoverageScan 4.5s ease-out infinite;
}
.coverage-mini-map path {
  stroke-dasharray:7 7 !important;
  animation:featureCoveragePath 10s linear infinite;
}
.coverage-mini-map .map-p {
  animation:featureMapPoint 3.2s ease-in-out infinite;
}
.coverage-mini-map .m2{animation-delay:-.55s}.coverage-mini-map .m3{animation-delay:-1.1s}.coverage-mini-map .m4{animation-delay:-1.65s}.coverage-mini-map .m5{animation-delay:-2.2s}
.coverage-mini-map .map-label { animation:featureMapLabel 5.6s ease-in-out infinite; }
.coverage-mini-map .ml2 { animation-delay:-2.8s; }
@keyframes featureCoverageScan {
  0% { scale:.28; opacity:0; }
  20% { opacity:.32; }
  100% { scale:1.38; opacity:0; }
}
@keyframes featureCoveragePath { to { stroke-dashoffset:-110; } }
@keyframes featureMapPoint {
  0%,100% { scale:.8; opacity:.55; box-shadow:0 0 0 0 rgba(124,92,228,.08); }
  50% { scale:1.18; opacity:1; box-shadow:0 0 0 8px rgba(124,92,228,.08); }
}
@keyframes featureMapLabel { 0%,100%{opacity:.55;translate:0 0} 50%{opacity:1;translate:0 -3px} }

/* Workflow card: alert feed animates continuously like a live monitor. */
.compact-area-automation .auto-list div {
  position:relative;
  transition:background .35s ease, transform .35s ease, box-shadow .35s ease;
}
.compact-area-automation .auto-list div:nth-child(1){animation:featureAlertFocus 5.4s ease-in-out infinite}
.compact-area-automation .auto-list div:nth-child(2){animation:featureAlertFocus 5.4s 1.8s ease-in-out infinite}
.compact-area-automation .auto-list div:nth-child(3){animation:featureAlertFocus 5.4s 3.6s ease-in-out infinite}
.feature-alert-in { animation:featureAlertIn .58s cubic-bezier(.16,.82,.2,1) both; }
@keyframes featureAlertFocus {
  0%,24%,100% { transform:translateY(0); background:#fff; box-shadow:none; }
  10% { transform:translateY(-3px); background:#fbf8ff; box-shadow:0 13px 30px rgba(91,63,196,.08); }
}
@keyframes featureAlertIn {
  from { opacity:.15; translate:0 9px; }
  to { opacity:1; translate:0 0; }
}

/* ---------- Insights category navigation ---------- */
.insight-category-shell {
  width:min(1440px,calc(100% - 40px));
  margin:30px auto 4px;
  padding:18px 0 10px;
}
.insight-category-row {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.insight-category-btn {
  appearance:none;
  border:1px solid rgba(20,19,32,.075);
  background:#fff;
  color:#24212f;
  min-height:62px;
  padding:9px 17px 9px 10px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  border-radius:16px;
  font:700 13px/1 "Inter","DM Sans",system-ui,sans-serif;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(20,19,32,.035);
  transition:transform .25s cubic-bezier(.18,.82,.22,1),border-color .25s ease,background .25s ease,box-shadow .25s ease;
}
.insight-category-btn:hover {
  transform:translateY(-3px);
  border-color:rgba(124,92,228,.18);
  box-shadow:0 14px 32px rgba(72,52,117,.075);
}
.insight-category-btn.active {
  border-color:rgba(124,92,228,.22);
  background:linear-gradient(145deg,#fbf9ff,#f4efff);
  color:#5B3FC4;
  box-shadow:0 13px 34px rgba(91,63,196,.09);
}
.insight-category-icon {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f5f1ff;
  color:#7C5CE4;
  flex:0 0 auto;
}
.insight-category-icon svg { width:22px;height:22px;fill:currentColor; }
.insight-category-btn.active .insight-category-icon {
  background:#7C5CE4;
  color:#fff;
}
.insight-filter-enter { animation:insightFilterEnter .46s cubic-bezier(.16,.82,.2,1) both; }
.insight-filter-empty { text-align:center;color:var(--muted);padding:50px 20px; }
@keyframes insightFilterEnter { from{opacity:0;translate:0 12px;scale:.99} to{opacity:1;translate:0 0;scale:1} }
html[dir="rtl"] .insight-category-row { direction:rtl; }
html[dir="rtl"] .insight-category-btn {
  font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif;
  padding:9px 10px 9px 17px;
  direction:rtl;
}

/* ---------- Full Emergent-inspired SpoonIndex footer, actually styled ---------- */
.global-footer {
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:92px 0 0 !important;
  padding:0 36px 24px !important;
  border-top:1px solid rgba(20,19,32,.07) !important;
  background:#fff !important;
  color:#191621 !important;
  box-shadow:none !important;
}
.global-footer-main {
  width:min(1510px,100%);
  margin:0 auto;
  padding:72px 0 64px;
  display:grid;
  grid-template-columns:minmax(350px,1.65fr) repeat(4,minmax(125px,.66fr));
  gap:46px;
  align-items:start;
}
.global-footer .footer-brand-edge {
  max-width:390px;
  align-self:start;
}
.global-footer .footer-brand-link {
  display:inline-flex !important;
  align-items:center;
  gap:13px;
  width:auto !important;
  min-width:0 !important;
  flex-basis:auto !important;
  text-decoration:none;
  color:inherit;
  direction:ltr;
}
.global-footer .footer-logo-mark {
  width:44px;
  height:44px;
  object-fit:contain;
  flex:0 0 44px;
}
.global-footer .footer-wordmark { display:flex;flex-direction:column;align-items:flex-start;line-height:1; }
.global-footer .footer-wordmark strong {
  font-family:"Inter","DM Sans",system-ui,sans-serif;
  font-size:25px;
  letter-spacing:-.055em;
  font-weight:800;
  color:#141320;
}
.global-footer .footer-wordmark strong span { color:#87818d; }
.global-footer .footer-wordmark small {
  margin-top:6px;
  font:600 7px/1 "Inter",system-ui,sans-serif;
  letter-spacing:.18em;
  color:#aaa3af;
  white-space:nowrap;
}
.global-footer .footer-brand-edge>p {
  margin:28px 0 0;
  max-width:370px;
  color:#77717e;
  font-size:13px;
  line-height:1.72;
}
.global-footer .footer-column {
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}
.global-footer .footer-column h4 {
  margin:0 0 7px;
  color:#25212c;
  font:800 12px/1.2 "Inter","DM Sans",system-ui,sans-serif;
}
.global-footer .footer-column a {
  color:#817b86 !important;
  text-decoration:none !important;
  font-size:12.5px;
  line-height:1.45;
  transition:color .2s ease,translate .2s ease;
}
.global-footer .footer-column a:hover { color:#5B3FC4 !important;translate:2px 0; }
.global-footer-bottom {
  width:min(1510px,100%);
  margin:0 auto;
  padding:20px 0 3px;
  border-top:1px solid rgba(20,19,32,.07);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:28px;
  align-items:end;
}
.footer-copyright {
  justify-self:start;
  font:700 9px/1.2 "Inter","DM Sans",system-ui,sans-serif;
  letter-spacing:.08em;
  color:#8b8590;
}
.footer-built {
  justify-self:center;
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:3px;
  font-family:"Inter","DM Sans",system-ui,sans-serif;
  text-transform:uppercase;
  letter-spacing:.11em;
  white-space:nowrap;
}
.footer-built span { color:#a19aa7;font-size:8px;font-weight:600; }
.footer-built strong { color:#5d5763;font-size:9px;font-weight:800; }
.footer-socials {
  justify-self:end;
  display:flex;
  align-items:center;
  gap:17px;
}
.footer-social {
  width:21px;
  height:21px;
  display:grid;
  place-items:center;
  color:#7f7984;
  opacity:.78;
  cursor:default;
}
.footer-social svg { width:17px;height:17px;fill:currentColor;display:block; }
.global-footer-ar .global-footer-main {
  direction:rtl;
  grid-template-columns:minmax(350px,1.65fr) repeat(4,minmax(125px,.66fr));
}
.global-footer-ar .footer-brand-edge {
  text-align:right;
  justify-self:stretch;
}
.global-footer-ar .footer-brand-link { margin-right:0;margin-left:auto; }
.global-footer-ar .footer-brand-edge>p { margin-left:auto;margin-right:0;text-align:right; }
.global-footer-ar .footer-column { text-align:right;align-items:flex-start; }
.global-footer-ar .footer-column h4,
.global-footer-ar .footer-column a { font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif; }
.global-footer-ar .footer-column a:hover { translate:-2px 0; }
.global-footer-ar .global-footer-bottom { direction:rtl; }
.global-footer-ar .footer-copyright { justify-self:start; }
.global-footer-ar .footer-socials { justify-self:end; }

@media (max-width:1050px) {
  .global-footer-main { grid-template-columns:1.35fr repeat(2,1fr); }
  .global-footer .footer-brand-edge { grid-row:span 2; }
  .global-footer-ar .global-footer-main { grid-template-columns:1.35fr repeat(2,1fr); }
}
@media (max-width:720px) {
  .global-footer { padding:0 22px 22px !important;margin-top:68px !important; }
  .global-footer-main,
  .global-footer-ar .global-footer-main {
    grid-template-columns:1fr 1fr;
    gap:34px 24px;
    padding:52px 0 46px;
  }
  .global-footer .footer-brand-edge { grid-column:1/-1;grid-row:auto;max-width:100%; }
  .global-footer-bottom { grid-template-columns:1fr auto;row-gap:18px;align-items:center; }
  .footer-built { grid-column:1/-1;grid-row:1; }
  .footer-copyright { grid-column:1;grid-row:2; }
  .footer-socials { grid-column:2;grid-row:2; }
  .insight-category-shell { width:min(100% - 24px,1440px);overflow-x:auto;padding-bottom:6px; }
  .insight-category-row { justify-content:flex-start;flex-wrap:nowrap;width:max-content; }
  .insight-category-btn { min-height:56px; }
}

@media (prefers-reduced-motion:reduce) {
  .feature-chat-playing *, .feature-prompt-swap,
  .compact-area-adaptive .adaptive-network path,
  .compact-area-adaptive .adaptive-network > i,
  .compact-area-adaptive .adaptive-center,
  .feature-report-playing *, .coverage-mini-map::after,
  .coverage-mini-map path,.coverage-mini-map .map-p,
  .coverage-mini-map .map-label,.compact-area-automation .auto-list div,
  .feature-alert-in { animation:none !important; }
}

/* ============================================================
   V42 — IDENTICAL BILINGUAL WORDMARK + TRUE RTL NAV + CLEAN AI TYPING
   ============================================================ */

/* Lock the SpoonIndex header lockup so Arabic page fonts/direction can never
   change the Latin wordmark or its subtitle. EN and AR render identically. */
.site-header .brand.brand-real,
.hero-header .brand.brand-real,
html[dir="rtl"] .site-header .brand.brand-real,
html[dir="rtl"] .hero-header .brand.brand-real {
  direction:ltr !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  font-family:"Inter","DM Sans",Arial,sans-serif !important;
}
.site-header .brand-logo-img,
.hero-header .brand-logo-img,
html[dir="rtl"] .site-header .brand-logo-img,
html[dir="rtl"] .hero-header .brand-logo-img {
  width:38px !important;
  height:38px !important;
  flex:0 0 38px !important;
  object-fit:contain !important;
}
.site-header .brand-copy,
.hero-header .brand-copy,
html[dir="rtl"] .site-header .brand-copy,
html[dir="rtl"] .hero-header .brand-copy {
  direction:ltr !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  line-height:1 !important;
  font-family:"Inter","DM Sans",Arial,sans-serif !important;
}
.site-header .brand-copy strong,
.hero-header .brand-copy strong,
html[dir="rtl"] .site-header .brand-copy strong,
html[dir="rtl"] .hero-header .brand-copy strong {
  margin:0 !important;
  padding:0 !important;
  font-family:"Inter","DM Sans",Arial,sans-serif !important;
  font-size:20px !important;
  line-height:1 !important;
  font-weight:800 !important;
  letter-spacing:-.72px !important;
  color:#141320 !important;
  white-space:nowrap !important;
}
.site-header .brand-copy strong span,
.hero-header .brand-copy strong span,
html[dir="rtl"] .site-header .brand-copy strong span,
html[dir="rtl"] .hero-header .brand-copy strong span {
  color:#77717f !important;
  font:inherit !important;
}
.site-header .brand-copy small,
.hero-header .brand-copy small,
html[dir="rtl"] .site-header .brand-copy small,
html[dir="rtl"] .hero-header .brand-copy small {
  margin-top:6px !important;
  font-family:"Inter","DM Sans",Arial,sans-serif !important;
  font-size:7px !important;
  line-height:1 !important;
  font-weight:600 !important;
  letter-spacing:1.75px !important;
  color:#9a94a0 !important;
  white-space:nowrap !important;
  text-transform:uppercase !important;
}

/* Arabic navigation reads from the RIGHT edge inward.
   DOM order stays Methodology → Coverage → Pricing → ...,
   so "المنهجية" is the first/right-most navigation item. */
html[dir="rtl"] .site-header .nav,
html[dir="rtl"] .hero-header .nav {
  direction:rtl !important;
  flex-direction:row !important;
  text-align:right !important;
}
html[dir="rtl"] .site-header .nav a,
html[dir="rtl"] .hero-header .nav a {
  direction:rtl !important;
  unicode-bidi:isolate !important;
  text-align:right !important;
}

/* The typing indicator exists only while SpoonIndex AI is thinking.
   It fades/collapses completely before the answer bubble is sent. */
.sequence-thinking {
  overflow:hidden !important;
  box-sizing:border-box !important;
}
.usecase-card.active.sequence-restart .sequence-thinking {
  animation:sequenceThinkingLifecycle 1.02s 1.08s cubic-bezier(.18,.78,.2,1) both !important;
}
.usecase-card.active.sequence-restart .sequence-ai {
  animation:sequenceBubbleIn .58s 2.16s cubic-bezier(.16,.82,.2,1) both !important;
}
.usecase-card.active.sequence-restart .sequence-status {
  animation:sequenceStatusIn .48s 3.18s cubic-bezier(.16,.82,.2,1) both !important;
}
.usecase-card.active.sequence-restart .sequence-status b {
  animation:sequenceCheckPulse .52s 3.32s cubic-bezier(.16,.82,.2,1) both !important;
}
.usecase-card.active.sequence-restart .sequence-report {
  animation:sequenceReportIn .68s 3.92s cubic-bezier(.16,.82,.2,1) both !important;
}
.usecase-card.active.sequence-restart .sequence-report h4 {
  animation:sequenceHeadlineIn .52s 4.08s cubic-bezier(.16,.82,.2,1) both !important;
}
.usecase-card.active.sequence-restart .sequence-report .sheet-lines {
  animation:sequenceReportDraw .92s 4.30s cubic-bezier(.18,.74,.2,1) both !important;
}
html[dir="rtl"] .usecase-card.active.sequence-restart .sequence-report .sheet-lines {
  animation-name:sequenceReportDrawRtl !important;
}
.usecase-card.active.sequence-restart .sequence-report .sheet-lines::after {
  animation:sequenceReportShine .9s 4.55s ease-out both !important;
}
@keyframes sequenceThinkingLifecycle {
  0% {
    opacity:0;
    transform:translateY(7px) scale(.97);
    height:26px;
  }
  18% {
    opacity:1;
    transform:translateY(0) scale(1);
    height:26px;
  }
  72% {
    opacity:1;
    transform:translateY(0) scale(1);
    height:26px;
  }
  92% {
    opacity:0;
    transform:translateY(-3px) scale(.96);
    height:26px;
  }
  100% {
    opacity:0;
    transform:translateY(-3px) scale(.96);
    height:0;
    padding-top:0;
    padding-bottom:0;
  }
}

@media (max-width:720px) {
  .site-header .brand-logo-img,
  .hero-header .brand-logo-img,
  html[dir="rtl"] .site-header .brand-logo-img,
  html[dir="rtl"] .hero-header .brand-logo-img {
    width:34px !important;
    height:34px !important;
    flex-basis:34px !important;
  }
  .site-header .brand-copy strong,
  .hero-header .brand-copy strong,
  html[dir="rtl"] .site-header .brand-copy strong,
  html[dir="rtl"] .hero-header .brand-copy strong {
    font-size:18px !important;
  }
  .site-header .brand-copy small,
  .hero-header .brand-copy small,
  html[dir="rtl"] .site-header .brand-copy small,
  html[dir="rtl"] .hero-header .brand-copy small {
    display:none !important;
  }
}


/* ============================================================
   V43 — AUTH LEFT-CARD POLISH + BUSINESS/SSO + METHODOLOGY HERO
   ============================================================ */
.auth-page .auth-shell {
  width:min(1380px,calc(100% - 56px));
  grid-template-columns:minmax(0,1.05fr) minmax(430px,.95fr);
  min-height:720px;
  overflow:hidden;
  border:1px solid rgba(20,19,32,.07);
  box-shadow:0 30px 80px rgba(39,28,66,.08);
}
.auth-page .auth-visual {
  min-height:720px;
  padding:50px 56px 44px;
  background:
    radial-gradient(circle at 46% 67%,rgba(124,92,228,.11),transparent 25%),
    radial-gradient(circle at 82% 64%,rgba(255,106,141,.06),transparent 20%),
    #fff;
  border-right:1px solid rgba(20,19,32,.06);
}
html[dir="rtl"] .auth-page .auth-visual { border-right:0;border-left:1px solid rgba(20,19,32,.06); }
.auth-page .auth-visual::after {
  background-image:linear-gradient(rgba(124,92,228,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,228,.035) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.75) 68%,transparent 100%);
}
.auth-page .auth-eyebrow { padding:10px 15px;box-shadow:0 9px 24px rgba(20,19,32,.05); }
.auth-page .auth-hero-title { max-width:620px;margin:26px 0 16px;font-size:clamp(56px,5vw,78px);line-height:.98; }
html[dir="rtl"] .auth-page .auth-hero-title { max-width:680px;font-size:clamp(50px,4.7vw,72px);line-height:1.13; }
.auth-page .auth-hero-copy { font-size:17px;max-width:600px; }
.auth-page .auth-scene-v43 {
  height:338px;
  margin:32px 0 20px;
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(250,248,255,.84));
  border:1px solid rgba(124,92,228,.11);
  box-shadow:0 22px 58px rgba(54,40,89,.06),inset 0 1px rgba(255,255,255,.9);
}
.auth-page .auth-scene-ring { position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);border:1px solid rgba(124,92,228,.08);pointer-events:none; }
.auth-page .auth-scene-ring.ring-a { width:280px;height:280px; }
.auth-page .auth-scene-ring.ring-b { width:360px;height:360px;opacity:.75; }
.auth-page .auth-scene-ring.ring-c { width:440px;height:440px;opacity:.45; }
.auth-page .auth-scene-lines path { stroke:rgba(124,92,228,.30);stroke-width:1.6;stroke-dasharray:6 8; }
.auth-page .auth-scene-center { width:146px;height:146px;border-radius:38px;background:linear-gradient(145deg,#fff,#f5f0ff);box-shadow:0 20px 45px rgba(91,63,196,.16),0 0 0 12px rgba(124,92,228,.025); }
.auth-page .auth-scene-node { min-width:136px;height:58px;padding:0 16px;border-radius:18px;gap:10px;background:rgba(255,255,255,.96); }
.auth-page .auth-scene-node-icon { width:29px;height:29px;border-radius:10px;display:grid;place-items:center;background:#f6f2ff;color:#7658df; }
.auth-page .auth-scene-node-icon svg { width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.auth-page .auth-scene-node-dot { display:none; }
.auth-page .auth-spark { position:absolute;font-size:22px;line-height:1;color:#8b6deb;opacity:.82;animation:authSpark 4.8s ease-in-out infinite; }
.auth-page .auth-spark.spark-a { left:2.5%;top:43%; }
.auth-page .auth-spark.spark-b { right:2.8%;top:56%;color:#ff6a8d;animation-delay:-2.2s; }
@keyframes authSpark { 0%,100%{transform:scale(.75) rotate(0);opacity:.45}50%{transform:scale(1.15) rotate(18deg);opacity:1} }
.auth-page .auth-proof-polished { display:flex;justify-content:flex-start;gap:10px;margin-top:auto; }
.auth-page .auth-proof-polished span { display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid rgba(20,19,32,.07);font-size:12px; }
.auth-page .auth-proof-icon { width:18px;height:18px;color:#7c5ce4;display:grid;place-items:center; }
.auth-page .auth-proof-icon svg { width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.auth-page .auth-card { min-height:720px;padding:58px 48px; }
.auth-enterprise-links { margin-top:26px;padding-top:22px;border-top:1px solid rgba(20,19,32,.07);display:grid;gap:11px;color:#8a8392;font-size:12px;text-align:center; }
.auth-enterprise-links>div { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.auth-enterprise-btn { min-height:44px;border-radius:13px;border:1px solid rgba(124,92,228,.18);display:flex;align-items:center;justify-content:center;color:#5b3fc4;font-weight:700;background:#faf8ff;transition:.22s ease; }
.auth-enterprise-btn:hover { transform:translateY(-2px);border-color:rgba(124,92,228,.35);box-shadow:0 10px 22px rgba(124,92,228,.08); }
.auth-sso-btn { background:#fff; }
.auth-link-btn { text-decoration:none;display:flex;align-items:center;justify-content:center; }

/* Methodology: keep the page, refine only the main hero card and orbit visual. */
.methodology-page .methodology-hero { min-height:570px;padding:58px 62px;grid-template-columns:.92fr 1.08fr;gap:34px;background:radial-gradient(circle at 79% 24%,rgba(124,92,228,.10),transparent 30rem),radial-gradient(circle at 8% 95%,rgba(255,106,141,.06),transparent 22rem),rgba(255,255,255,.78);box-shadow:0 26px 70px rgba(39,28,66,.055); }
.methodology-page .methodology-hero .subpage-hero-copy h1 { font-size:clamp(62px,6vw,82px);line-height:.96;letter-spacing:-.055em;max-width:620px; }
html[dir="rtl"] .methodology-page .methodology-hero .subpage-hero-copy h1 { font-size:clamp(56px,5.6vw,78px);line-height:1.12;letter-spacing:-.02em; }
.methodology-page .methodology-hero .subpage-hero-copy p { font-size:17px;max-width:600px; }
.methodology-page .subpage-hero-visual { min-height:430px; }
.method-orbit-v43 { width:min(455px,90%);border:0;box-shadow:none;background:radial-gradient(circle at center,rgba(124,92,228,.08),transparent 35%); }
.method-orbit-v43::before { content:"";position:absolute;inset:-56px;border-radius:50%;background:radial-gradient(circle,rgba(124,92,228,.055),transparent 68%);z-index:-1; }
.method-ring { position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);border:1px solid rgba(124,92,228,.12);pointer-events:none; }
.method-ring-outer { width:100%;height:100%; }
.method-ring-mid { width:76%;height:76%;opacity:.8; }
.method-ring-inner { width:42%;height:42%;opacity:.72; }
.method-orbit-v43 .method-core { width:132px;height:132px;background:radial-gradient(circle at 38% 28%,#b8a8ff,#7c5ce4 45%,#5637c5);box-shadow:0 22px 54px rgba(91,63,196,.26),0 0 0 18px rgba(124,92,228,.035); }
.method-orbit-v43 .method-core span { color:#fff;font-weight:760; }
.method-orbit-v43 .method-node { min-width:126px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 14px;background:rgba(255,255,255,.96);box-shadow:0 12px 30px rgba(20,19,32,.07); }
.method-orbit-v43 .method-node i { width:25px;height:25px;border-radius:9px;display:grid;place-items:center;color:#7658df;background:#f5f1ff;font-style:normal; }
.method-orbit-v43 .method-node i svg { width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.method-orbit-v43 .method-node.n1 { left:-5%;top:11%; }
.method-orbit-v43 .method-node.n2 { right:-6%;top:10%; }
.method-orbit-v43 .method-node.n3 { right:-6%;bottom:9%; }
.method-orbit-v43 .method-node.n4 { left:-5%;bottom:8%; }
.method-orbit-v43 .method-lines path { stroke:rgba(124,92,228,.31);stroke-width:.55;stroke-dasharray:2.2 2.2; }
.method-dot { position:absolute;width:9px;height:9px;border-radius:50%;background:#fff;border:2px solid #8d73e8;box-shadow:0 0 0 5px rgba(124,92,228,.055);animation:methodDotPulse 3.8s ease-in-out infinite; }
.method-dot.d1 { left:23%;top:20%; }.method-dot.d2 { right:22%;top:20%;animation-delay:-1s }.method-dot.d3 { right:22%;bottom:19%;animation-delay:-2s }.method-dot.d4 { left:23%;bottom:19%;animation-delay:-3s }
@keyframes methodDotPulse { 0%,100%{transform:scale(.75);opacity:.55}50%{transform:scale(1.12);opacity:1} }

@media(max-width:1050px){
  .auth-page .auth-shell{grid-template-columns:1fr;width:min(100% - 32px,900px)}
  .auth-page .auth-visual{border-right:0;border-left:0;border-bottom:1px solid rgba(20,19,32,.06);min-height:auto}
  .auth-page .auth-card{min-height:auto}
  .methodology-page .methodology-hero{grid-template-columns:1fr;padding:48px 34px}
}
@media(max-width:720px){
  .auth-page .auth-visual{padding:34px 22px 28px}.auth-page .auth-scene-v43{height:300px}.auth-page .auth-proof-polished{justify-content:center}.auth-enterprise-links>div{grid-template-columns:1fr}
  .methodology-page .methodology-hero{padding:40px 22px}.method-orbit-v43{transform:scale(.78)}
}


/* V44 — one clear enterprise authentication path: Company SSO */
.auth-enterprise-single { margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(20,19,32,.09); display: grid; gap: 10px; }
.auth-enterprise-single > span { font-size: 13px; color: #6e6a7c; font-weight: 600; }
.auth-enterprise-single .auth-sso-btn { width: 100%; min-height: 68px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; align-items: center; gap: 2px 14px; padding: 13px 16px; text-align: left; border: 1px solid rgba(124,92,228,.22); background: linear-gradient(135deg, rgba(241,236,253,.74), rgba(255,255,255,.96)); border-radius: 18px; color: #372867; box-shadow: 0 12px 32px rgba(124,92,228,.08); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.auth-enterprise-single .auth-sso-btn:hover { transform: translateY(-2px); border-color: rgba(124,92,228,.5); box-shadow: 0 16px 38px rgba(124,92,228,.14); }
.auth-enterprise-single .auth-sso-btn strong { grid-column: 1; font-size: 14px; }
.auth-enterprise-single .auth-sso-btn small { grid-column: 1; font-size: 11px; line-height: 1.45; color: #767185; font-weight: 500; }
.auth-enterprise-single .auth-sso-btn > span { grid-column: 2; grid-row: 1 / span 2; font-size: 18px; color: #7C5CE4; }
html[dir="rtl"] .auth-enterprise-single .auth-sso-btn { text-align: right; grid-template-columns: 1fr auto; }


/* ============================================================
   V46 — compact subpage heroes, accurate KSA coverage, tutorial polish
   ============================================================ */
body.site-consistent-page .subpage-hero,
body.site-consistent-page .simple-page-hero {
  width:min(1180px,calc(100% - 56px));
  min-height:500px;
  margin:22px auto 46px;
  padding:48px clamp(30px,4vw,58px);
  border-radius:28px;
  gap:34px;
}
body.site-consistent-page .subpage-hero-copy h1,
body.site-consistent-page .simple-page-hero h1 {
  font-size:clamp(46px,5.25vw,70px);
  line-height:1.00;
  max-width:760px;
}
html[dir="rtl"] body.site-consistent-page .subpage-hero-copy h1,
html[dir="rtl"] body.site-consistent-page .simple-page-hero h1 {
  font-size:clamp(44px,5vw,68px);
  line-height:1.16;
  letter-spacing:-.022em;
}
body.site-consistent-page .subpage-hero-copy > p,
body.site-consistent-page .simple-page-hero > p { font-size:16px;line-height:1.72;max-width:650px; }
body.site-consistent-page .subpage-hero-visual { min-height:350px; }

/* Methodology: center the core and make the motion feel intentional. */
.methodology-page .methodology-hero { min-height:500px !important;padding:48px 54px !important; }
.method-orbit-v43 { width:min(410px,88%);aspect-ratio:1;position:relative; }
.method-orbit-v43 .method-core {
  left:50% !important;top:50% !important;transform:translate(-50%,-50%) scale(1);
  width:138px;height:138px;z-index:6;
  animation:methodCoreBreath 4.8s ease-in-out infinite;
}
.method-orbit-v43 .method-core::before,.method-orbit-v43 .method-core::after{content:"";position:absolute;border-radius:50%;inset:-18px;border:1px solid rgba(124,92,228,.18);animation:methodPulseRing 4.8s ease-out infinite;pointer-events:none}
.method-orbit-v43 .method-core::after{inset:-38px;animation-delay:-2.4s;opacity:.55}
.method-orbit-v43 .method-ring-outer{animation:methodRingGlow 5.2s ease-in-out infinite}.method-orbit-v43 .method-ring-mid{animation:methodRingGlow 5.2s ease-in-out -1.7s infinite}.method-orbit-v43 .method-ring-inner{animation:methodRingGlow 5.2s ease-in-out -3.2s infinite}
@keyframes methodCoreBreath{0%,100%{transform:translate(-50%,-50%) scale(1);box-shadow:0 22px 54px rgba(91,63,196,.24),0 0 0 16px rgba(124,92,228,.025)}50%{transform:translate(-50%,-50%) scale(1.045);box-shadow:0 28px 68px rgba(91,63,196,.32),0 0 0 22px rgba(124,92,228,.055)}}
@keyframes methodPulseRing{0%{opacity:.6;transform:scale(.92)}78%,100%{opacity:0;transform:scale(1.16)}}
@keyframes methodRingGlow{0%,100%{opacity:.45;box-shadow:0 0 0 0 rgba(124,92,228,0)}50%{opacity:1;box-shadow:0 0 35px rgba(124,92,228,.08)}}

/* Accurate Saudi Arabia outline and coverage animation. */
.coverage-page .coverage-hero { grid-template-columns:.92fr 1.08fr; }
.coverage-map{width:min(500px,100%);height:365px;}
.saudi-map-svg{width:84%;height:92%;left:8%;top:4%;filter:drop-shadow(0 20px 40px rgba(124,92,228,.09));}
.saudi-map-country{fill:url(#saudiWash);stroke:rgba(124,92,228,.30);stroke-width:2.1;vector-effect:non-scaling-stroke;}
.saudi-region-lines path{fill:none;stroke:rgba(124,92,228,.10);stroke-width:1.3;stroke-dasharray:4 7;vector-effect:non-scaling-stroke;animation:ksaLineFlow 16s linear infinite;}
.saudi-city-dot{fill:#7c5ce4;stroke:#fff;stroke-width:2.2;filter:drop-shadow(0 0 8px rgba(124,92,228,.46));transform-box:fill-box;transform-origin:center;animation:ksaCityPulse 3.2s ease-in-out infinite;}
.saudi-city-dot:nth-of-type(2n){animation-delay:-1.3s}.saudi-city-dot:nth-of-type(3n){animation-delay:-2.2s}
.saudi-capital-ring{fill:none;stroke:rgba(124,92,228,.24);stroke-width:3;transform-box:fill-box;transform-origin:center;animation:ksaRing 3.8s ease-out infinite}.saudi-capital-ring.ring-2{animation-delay:-1.9s;opacity:.55}
@keyframes ksaCityPulse{0%,100%{transform:scale(.86);opacity:.72}50%{transform:scale(1.15);opacity:1}}
@keyframes ksaRing{0%{opacity:.45;transform:scale(.65)}85%,100%{opacity:0;transform:scale(1.55)}}
@keyframes ksaLineFlow{to{stroke-dashoffset:-120}}
.coverage-page .coverage-float{padding:13px 15px;min-width:128px;border-radius:15px}.coverage-page .coverage-float strong{font-size:15px}.coverage-page .coverage-float small{font-size:11px}

/* Tutorials: image-led cards like the approved direction. */
.tutorial-grid{gap:20px}.tutorial-card-v46{padding:14px 14px 24px;border-radius:24px;background:#fff;box-shadow:0 8px 26px rgba(20,19,32,.035);overflow:hidden}.tutorial-card-v46:hover{transform:translateY(-7px)!important;box-shadow:0 22px 48px rgba(50,35,92,.10)}
.tutorial-card-v46 .tutorial-art{min-height:0;aspect-ratio:1.72/1;padding:0;border-radius:20px;overflow:hidden;display:block;background:none;position:relative}.tutorial-card-v46 .tutorial-art::after{display:none}.tutorial-card-v46 .tutorial-art-img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease,filter .45s ease}.tutorial-card-v46:hover .tutorial-art-img{transform:scale(1.035);filter:saturate(1.04)}
.tutorial-card-v46 .tutorial-number{position:absolute;z-index:3;top:16px;right:18px;color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;text-shadow:0 2px 10px rgba(0,0,0,.18)}
html[dir="rtl"] .tutorial-card-v46 .tutorial-number{right:auto;left:18px}.tutorial-card-v46>small{margin:16px 6px 12px;font-size:10px;color:#8a8498;letter-spacing:.08em;text-align:right}.tutorial-card-v46 h3{font-size:24px;line-height:1.35;margin:0 6px 9px}.tutorial-card-v46 p{font-size:14px;line-height:1.75}
html[dir="ltr"] .tutorial-card-v46>small{text-align:left}

/* Insights: only PRODUCT / DATA / STRATEGY as article families. */
.blog-card>small{display:inline-flex!important;width:auto;margin:16px 4px 10px;padding:6px 9px;border-radius:999px;background:#f4f0ff;color:#6850c4;font-size:9px;letter-spacing:.11em}.blog-card h3{font-size:22px;line-height:1.34}.blog-card p{font-size:14px}
.insight-category-shell{margin-top:-10px;margin-bottom:34px}.insight-category-btn{min-height:58px;padding:10px 14px 10px 18px;border-radius:18px}

/* Smaller hero media across inner pages. */
.tutorials-page .tutorial-player,.coverage-page .coverage-map,.blog-page .blog-hero-visual,.methodology-page .method-orbit-v43{transform:scale(.93);transform-origin:center}
@media(max-width:1050px){body.site-consistent-page .subpage-hero{grid-template-columns:1fr;min-height:auto}.coverage-page .coverage-hero{grid-template-columns:1fr}.coverage-map{height:340px}.tutorial-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){body.site-consistent-page .subpage-hero,body.site-consistent-page .simple-page-hero{width:min(100% - 24px,1180px);padding:34px 22px;border-radius:24px}.tutorial-grid{grid-template-columns:1fr}.coverage-map{height:300px}.method-orbit-v43{transform:scale(.78)}}


/* ============================================================
   V47 — calmer evidence cards, compact auth, consistent wordmark,
   searchable international phone field, clickable insight essays
   ============================================================ */

/* Exact same Latin SpoonIndex lockup on EN + AR. */
.site-header .brand.brand-real,
html[dir="rtl"] .site-header .brand.brand-real,
.hero-header .brand.brand-real,
html[dir="rtl"] .hero-header .brand.brand-real{
  direction:ltr!important; flex-direction:row!important; gap:12px!important;
  width:255px!important; min-width:255px!important; max-width:255px!important;
  justify-content:flex-start!important; align-items:center!important;
  font-family:"Inter",Arial,sans-serif!important;
}
.site-header .brand-logo-img,
html[dir="rtl"] .site-header .brand-logo-img{
  width:39px!important;height:39px!important;flex:0 0 39px!important;margin:0!important;
}
.site-header .brand-copy,
html[dir="rtl"] .site-header .brand-copy{
  direction:ltr!important;text-align:left!important;width:195px!important;min-width:195px!important;
  gap:0!important;font-family:"Inter",Arial,sans-serif!important;
}
.site-header .brand-copy strong,
html[dir="rtl"] .site-header .brand-copy strong{
  font-family:"Inter",Arial,sans-serif!important;font-size:21px!important;font-weight:800!important;
  letter-spacing:-.82px!important;line-height:1!important;margin:0!important;
}
.site-header .brand-copy small,
html[dir="rtl"] .site-header .brand-copy small{
  font-family:"Inter",Arial,sans-serif!important;font-size:7px!important;font-weight:600!important;
  letter-spacing:1.72px!important;line-height:1!important;margin-top:6px!important;white-space:nowrap!important;
}
.footer-brand-link,.footer-wordmark,html[dir="rtl"] .footer-brand-link,html[dir="rtl"] .footer-wordmark{direction:ltr!important;text-align:left!important;font-family:"Inter",Arial,sans-serif!important}
.footer-wordmark strong{font-family:"Inter",Arial,sans-serif!important;letter-spacing:-.75px!important}.footer-wordmark small{font-family:"Inter",Arial,sans-serif!important;letter-spacing:1.7px!important}

/* Replace high-contrast black Data Schema blocks with quieter surfaces. */
.schema-v38-evidence{
  background:linear-gradient(135deg,#f5f1ff 0%,#fbf9ff 48%,#fff6f8 100%)!important;
  color:#171421!important;border:1px solid rgba(124,92,228,.13)!important;
  box-shadow:0 24px 62px rgba(73,50,133,.08)!important;
}
.schema-v38-evidence::after{background:radial-gradient(circle,rgba(124,92,228,.16),transparent 68%)!important;opacity:.72}
.schema-v38-evidence .pill-label{background:#fff!important;color:#62518d!important;border-color:rgba(124,92,228,.14)!important}
.schema-v38-evidence p{color:#716b82!important}
.schema-v38-evidence .merge-source,
.schema-v38-evidence .merge-result{
  background:rgba(255,255,255,.86)!important;border-color:rgba(52,41,78,.10)!important;color:#1c1828!important;
  box-shadow:0 12px 28px rgba(63,43,111,.06)!important;
}
.schema-v38-evidence .merge-source small,.schema-v38-evidence .merge-result small{color:#948b9d!important}
.schema-v38-evidence .merge-source span,.schema-v38-evidence .merge-result span{color:#6f6878!important}
.schema-v38-evidence .merge-result{background:linear-gradient(135deg,#eee7ff,#fff)!important;border-color:rgba(124,92,228,.18)!important}
.schema-v38-evidence .merge-connector{color:#8063e5!important}
.schema-v38-cta{background:linear-gradient(135deg,#f3effb,#fcfbff)!important;color:#171421!important;border:1px solid rgba(124,92,228,.10)!important}
.schema-v38-cta .pill-label{background:#fff!important;color:#655590!important}

/* Insights: cards are real links and images stay crisp. */
.blog-grid a.blog-card{color:inherit;text-decoration:none;display:block;cursor:pointer}
.blog-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease!important}
.blog-card:hover{transform:translateY(-7px);box-shadow:0 24px 54px rgba(45,30,82,.10)!important;border-color:rgba(124,92,228,.18)!important}
.media-blog-cover{overflow:hidden!important;background:#f5f1ff!important}
.media-blog-cover img{width:100%!important;height:100%!important;object-fit:cover!important;display:block;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.blog-card:hover .media-blog-cover img{transform:scale(1.035)}
.blog-card .card-read-more{display:inline-flex;align-items:center;gap:7px;margin-top:13px;color:#684bd3;font-weight:700;font-size:12px}

/* Full insight article pages. */
.insight-article-page main{width:min(1120px,calc(100% - 48px));margin:30px auto 80px}
.insight-article-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center;padding:44px;border-radius:30px;background:linear-gradient(135deg,#fff,#f6f1ff 66%,#fff4f6);border:1px solid rgba(124,92,228,.10);box-shadow:0 24px 62px rgba(48,34,86,.07)}
.insight-article-hero .article-meta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.article-meta span{padding:8px 12px;border-radius:999px;background:#fff;border:1px solid rgba(124,92,228,.12);font-size:10px;font-weight:800;letter-spacing:.09em;color:#62518d}
.insight-article-hero h1{font:800 clamp(42px,5vw,68px)/.98 "Inter",system-ui,sans-serif;letter-spacing:-.055em;margin:0 0 18px}.insight-article-hero p{font-size:17px;line-height:1.72;color:#716b82;margin:0}
.insight-article-visual{border-radius:24px;overflow:hidden;min-height:330px;box-shadow:0 22px 48px rgba(72,51,130,.10)}.insight-article-visual img{width:100%;height:100%;min-height:330px;object-fit:cover;display:block}
.insight-article-body{max-width:820px;margin:54px auto 0}.insight-article-body h2{font:800 32px/1.08 "Inter",system-ui,sans-serif;letter-spacing:-.035em;margin:48px 0 14px}.insight-article-body h3{font-size:21px;margin:30px 0 10px}.insight-article-body p,.insight-article-body li{font-size:17px;line-height:1.85;color:#514b60}.insight-article-body ul{padding-left:22px}.article-callout{margin:34px 0;padding:24px 26px;border-radius:22px;background:#f3efff;border:1px solid rgba(124,92,228,.12)}
html[dir="rtl"] .insight-article-hero h1,html[dir="rtl"] .insight-article-body h2{font-family:"Noto Sans Arabic",system-ui,sans-serif;letter-spacing:-.02em;line-height:1.18}html[dir="rtl"] .insight-article-body ul{padding-left:0;padding-right:22px}

/* Contact phone input with searchable country dial code. */
.phone-composite{position:relative;display:flex;direction:ltr;border:1px solid rgba(20,19,32,.12);border-radius:15px;background:#fff;min-height:54px;transition:border-color .2s ease,box-shadow .2s ease}
.phone-composite:focus-within{border-color:#8c70ea;box-shadow:0 0 0 3px rgba(124,92,228,.08)}
.phone-country-trigger{border:0;border-right:1px solid rgba(20,19,32,.08);background:transparent;min-width:116px;padding:0 12px;display:flex;align-items:center;gap:8px;font:600 13px "Inter",sans-serif;cursor:pointer;color:#2c2736}
.phone-country-trigger .flag{font-size:20px}.phone-country-trigger .chev{font-size:10px;color:#817b8b;margin-left:auto}.phone-number-input{border:0!important;box-shadow:none!important;border-radius:0!important;min-width:0;flex:1;padding:0 15px!important;font-size:15px!important;background:transparent!important}
.phone-country-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:1000;width:min(360px,calc(100vw - 56px));background:#fff;border:1px solid rgba(20,19,32,.10);border-radius:18px;box-shadow:0 22px 60px rgba(36,27,57,.17);padding:10px;display:none}
.phone-country-menu.open{display:block}.phone-country-search{width:100%;height:42px;border:1px solid rgba(20,19,32,.10);border-radius:12px;padding:0 12px;font:500 13px "Inter",sans-serif;outline:none;margin-bottom:8px}.phone-country-list{max-height:260px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.phone-country-option{width:100%;display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;border:0;background:transparent;border-radius:10px;padding:9px 10px;text-align:left;cursor:pointer;font-size:12px;color:#2b2735}.phone-country-option:hover,.phone-country-option.active{background:#f4f0ff}.phone-country-option .flag{font-size:18px}.phone-country-option .dial{font-weight:700;color:#6c55c7}
html[dir="rtl"] .phone-composite{direction:rtl}.phone-country-trigger{border-left:0}html[dir="rtl"] .phone-country-trigger{border-right:0;border-left:1px solid rgba(20,19,32,.08)}html[dir="rtl"] .phone-country-menu{right:0;left:auto}html[dir="rtl"] .phone-country-option{text-align:right;grid-template-columns:28px 1fr auto}

/* Auth: desktop screens fit into one viewport; no footer/scroll. */
body.auth-page{height:100vh;overflow:hidden;background:#f8f7fb!important}
body.auth-page .site-header{height:72px!important;min-height:72px!important;padding-top:10px!important;padding-bottom:10px!important}
body.auth-page main{height:calc(100vh - 72px);overflow:hidden;display:flex;align-items:center}
body.auth-page .global-footer{display:none!important}
.auth-page .auth-shell{width:min(1120px,calc(100% - 42px))!important;height:min(700px,calc(100vh - 94px))!important;min-height:0!important;margin:10px auto!important;grid-template-columns:1.02fr .98fr!important;border-radius:28px!important;overflow:hidden!important;box-shadow:0 24px 65px rgba(42,30,75,.08)!important}
.auth-page .auth-visual,.auth-page .auth-card{min-height:0!important;height:100%!important}
.auth-page .auth-visual{padding:32px 34px 26px!important}.auth-page .auth-card{padding:36px 40px!important;display:flex;flex-direction:column;justify-content:center!important}
.auth-page .auth-visual-inner{height:100%!important;display:flex!important;flex-direction:column!important}.auth-page .auth-eyebrow{margin-bottom:12px!important}.auth-page .auth-hero-title{font-size:clamp(44px,4.2vw,62px)!important;line-height:.98!important;margin:0 0 12px!important;max-width:520px!important}.auth-page .auth-hero-copy{font-size:14px!important;line-height:1.6!important;max-width:520px!important;margin:0!important}
.auth-page .auth-scene,.auth-page .auth-scene-v43{height:255px!important;min-height:255px!important;margin-top:18px!important;border-radius:22px!important}.auth-page .auth-scene-center{transform:translate(-50%,-50%) scale(.82)!important}.auth-page .auth-scene-node{transform:scale(.88)!important}.auth-page .auth-proof-polished{margin-top:14px!important;gap:7px!important;flex-wrap:wrap!important}.auth-page .auth-proof-polished span{padding:7px 10px!important;font-size:10px!important}
.auth-page .auth-card-head{margin-bottom:18px!important}.auth-page .auth-card-head h2{font-size:34px!important;margin-bottom:6px!important}.auth-page .auth-card-head p{font-size:13px!important;line-height:1.5!important}.auth-page .google-auth-btn{min-height:46px!important}.auth-page .auth-divider{margin:13px 0!important}.auth-page .auth-form{gap:12px!important}.auth-page .auth-form label{font-size:12px!important}.auth-page .auth-form input{min-height:46px!important;padding:0 14px!important}.auth-page .auth-name-grid{gap:10px!important}.auth-page .signup-plan-box{padding:12px 15px!important;margin:1px 0!important;min-height:68px!important}.auth-page .signup-plan-box strong{font-size:14px!important}.auth-page .signup-plan-box small{font-size:8px!important}.auth-page .legal-check{font-size:10.5px!important;line-height:1.35!important}.auth-page .auth-submit{min-height:46px!important}.auth-page .auth-switch{font-size:11.5px!important;margin-top:12px!important}.auth-enterprise-single{margin-top:12px!important;padding-top:12px!important;gap:7px!important}.auth-enterprise-single>span{font-size:11px!important}.auth-enterprise-single .auth-sso-btn{min-height:54px!important;padding:9px 13px!important;border-radius:14px!important}.auth-enterprise-single .auth-sso-btn strong{font-size:12px!important}.auth-enterprise-single .auth-sso-btn small{font-size:9px!important;line-height:1.3!important}
.auth-page.sso-page .auth-card{padding-inline:48px!important}.auth-page.sso-page .auth-card-head h2{font-size:38px!important}.auth-page.sso-page .auth-scene{height:265px!important;min-height:265px!important}.auth-page.reset-page .reset-visual-card{height:205px!important;margin-top:18px!important}.auth-page.reset-page .reset-envelope{transform:scale(.75)!important}.auth-page.reset-page .auth-card{padding-inline:50px!important}

/* Auth scene variants make each left panel feel intentionally different. */
.auth-page.login-page .auth-visual{background:radial-gradient(circle at 28% 72%,rgba(124,92,228,.10),transparent 37%),linear-gradient(145deg,#fff,#fbf9ff)}
.auth-page.signup-page .auth-visual{background:radial-gradient(circle at 75% 28%,rgba(255,111,150,.09),transparent 34%),linear-gradient(145deg,#fff,#f8f5ff)}
.auth-page.sso-page .auth-visual{background:radial-gradient(circle at 55% 70%,rgba(91,63,196,.10),transparent 38%),linear-gradient(145deg,#fff,#f4f1fb)}
.auth-page.reset-page .auth-visual{background:radial-gradient(circle at 30% 60%,rgba(124,92,228,.10),transparent 35%),linear-gradient(145deg,#fff,#fbf9ff)}

@media(max-width:900px){body.auth-page{height:auto;overflow:auto}body.auth-page main{height:auto;overflow:visible}.auth-page .auth-shell{height:auto!important;grid-template-columns:1fr!important;margin:16px auto 36px!important}.auth-page .auth-visual,.auth-page .auth-card{height:auto!important}.auth-page .auth-visual{display:none!important}.auth-page .auth-card{padding:34px 24px!important}}
@media(max-height:760px) and (min-width:901px){.auth-page .auth-shell{height:calc(100vh - 86px)!important}.auth-page .auth-scene,.auth-page .auth-scene-v43{height:210px!important;min-height:210px!important}.auth-page .auth-hero-title{font-size:46px!important}.auth-page .auth-card{padding-top:26px!important;padding-bottom:26px!important}.auth-page .auth-proof-polished{display:none!important}}

/* ============================================================
   V48 — COVERAGE PALETTE, COMPACT AUTH, RTL PRICING SWITCH
   ============================================================ */

/* 1) Replace large black marketing cards with the calmer Coverage Examples
   visual language: white / soft lilac / subtle grid / dark copy. */
.subpage-cta,
.schema-v38-cta,
.final-cta,
.dark-shell,
.feature-card.dark-card,
.price-card.highlight {
  position:relative;
  color:var(--ink) !important;
  background:
    linear-gradient(rgba(124,92,228,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(124,92,228,.045) 1px,transparent 1px),
    radial-gradient(circle at 82% 10%,rgba(124,92,228,.13),transparent 34%),
    radial-gradient(circle at 10% 90%,rgba(255,111,150,.08),transparent 28%),
    linear-gradient(135deg,#fff 0%,#fbf9ff 58%,#f3efff 100%) !important;
  background-size:58px 58px,58px 58px,auto,auto,auto !important;
  border:1px solid rgba(124,92,228,.11) !important;
  box-shadow:0 24px 66px rgba(62,44,111,.075) !important;
}
.subpage-cta::before,
.final-cta::before,
.dark-shell::before,
.feature-card.dark-card::before,
.price-card.highlight::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(120deg,rgba(255,255,255,.52),transparent 35%,rgba(124,92,228,.035));
}
.subpage-cta > *, .final-cta > *, .dark-shell > *, .feature-card.dark-card > *, .price-card.highlight > *{position:relative;z-index:1}
.subpage-cta h2,.final-cta h2,.dark-shell h2,.dark-shell h3,.feature-card.dark-card h3,.price-card.highlight h3,.price-card.highlight strong{color:var(--ink)!important}
.subpage-cta p,.final-cta p,.dark-shell p,.feature-card.dark-card p,.price-card.highlight p,.price-card.highlight ul{color:#6f687c!important}
.subpage-cta .pill-label{background:#fff!important;color:#5d527b!important;border:1px solid rgba(124,92,228,.12)!important}
.dark-shell .showcase-tab{color:#8a8395!important;border-color:rgba(20,19,32,.08)!important}
.dark-shell .showcase-tab.active{color:var(--ink)!important}
.dark-shell .showcase-tab.active::after{background:var(--brand)!important}
.dark-shell .light{color:var(--ink)!important}
.dark-shell .showcase-browser{box-shadow:inset 0 0 0 1px rgba(124,92,228,.09),0 18px 45px rgba(70,50,122,.08)}
.price-card.highlight li::before{color:var(--brand-deep)!important}
.feature-card.dark-card .dark-copy{color:var(--ink)!important}
.feature-card.dark-card .mock-window,
.feature-card.dark-card .mini-chat{
  background:
    radial-gradient(circle at 12% 12%,rgba(255,111,150,.16),transparent 25%),
    radial-gradient(circle at 84% 8%,rgba(124,92,228,.17),transparent 30%),
    linear-gradient(145deg,#fff,#f6f1ff 58%,#fff7f9) !important;
  border:1px solid rgba(124,92,228,.11)!important;
}
.feature-card.dark-card .mini-input{border-color:rgba(124,92,228,.26)!important;box-shadow:0 12px 26px rgba(75,54,130,.07)!important}

/* Data Schema evidence and next-step card use the exact same quiet family. */
.schema-v38-evidence{
  background:
    linear-gradient(rgba(124,92,228,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(124,92,228,.045) 1px,transparent 1px),
    radial-gradient(circle at 82% 12%,rgba(124,92,228,.14),transparent 34%),
    linear-gradient(135deg,#fff,#fbf9ff 60%,#f3efff) !important;
  background-size:58px 58px,58px 58px,auto,auto !important;
  color:var(--ink)!important;
}
.schema-v38-evidence::after{opacity:.38!important}
.schema-v38-evidence h2{color:var(--ink)!important}
.schema-v38-evidence p{color:#6e6879!important}
.schema-v38-evidence .merge-source,.schema-v38-evidence .merge-result{background:rgba(255,255,255,.90)!important;color:var(--ink)!important;border-color:rgba(124,92,228,.11)!important}
.schema-v38-evidence .merge-result{background:linear-gradient(135deg,#eee8ff,#fff)!important}
.schema-v38-evidence .merge-source small,.schema-v38-evidence .merge-result small{color:#90899a!important}
.schema-v38-evidence .merge-source span,.schema-v38-evidence .merge-result span{color:#6f6878!important}

/* 2) Auth pages follow the compact login pattern used by mature SaaS products.
   Minimal header, everything fits the desktop viewport, no body scroll. */
body.auth-page{height:100dvh!important;min-height:100dvh!important;overflow:hidden!important;background:linear-gradient(180deg,#faf9fd,#f6f5fb)!important}
body.auth-page .site-header,
html[dir="rtl"] body.auth-page .site-header{
  height:64px!important;min-height:64px!important;
  width:min(1460px,calc(100% - 36px))!important;
  padding:0!important;margin:0 auto!important;
  grid-template-columns:1fr auto!important;gap:18px!important;
  direction:ltr!important;
}
body.auth-page .site-header .nav{display:none!important}
body.auth-page .site-header .header-actions{grid-column:2!important;justify-self:end!important}
body.auth-page .site-header .header-account,
body.auth-page .site-header .header-login{display:none!important}
body.auth-page .site-header .language-btn{min-height:40px!important;padding:0 15px!important;background:#fff!important;border:1px solid rgba(20,19,32,.09)!important}
body.auth-page main{height:calc(100dvh - 64px)!important;min-height:0!important;overflow:hidden!important;display:grid!important;place-items:center!important;padding:10px 0 16px!important}
body.auth-page .global-footer{display:none!important}
.auth-page .auth-shell{
  width:min(1030px,calc(100% - 38px))!important;
  height:min(618px,calc(100dvh - 88px))!important;
  min-height:0!important;margin:0 auto!important;
  grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr)!important;
  border-radius:26px!important;overflow:hidden!important;
  background:#fff!important;border:1px solid rgba(20,19,32,.075)!important;
  box-shadow:0 26px 72px rgba(49,35,82,.085)!important;
}
.auth-page .auth-visual,.auth-page .auth-card{height:100%!important;min-height:0!important}
.auth-page .auth-visual{
  padding:27px 28px 23px!important;
  background:
    linear-gradient(rgba(124,92,228,.038) 1px,transparent 1px),
    linear-gradient(90deg,rgba(124,92,228,.038) 1px,transparent 1px),
    radial-gradient(circle at 52% 72%,rgba(124,92,228,.10),transparent 34%),
    linear-gradient(145deg,#fff,#fbf9ff)!important;
  background-size:46px 46px,46px 46px,auto,auto!important;
}
.auth-page .auth-visual-inner{height:100%!important;display:flex!important;flex-direction:column!important;min-height:0!important}
.auth-page .auth-eyebrow{margin:0 0 12px!important;padding:8px 12px!important;font-size:9px!important;letter-spacing:.13em!important}
.auth-page .auth-hero-title{margin:0 0 9px!important;font-size:clamp(36px,3.5vw,48px)!important;line-height:1.01!important;letter-spacing:-.05em!important;max-width:400px!important}
html[dir="rtl"] .auth-page .auth-hero-title{font-size:clamp(35px,3.3vw,46px)!important;line-height:1.22!important;letter-spacing:-.025em!important}
.auth-page .auth-hero-copy{margin:0!important;font-size:12.5px!important;line-height:1.62!important;max-width:420px!important;color:#736d80!important}
.auth-page .auth-scene,.auth-page .auth-scene-v43{
  flex:1 1 auto!important;height:auto!important;min-height:185px!important;max-height:242px!important;
  margin:17px 0 12px!important;border-radius:20px!important;
  background:rgba(255,255,255,.70)!important;
  border:1px solid rgba(124,92,228,.10)!important;
  box-shadow:0 16px 40px rgba(69,49,120,.055)!important;
}
.auth-page .auth-scene-center{transform:translate(-50%,-50%) scale(.70)!important}
.auth-page .auth-scene-node{transform:scale(.76)!important;box-shadow:0 10px 22px rgba(44,31,76,.06)!important}
.auth-page .auth-proof-polished{margin-top:auto!important;gap:6px!important;flex-wrap:nowrap!important}
.auth-page .auth-proof-polished span{padding:6px 8px!important;font-size:8.5px!important;white-space:nowrap!important}
.auth-page .auth-proof-icon{display:none!important}
.auth-page .auth-card{padding:26px 31px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;background:#fff!important}
.auth-page .auth-card::before{height:3px!important}
.auth-page .auth-card-head{margin:0 0 13px!important}.auth-page .auth-card-head h2{font-size:30px!important;margin:0 0 4px!important;letter-spacing:-.04em!important}.auth-page .auth-card-head p{margin:0!important;font-size:11.5px!important;line-height:1.45!important;color:#77707f!important}
.auth-page .google-auth-btn{height:43px!important;min-height:43px!important;border-radius:12px!important;font-size:12.5px!important}.auth-page .google-logo{width:19px!important;height:19px!important}
.auth-page .auth-divider{margin:11px 0!important;font-size:9.5px!important}.auth-page .auth-form{gap:9px!important}.auth-page .auth-form label{gap:5px!important;font-size:10.5px!important}.auth-page .auth-form input[type="email"],.auth-page .auth-form input[type="password"],.auth-page .auth-form input[type="text"]{height:43px!important;min-height:43px!important;border-radius:11px!important;font-size:12px!important;padding:0 13px!important}
.auth-page .auth-row{font-size:10px!important}.auth-page .check-row{font-size:10px!important}.auth-page .auth-submit{height:43px!important;min-height:43px!important;font-size:12px!important}.auth-page .auth-switch{margin:9px 0 0!important;font-size:10px!important}
.auth-page .auth-enterprise-single{margin-top:9px!important;padding-top:9px!important;gap:5px!important}.auth-page .auth-enterprise-single>span{font-size:9.5px!important}.auth-page .auth-enterprise-single .auth-sso-btn{min-height:46px!important;padding:7px 10px!important;border-radius:12px!important}.auth-page .auth-enterprise-single .auth-sso-btn strong{font-size:10.5px!important}.auth-page .auth-enterprise-single .auth-sso-btn small{font-size:8px!important;line-height:1.25!important}
.auth-page .auth-name-grid{gap:8px!important}.auth-page .signup-plan-box{min-height:52px!important;padding:8px 11px!important;gap:8px!important;border-radius:12px!important}.auth-page .signup-plan-box small{font-size:7px!important}.auth-page .signup-plan-box strong{font-size:11px!important}.auth-page .signup-plan-change{min-height:30px!important;padding:0 10px!important;font-size:9px!important}.auth-page .legal-check{font-size:8.8px!important;line-height:1.28!important}.auth-page .auth-status{padding:7px 9px!important;font-size:9px!important}
.auth-page .auth-legal-mini{margin:9px 0 0;text-align:center;font-size:8.5px;line-height:1.45;color:#99929f}.auth-page .auth-legal-mini a{color:#6548cf;font-weight:700}.auth-help-row{display:flex;gap:12px;justify-content:center;align-items:center;margin-top:10px;font-size:9.5px;color:#817a89}.auth-help-row a{color:#6548cf;font-weight:700}
.auth-provider-chips{display:flex;flex-wrap:wrap;gap:6px;margin:11px 0 13px}.auth-provider-chips span{padding:6px 9px;border-radius:999px;background:#f5f1ff;border:1px solid rgba(124,92,228,.10);font-size:8.5px;font-weight:700;color:#685a8b}
.auth-page.sso-page .auth-card,.auth-page.reset-page .auth-card{padding-inline:38px!important}.auth-page.sso-page .auth-card-head h2{font-size:31px!important}.auth-page.sso-page .auth-scene-center{border-radius:22px!important;transform:translate(-50%,-50%) scale(.66)!important}.auth-page.sso-page .auth-scene{background:radial-gradient(circle at 50% 50%,rgba(124,92,228,.12),transparent 29%),rgba(255,255,255,.76)!important}
.auth-page.signup-page .auth-scene{background:radial-gradient(circle at 50% 58%,rgba(255,111,150,.09),transparent 30%),rgba(255,255,255,.76)!important}.auth-page.signup-page .auth-scene-center{transform:translate(-50%,-50%) scale(.66) rotate(-2deg)!important}
.auth-page.reset-page .reset-visual-card{flex:1 1 auto!important;height:auto!important;min-height:190px!important;max-height:245px!important;margin:17px 0 12px!important;border-radius:20px!important}.auth-page.reset-page .reset-envelope{transform:scale(.63)!important}.auth-page.reset-page .reset-lock{transform:scale(.80)!important}.auth-page.reset-page .reset-form{margin-top:12px!important}

/* Auth header wordmark is a fixed Latin lockup on both languages. */
body.auth-page .site-header .brand.brand-real,
html[dir="rtl"] body.auth-page .site-header .brand.brand-real{width:255px!important;min-width:255px!important;max-width:255px!important;gap:12px!important;direction:ltr!important;margin:0!important}
body.auth-page .site-header .brand-logo-img,
html[dir="rtl"] body.auth-page .site-header .brand-logo-img{width:39px!important;height:39px!important;flex:0 0 39px!important}
body.auth-page .site-header .brand-copy,
html[dir="rtl"] body.auth-page .site-header .brand-copy{width:195px!important;min-width:195px!important;direction:ltr!important;text-align:left!important;font-family:"Inter",Arial,sans-serif!important}
body.auth-page .site-header .brand-copy strong,
html[dir="rtl"] body.auth-page .site-header .brand-copy strong{font-family:"Inter",Arial,sans-serif!important;font-size:21px!important;letter-spacing:-.82px!important;line-height:1!important}
body.auth-page .site-header .brand-copy small,
html[dir="rtl"] body.auth-page .site-header .brand-copy small{font-family:"Inter",Arial,sans-serif!important;font-size:7px!important;letter-spacing:1.72px!important;line-height:1!important;margin-top:6px!important}

/* 3) Arabic annual switch: the switch itself remains LTR (off=left, on=right),
   while the Arabic label sits cleanly on its right and never wraps. */
.reference-pricing-ar .reference-plan-title{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;gap:16px!important;direction:rtl!important}
.reference-pricing-ar .annual-control{direction:ltr!important;flex-direction:row-reverse!important;align-items:center!important;gap:8px!important;white-space:nowrap!important;min-width:max-content!important;font-family:"Noto Sans Arabic","Inter",Tahoma,sans-serif!important;font-size:11px!important;padding-top:3px!important}
.reference-pricing-ar .annual-control span{direction:rtl!important;white-space:nowrap!important;line-height:1.2!important}
.reference-pricing-ar .annual-control i{direction:ltr!important;flex:0 0 39px!important;width:39px!important;height:23px!important;background:#d8d3df!important}
.reference-pricing-ar .annual-control i::after{left:3px!important;right:auto!important;transform:translateX(0)!important}
.reference-pricing-ar .annual-control input:checked + i{background:var(--brand)!important}
.reference-pricing-ar .annual-control input:checked + i::after{transform:translateX(16px)!important}
.reference-pricing-ar .reference-price-row{direction:rtl!important;justify-content:flex-start!important}.reference-pricing-ar .reference-saving{margin-right:auto!important;margin-left:0!important}

@media(max-height:720px) and (min-width:901px){
  .auth-page .auth-shell{height:calc(100dvh - 82px)!important}.auth-page .auth-visual{padding:20px 24px!important}.auth-page .auth-card{padding-top:20px!important;padding-bottom:20px!important}.auth-page .auth-hero-title{font-size:38px!important}.auth-page .auth-scene,.auth-page .auth-scene-v43,.auth-page.reset-page .reset-visual-card{min-height:155px!important;max-height:190px!important}.auth-page .auth-proof-polished{display:none!important}.auth-page .auth-card-head{margin-bottom:9px!important}.auth-page .google-auth-btn{height:39px!important;min-height:39px!important}.auth-page .auth-form input[type="email"],.auth-page .auth-form input[type="password"],.auth-page .auth-form input[type="text"]{height:39px!important;min-height:39px!important}.auth-page .auth-submit{height:39px!important;min-height:39px!important}.auth-page .auth-divider{margin:8px 0!important}.auth-page .auth-form{gap:7px!important}
}
@media(max-width:900px){
  body.auth-page{height:auto!important;min-height:100dvh!important;overflow:auto!important}body.auth-page main{height:auto!important;min-height:calc(100dvh - 64px)!important;overflow:visible!important;padding:20px 0 34px!important}.auth-page .auth-shell{height:auto!important;grid-template-columns:1fr!important;width:min(560px,calc(100% - 28px))!important}.auth-page .auth-visual{display:none!important}.auth-page .auth-card{height:auto!important;padding:30px 24px!important}
}

/* ============================================================
   V49 — contact picker, legal checkbox, favicon polish
   ============================================================ */

/* Keep the direct-contact cards clearly separated from the note below. */
.contact-info{gap:0!important}
.contact-methods{margin-bottom:22px!important}
.contact-method:nth-child(2){margin-bottom:0!important}
.contact-note{
  margin-top:20px!important;
  padding:22px 24px!important;
  border-top:1px solid rgba(124,92,228,.10)!important;
}

/* Compact, readable international phone picker. */
.phone-composite{
  min-height:50px!important;
  border-radius:14px!important;
}
.phone-country-trigger{
  min-width:104px!important;
  padding:0 10px!important;
  gap:7px!important;
  font:600 12px/1 "Inter",sans-serif!important;
}
.phone-country-trigger .flag{font-size:18px!important;line-height:1!important}
.phone-country-trigger .dial{font-size:12px!important;white-space:nowrap!important}
.phone-country-trigger .chev{font-size:9px!important}
.phone-number-input{
  font-size:14px!important;
  padding:0 13px!important;
}
.phone-country-menu{
  width:min(320px,calc(100vw - 40px))!important;
  max-height:min(390px,58vh)!important;
  border-radius:15px!important;
  padding:8px!important;
  box-shadow:0 18px 44px rgba(36,27,57,.14)!important;
}
.phone-country-search{
  height:38px!important;
  margin-bottom:6px!important;
  border-radius:10px!important;
  padding:0 11px!important;
  font:500 12px "Inter",sans-serif!important;
}
.phone-country-list{
  max-height:300px!important;
  scroll-behavior:smooth;
}
.phone-country-option{
  grid-template-columns:24px minmax(0,1fr) auto!important;
  min-height:42px!important;
  gap:8px!important;
  padding:7px 9px!important;
  border-radius:9px!important;
  font-size:12.5px!important;
  line-height:1.2!important;
}
.phone-country-option>span:nth-child(2){
  min-width:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.phone-country-option .flag{font-size:17px!important;line-height:1!important}
.phone-country-option .dial{font-size:11.5px!important;white-space:nowrap!important}
html[dir="rtl"] .phone-country-search{
  font-family:"Noto Sans Arabic","Inter",sans-serif!important;
  text-align:right!important;
  font-size:11.5px!important;
}
html[dir="rtl"] .phone-country-option{
  font-family:"Noto Sans Arabic","Inter",sans-serif!important;
  font-size:12px!important;
}
html[dir="rtl"] .phone-country-option .dial{
  font-family:"Inter",sans-serif!important;
  direction:ltr!important;
}

/* Legal checkbox: compact custom control with predictable EN/AR wrapping. */
.auth-page .legal-check{
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr)!important;
  align-items:start!important;
  column-gap:9px!important;
  width:100%!important;
  margin:2px 0 0!important;
  color:#6e6879!important;
  font-size:10px!important;
  line-height:1.5!important;
  cursor:pointer!important;
}
.auth-page .legal-check input[type="checkbox"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  margin:0!important;
  border:1.5px solid #aaa3b4!important;
  border-radius:5px!important;
  background:#fff!important;
  display:grid!important;
  place-items:center!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.auth-page .legal-check input[type="checkbox"]::after{
  content:"";
  width:8px;
  height:4px;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(-45deg) scale(0);
  transition:transform .16s ease;
  margin-top:-2px;
}
.auth-page .legal-check input[type="checkbox"]:checked{
  background:linear-gradient(135deg,#8a69ee,#6f4be2)!important;
  border-color:#7654e5!important;
}
.auth-page .legal-check input[type="checkbox"]:checked::after{transform:rotate(-45deg) scale(1)}
.auth-page .legal-check span{min-width:0!important;display:block!important}
.auth-page .legal-check a{font-weight:700!important;text-underline-offset:2px!important}
html[dir="rtl"] .auth-page .legal-check{
  direction:rtl!important;
  grid-template-columns:18px minmax(0,1fr)!important;
  text-align:right!important;
  font-family:"Noto Sans Arabic","Inter",sans-serif!important;
}
html[dir="rtl"] .auth-page .legal-check input[type="checkbox"]{grid-column:1!important}
html[dir="rtl"] .auth-page .legal-check span{grid-column:2!important}

/* Slightly more breathing room around the selected-plan block on signup. */
.auth-page .signup-plan-box{margin-bottom:5px!important}
html[dir="rtl"] .auth-page .signup-plan-box{font-family:"Noto Sans Arabic","Inter",sans-serif!important}

@media(max-width:760px){
  .phone-country-menu{width:min(300px,calc(100vw - 28px))!important}
  .phone-country-option{font-size:11.5px!important}
  .auth-page .legal-check{font-size:9.5px!important}
}


/* ============================================================
   V50 — normal legal checkbox, image flags, coverage→schema links
   ============================================================ */

/* Signup legal checkbox: ordinary small checkbox immediately beside copy. */
.auth-page .auth-form .legal-check{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:100%!important;
  margin:3px 0 2px!important;
  font-size:11px!important;
  line-height:1.45!important;
  color:#6e6879!important;
  cursor:pointer!important;
}
.auth-page .auth-form .legal-check input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:checkbox!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:3px!important;
  background:transparent!important;
  box-shadow:none!important;
  accent-color:#7453e5!important;
  flex:0 0 16px!important;
}
.auth-page .auth-form .legal-check input[type="checkbox"]::after{content:none!important;display:none!important}
.auth-page .auth-form .legal-check span{
  display:inline!important;
  min-width:0!important;
  flex:1 1 auto!important;
}
html[dir="rtl"] .auth-page .auth-form .legal-check{
  direction:rtl!important;
  text-align:right!important;
  flex-direction:row!important;
  justify-content:flex-start!important;
  font-family:"Noto Sans Arabic","Inter",sans-serif!important;
  font-size:11.5px!important;
}
html[dir="rtl"] .auth-page .auth-form .legal-check input[type="checkbox"]{
  order:0!important;
  margin:0!important;
}
html[dir="rtl"] .auth-page .auth-form .legal-check span{order:1!important}

/* Real image flags — avoids Windows displaying emoji flags as SA / AE / KW text. */
.phone-country-trigger .flag-img,
.phone-country-option .flag-img{
  display:block!important;
  width:22px!important;
  height:16px!important;
  object-fit:cover!important;
  border-radius:3px!important;
  box-shadow:0 0 0 1px rgba(20,19,32,.10)!important;
  flex:0 0 auto!important;
}
.phone-country-trigger .flag-img{width:24px!important;height:18px!important}
.phone-country-option{grid-template-columns:24px minmax(0,1fr) auto!important}
html[dir="rtl"] .phone-country-trigger{direction:ltr!important}
html[dir="rtl"] .phone-country-option{direction:rtl!important}
html[dir="rtl"] .phone-country-option .flag-img{grid-column:auto!important}

/* Coverage cards are now clear navigation into the underlying data structure. */
.coverage-schema-link{
  display:block!important;
  color:inherit!important;
  text-decoration:none!important;
  position:relative!important;
  cursor:pointer!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.coverage-schema-link:hover{
  transform:translateY(-5px)!important;
  border-color:rgba(124,92,228,.24)!important;
  box-shadow:0 22px 54px rgba(80,58,155,.12)!important;
}
.coverage-schema-cta{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  margin-top:14px!important;
  padding:8px 11px!important;
  border-radius:999px!important;
  background:#f2edff!important;
  color:#6548cf!important;
  font-size:11px!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
}
html[dir="rtl"] .coverage-schema-cta{
  font-family:"Noto Sans Arabic","Inter",sans-serif!important;
  font-size:11.5px!important;
}

@media(max-width:760px){
  .auth-page .auth-form .legal-check{font-size:10.5px!important}
  html[dir="rtl"] .auth-page .auth-form .legal-check{font-size:11px!important}
}


/* ============================================================
   V51 — sticky Contact side panel + single Coverage → Data Schema CTA
   ============================================================ */

/* The Contact info panel follows the form while scrolling on desktop,
   then releases naturally at the end of the contact grid. */
@media (min-width:1051px){
  body.contact-page .contact-panel{
    align-items:start!important;
  }
  body.contact-page .contact-info{
    position:sticky!important;
    top:108px!important;
    align-self:start!important;
    min-height:0!important;
    max-height:calc(100vh - 132px)!important;
    overflow:auto!important;
    scrollbar-width:none!important;
    z-index:2!important;
  }
  body.contact-page .contact-info::-webkit-scrollbar{display:none!important}
  body.contact-page .contact-form{align-self:start!important}
}
@media (max-width:1050px){
  body.contact-page .contact-info{
    position:relative!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

/* Coverage information cards are informational again — no per-card CTA. */
.coverage-cards .coverage-card{
  cursor:default!important;
  text-decoration:none!important;
}
.coverage-cards .coverage-card:hover{
  transform:translateY(-3px)!important;
}
.coverage-schema-cta{display:none!important}

/* One clear next-step card at the bottom of Coverage. */
.coverage-next-section{
  margin-top:34px!important;
  margin-bottom:70px!important;
}
.coverage-next-card{
  position:relative;
  overflow:hidden;
  min-height:390px;
  border:1px solid rgba(124,92,228,.14);
  border-radius:34px;
  padding:62px 56px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#141320;
  background:
    radial-gradient(circle at 82% 14%,rgba(124,92,228,.18),transparent 31%),
    radial-gradient(circle at 10% 90%,rgba(238,128,164,.10),transparent 28%),
    linear-gradient(rgba(124,92,228,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(124,92,228,.055) 1px,transparent 1px),
    #fff;
  background-size:auto,auto,58px 58px,58px 58px,auto;
  box-shadow:0 24px 60px rgba(69,52,135,.07);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.coverage-next-card::after{
  content:"";
  position:absolute;
  width:420px;height:420px;border-radius:50%;
  right:-150px;top:-190px;
  border:1px solid rgba(124,92,228,.09);
  box-shadow:0 0 0 70px rgba(124,92,228,.025),0 0 0 140px rgba(124,92,228,.018);
  pointer-events:none;
}
.coverage-next-card:hover{
  transform:translateY(-5px);
  border-color:rgba(124,92,228,.24);
  box-shadow:0 30px 74px rgba(69,52,135,.11);
}
.coverage-next-pill{
  position:relative;z-index:1;
  display:inline-flex;
  padding:10px 17px;
  border-radius:999px;
  border:1px solid rgba(20,19,32,.08);
  background:rgba(255,255,255,.9);
  box-shadow:0 8px 20px rgba(20,19,32,.05);
  font-size:12px;
  font-weight:800;
  letter-spacing:.09em;
  color:#59536b;
  margin-bottom:24px;
}
.coverage-next-card h2{
  position:relative;z-index:1;
  max-width:920px;
  margin:0;
  font-size:clamp(42px,5vw,72px);
  line-height:1.02;
  letter-spacing:-.055em;
  font-weight:800;
}
.coverage-next-card p{
  position:relative;z-index:1;
  max-width:760px;
  margin:22px 0 30px;
  color:#706a82;
  font-size:17px;
  line-height:1.65;
}
.coverage-next-button{
  position:relative;z-index:1;
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:16px 24px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,#8265e9,#6947dd);
  box-shadow:0 14px 30px rgba(124,92,228,.20);
  font-weight:750;
}
.coverage-next-button b{font-size:18px}
html[dir="rtl"] .coverage-next-pill{letter-spacing:0}
html[dir="rtl"] .coverage-next-card h2{letter-spacing:-.035em;line-height:1.18}
html[dir="rtl"] .coverage-next-card p{line-height:1.9}

@media(max-width:760px){
  .coverage-next-card{min-height:320px;padding:42px 24px;border-radius:26px}
  .coverage-next-card h2{font-size:40px}
  .coverage-next-card p{font-size:15px}
}


/* ============================================================
   V52 — page flow + legal navigation polish
   ============================================================ */
.coverage-next-card.coverage-next-static {
  cursor: default;
}
.coverage-next-card.coverage-next-static:hover {
  transform: none !important;
}
.coverage-next-card.coverage-next-static .coverage-next-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.coverage-next-card.coverage-next-static .coverage-next-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(91,63,196,.22);
  filter: saturate(1.04);
}
.coverage-next-card.coverage-next-static .coverage-next-button:focus-visible {
  outline: 3px solid rgba(124,92,228,.28);
  outline-offset: 4px;
}
.tutorial-next-section { margin-top: clamp(28px,4vw,56px); }

/* Legal TOC follows the document and keeps the current numbered section visible. */
.legal-page .legal-layout { align-items: start !important; }
.legal-page .legal-toc {
  position: sticky !important;
  top: 106px !important;
  align-self: start !important;
  height: max-content;
  max-height: calc(100vh - 128px) !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.legal-page .legal-toc a.active,
.legal-page .legal-toc a[aria-current="true"] {
  background: #F1ECFD !important;
  color: #5B3FC4 !important;
  font-weight: 700;
  box-shadow: inset 3px 0 0 #7C5CE4;
}
html[dir="rtl"] .legal-page .legal-toc a.active,
html[dir="rtl"] .legal-page .legal-toc a[aria-current="true"] {
  box-shadow: inset -3px 0 0 #7C5CE4;
}
.legal-page .legal-section-card {
  scroll-margin-top: 124px;
}
@media (max-width:980px) {
  .legal-page .legal-toc {
    position: relative !important;
    top: auto !important;
    max-height: none !important;
  }
  .legal-page .legal-section-card { scroll-margin-top: 104px; }
}
