/* ============================================================
   AI-College · "קורס סוכני AI" sales page
   Ink and paper as the base, one AI spectrum (violet, blue, cyan)
   for everything that thinks, green for money, red for loss.
   Dark sections carry a live neural net or a slow aurora.
   ============================================================ */
@font-face { font-family: 'Birzia'; src: url('/assets/fonts/Birzia-Medium.woff2') format('woff2'), url('/assets/fonts/Birzia-Medium.woff') format('woff'); font-weight: 400 500; font-display: swap; unicode-range: U+0590-05FF, U+FB1D-FB4F, U+0020-0040, U+005B-0060, U+007B-007E, U+00A0-00BF, U+2000-206F, U+20AA, U+2190-21FF, U+2713-2714; }
@font-face { font-family: 'Birzia'; src: url('/assets/fonts/Birzia-Bold.woff2') format('woff2'), url('/assets/fonts/Birzia-Bold.woff') format('woff'); font-weight: 600 700; font-display: swap; unicode-range: U+0590-05FF, U+FB1D-FB4F, U+0020-0040, U+005B-0060, U+007B-007E, U+00A0-00BF, U+2000-206F, U+20AA, U+2190-21FF, U+2713-2714; }
@font-face { font-family: 'Birzia'; src: url('/assets/fonts/Birzia-Black.woff2') format('woff2'), url('/assets/fonts/Birzia-Black.woff') format('woff'); font-weight: 800 900; font-display: swap; unicode-range: U+0590-05FF, U+FB1D-FB4F, U+0020-0040, U+005B-0060, U+007B-007E, U+00A0-00BF, U+2000-206F, U+20AA, U+2190-21FF, U+2713-2714; }

:root {
  color-scheme: light;
  --paper: #ffffff; --soft: #f5f5f8; --ink: #0b0b12; --ink2: #3a3a48; --mut: #6b6b7b; --mut2: #9b9bab;
  --line: #e6e6ee; --line2: #d2d2de;
  --night: #07070d; --night2: #0f0f1a; --night3: #171726; --wline: #262638; --white: #f7f7fb; --wmut: #a5a5bb;
  --v: #7c3aed; --b: #3b82f6; --c: #06b6d4; --g: #16a34a; --g2: #22c55e; --r: #e11d48; --y: #f59e0b;
  --v-s: rgba(124, 58, 237, .1); --b-s: rgba(59, 130, 246, .1); --c-s: rgba(6, 182, 212, .1); --g-s: rgba(22, 163, 74, .09); --r-s: rgba(225, 29, 72, .08); --y-s: rgba(245, 158, 11, .12);
  --grad: linear-gradient(100deg, #7c3aed 0%, #3b82f6 50%, #06b6d4 100%);
  --grad-soft: linear-gradient(100deg, rgba(124,58,237,.14), rgba(59,130,246,.12), rgba(6,182,212,.14));
  --pad: clamp(16px, 4vw, 64px);
  --max: 1180px;
  --r16: 16px;
  --f: 'Birzia', 'Heebo', 'Segoe UI', Arial, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, 'Birzia', monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }
.nw { white-space: nowrap; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 76px; }
body { font-family: var(--f); font-weight: 500; font-size: 16.5px; line-height: 1.75; color: var(--ink); background: var(--paper); overflow-x: hidden; }
img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
ul, ol { list-style: none; }
h1, h2, h3 { font-weight: 700; line-height: 1.25; letter-spacing: -.005em; text-wrap: balance; }
input, select, textarea, button { font: inherit; }
input, select, textarea { font-size: 16px; }
.mono { font-family: var(--mono); font-weight: 500; }
.num { font-variant-numeric: tabular-nums; unicode-bidi: isolate; }
.hp { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden; clip: rect(0 0 0 0); opacity: 0; pointer-events: none; }
.skip-link { position: absolute; top: -60px; inset-inline-start: 16px; z-index: 1000; background: var(--ink); color: #fff; font-weight: 700; padding: 10px 16px; border-radius: 0 0 8px 8px; text-decoration: none; }
.skip-link:focus { top: 0; }
:focus-visible { outline: 2px solid var(--b); outline-offset: 3px; border-radius: 6px; }
.wrap { width: 100%; max-width: calc(var(--max) + 2 * var(--pad)); padding-inline: var(--pad); margin-inline: auto; position: relative; }
.narrow { max-width: calc(780px + 2 * var(--pad)); }

/* ---------- type ---------- */
.h1 { font-size: clamp(28px, 3.3vw, 46px); font-weight: 800; line-height: 1.2; margin-bottom: 18px; }
.h2 { font-size: clamp(23px, 2.4vw, 34px); margin-bottom: 16px; }
.kick { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; color: var(--v); margin-bottom: 12px; }
.kick::before { content: ""; width: 20px; height: 2px; border-radius: 2px; background: var(--grad); }
.dark .kick { color: #b79cff; }
.lede { font-size: clamp(16.5px, 1.25vw, 18.5px); color: var(--ink2); max-width: 60ch; margin-bottom: 26px; }
.sub { font-size: 17px; color: var(--ink2); max-width: 64ch; }
.fine { font-size: 13px; color: var(--mut); }
.prose p { color: var(--ink2); font-size: 16.5px; margin-bottom: 14px; max-width: 66ch; }
.prose p:last-child { margin-bottom: 0; }
.grad-text { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; background-size: 200% 100%; animation: gradShift 8s ease-in-out infinite; }
@keyframes gradShift { 50% { background-position: 100% 0; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.money { position: relative; isolation: isolate; display: inline-block; white-space: nowrap; color: #4ade80; text-shadow: 0 0 28px rgba(74,222,128,.45); }
.money::after { content: ""; position: absolute; inset-inline: -4px; bottom: .06em; height: .2em; border-radius: 99px; background: linear-gradient(90deg, rgba(34,197,94,.55), rgba(163,230,53,.55)); z-index: -1; transform: scaleX(0); transform-origin: right; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.money.landed::after { transform: scaleX(1); }
.money-n { display: inline-grid; direction: ltr; }
.money-n > span { grid-area: 1 / 1; text-align: center; font-variant-numeric: tabular-nums; }
.money-ghost { visibility: hidden; }
.money.landed .money-n { animation: moneyPop .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes moneyPop { 40% { transform: scale(1.22); } }
.dark .grad-text { background: linear-gradient(100deg, #b79cff, #7fb0ff 50%, #5ee0f5); -webkit-background-clip: text; background-clip: text; background-size: 200% 100%; }
.strike-red { position: relative; white-space: nowrap; color: #ff8fa6; }
.strike-red::after { content: ""; position: absolute; inset-inline: 0; bottom: -4px; height: 5px; border-radius: 4px; background: var(--r); transform: scaleX(0); transform-origin: right; transition: transform .6s ease .5s; }
.in .strike-red::after, .no-js .strike-red::after { transform: scaleX(1); }

/* ---------- buttons ---------- */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid transparent; border-radius: 999px; padding: 12px 22px; font-weight: 700; font-size: 15.5px; text-decoration: none; cursor: pointer; transition: transform .15s ease, box-shadow .25s ease, background .2s ease, border-color .2s ease, color .2s ease; white-space: nowrap; overflow: hidden; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: none; }
.btn-sm { padding: 8px 16px; font-size: 14px; }
.btn-lg { padding: 15px 26px; font-size: 16.5px; }
.btn-block { width: 100%; }
.btn-grad { color: #fff; background: var(--grad); background-size: 160% 100%; box-shadow: 0 10px 28px rgba(92, 70, 240, .35), inset 0 1px 0 rgba(255,255,255,.25); }
.btn-grad:hover { background-position: 100% 0; box-shadow: 0 14px 36px rgba(59, 130, 246, .45), inset 0 1px 0 rgba(255,255,255,.25); }
.btn-shine::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent); transform: skewX(-20deg); animation: shine 3.6s ease-in-out infinite; }
@keyframes shine { 0%, 60% { left: -60%; } 100% { left: 130%; } }
.btn-dark { color: #fff; background: var(--ink); }
.btn-line { color: inherit; background: transparent; border-color: currentColor; }
.btn-line:hover { background: rgba(127,127,160,.12); }
.btn-ghost { color: #fff; background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.22); backdrop-filter: blur(6px); }
.btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,.12); }
.arr { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.btn:hover .arr { transform: translateX(-4px); }

/* ---------- reveal ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease var(--d, 0s), transform .6s cubic-bezier(.2,.7,.2,1) var(--d, 0s); }
.reveal.in, .no-js .reveal { opacity: 1; transform: none; }

/* ---------- progress ---------- */
.progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 80; pointer-events: none; }
.progress span { display: block; height: 100%; width: 100%; background: var(--grad); transform-origin: right; transform: scaleX(var(--p, 0)); }

/* ---------- sections ---------- */
.sec { padding-block: clamp(64px, 8vw, 112px); position: relative; }
.soft { background: var(--soft); }
.dark { background: var(--night); color: var(--white); position: relative; overflow: hidden; }
.dark .prose p, .dark .sub { color: #c9c9da; }
.sec-head { max-width: 840px; margin-bottom: clamp(28px, 4vw, 48px); }
.two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 6vw, 88px); align-items: center; }

/* ---------- navbar ---------- */
.nav { position: sticky; top: 0; z-index: 60; background: rgba(7,7,13,.96); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(255,255,255,.08); color: var(--white); transition: background .3s ease, color .3s ease, border-color .3s ease; }
.nav.light { background: rgba(255,255,255,.96); color: var(--ink); border-color: var(--line); }
.nav-in { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 68px; }
.nav-grid { display: grid; grid-template-columns: 1fr auto 1fr; position: static; }
.nav-logo { justify-self: start; display: flex; align-items: center; padding-block: 10px; text-decoration: none; }
.nav-logo img { width: 136px; height: auto; display: block; transition: filter .3s ease; }
.nav.light .nav-logo img { filter: invert(1); }
.nav-links { display: flex; align-items: center; gap: 2px; padding: 4px; border-radius: 999px; border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.03); font-size: 14.5px; font-weight: 500; transition: background .3s ease, border-color .3s ease; }
.nav-links a:not(.btn) { padding: 7px 16px; border-radius: 999px; color: #b9b9cc; text-decoration: none; transition: color .2s ease, background .2s ease; }
.nav-links a:not(.btn):hover, .nav-links a:not(.btn):focus-visible { color: #fff; background: rgba(255,255,255,.06); }
.nav-links a[aria-current] { color: #fff; background: rgba(255,255,255,.11); }
.nav.light .nav-links { border-color: var(--line); background: rgba(11,11,18,.025); }
.nav.light .nav-links a:not(.btn) { color: var(--ink2); }
.nav.light .nav-links a:not(.btn):hover, .nav.light .nav-links a:not(.btn):focus-visible { color: var(--ink); background: rgba(11,11,18,.05); }
.nav.light .nav-links a[aria-current] { color: var(--ink); background: rgba(11,11,18,.08); }
.nav-end { justify-self: end; display: flex; align-items: center; gap: 10px; }
.nav-cta { padding: 9px 18px; gap: 8px; box-shadow: 0 6px 18px rgba(92,70,240,.3), inset 0 1px 0 rgba(255,255,255,.25); }
.nav-cta svg, .nav-menu-cta svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.nav-cta:hover svg, .nav-menu-cta:hover svg { transform: translateX(-3px); }
.cta-sm, .nav-menu-cta, .nav-burger { display: none; }
.nav-burger { position: relative; width: 42px; height: 42px; border-radius: 12px; border: 1px solid rgba(255,255,255,.14); background: transparent; color: inherit; cursor: pointer; }
.nav-burger span { position: absolute; left: 12px; right: 12px; height: 2px; border-radius: 2px; background: currentColor; transition: top .25s ease, transform .25s ease; }
.nav-burger span:first-child { top: 16px; }
.nav-burger span:last-child { top: 24px; }
.nav-open .nav-burger span:first-child { top: 20px; transform: rotate(45deg); }
.nav-open .nav-burger span:last-child { top: 20px; transform: rotate(-45deg); }
.nav.light .nav-burger { border-color: var(--line2); }

/* ============================================================ hero */
.hero { padding-block: clamp(44px, 6vw, 92px) clamp(56px, 7vw, 100px); }
.net { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .7; }
.aurora { position: absolute; inset: 0; pointer-events: none; filter: blur(70px); opacity: .55; }
.aurora i { position: absolute; width: 46vw; height: 46vw; max-width: 620px; max-height: 620px; border-radius: 50%; animation: drift 18s ease-in-out infinite alternate; }
.aurora i:nth-child(1) { background: #6d28d9; top: -20%; right: -8%; }
.aurora i:nth-child(2) { background: #1d4ed8; bottom: -30%; left: 10%; animation-delay: -6s; }
.aurora i:nth-child(3) { background: #0891b2; top: 30%; left: -12%; width: 30vw; height: 30vw; animation-delay: -12s; opacity: .8; }
@keyframes drift { to { transform: translate(6%, 8%) scale(1.15); } }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(transparent 70%, var(--night)), repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 72px), repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 72px); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.hero .lede { color: #cfd0e2; }
.pill { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; line-height: 1.45; color: #e6e1ff; background: rgba(124,58,237,.16); border: 1px solid rgba(183,156,255,.35); border-radius: 999px; padding: 6px 14px; margin-bottom: 18px; box-shadow: 0 0 30px rgba(124,58,237,.25); }
.pill svg { width: 16px; height: 16px; fill: #b79cff; flex: 0 0 auto; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.warn-line { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #ffb4c4; margin-bottom: 14px; }
.live { width: 8px; height: 8px; border-radius: 50%; background: var(--g2); box-shadow: 0 0 0 0 rgba(34,197,94,.6); animation: pulse 1.8s infinite; flex: 0 0 auto; }
.warn-line .live { background: var(--r); animation-name: pulseR; }
@keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }
@keyframes pulseR { 0% { box-shadow: 0 0 0 0 rgba(225,29,72,.6); } 70% { box-shadow: 0 0 0 8px rgba(225,29,72,0); } 100% { box-shadow: 0 0 0 0 rgba(225,29,72,0); } }
.scramble { display: inline-block; }

/* org chart, glass */
.org { background: rgba(15,15,26,.72); border: 1px solid rgba(255,255,255,.1); border-radius: 22px; padding: 22px 18px 16px; backdrop-filter: blur(10px); box-shadow: 0 40px 90px rgba(0,0,0,.5), 0 0 0 1px rgba(124,58,237,.15), 0 0 80px rgba(59,130,246,.18); }
.org-top { display: flex; justify-content: center; }
.org-boss { display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; font-weight: 700; color: #fff; background: var(--grad); border-radius: 12px; padding: 9px 16px; box-shadow: 0 8px 26px rgba(92,70,240,.45); }
.org-boss small { font-size: 11.5px; font-weight: 500; opacity: .8; }
.org-boss .dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: blink 1.6s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .25; } }
.org-lines { display: block; width: 100%; height: 34px; overflow: visible; }
.org-lines path { fill: none; vector-effect: non-scaling-stroke; }
.org-lines .ln { stroke: rgba(255,255,255,.22); stroke-width: 1.4; }
.org-lines .flow { stroke-width: 2.4; stroke-dasharray: 6 60; stroke-linecap: round; animation: flowDash 2.2s linear infinite; }
.org-lines .flow.v { stroke: #a78bfa; } .org-lines .flow.b { stroke: #60a5fa; animation-delay: -.7s; } .org-lines .flow.c { stroke: #22d3ee; animation-delay: -1.4s; }
@keyframes flowDash { to { stroke-dashoffset: -66; } }
.org-teams { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.org-team { --tc: #a78bfa; display: flex; flex-direction: column; gap: 6px; border: 1px solid rgba(255,255,255,.1); border-top: 2px solid var(--tc); border-radius: 12px; padding: 8px; background: rgba(255,255,255,.03); }
.org-team.t-b { --tc: #60a5fa; } .org-team.t-c { --tc: #22d3ee; }
.org-team-h { font-size: 11.5px; font-weight: 700; color: var(--tc); text-align: center; }
.org-node { font-size: 12.5px; font-weight: 700; text-align: center; color: #d7d7ea; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); border-radius: 9px; padding: 6px; line-height: 1.3; transition: all .3s ease; }
.org-node.on { color: #0b0b12; background: var(--tc); border-color: var(--tc); box-shadow: 0 0 22px var(--tc); transform: translateY(-2px); }
.org-feed { margin-top: 14px; border-top: 1px solid rgba(255,255,255,.08); padding-top: 10px; }
.org-feed-h { font-size: 11.5px; font-weight: 700; color: var(--wmut); display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
.org-feed ul { height: 86px; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; gap: 5px; }
.org-feed li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #d7d7ea; animation: feedIn .45s ease; }
.org-feed li .t { font-family: var(--mono); font-size: 11px; color: #7d7d95; flex: 0 0 auto; }
.org-feed li .tag { font-size: 10.5px; font-weight: 700; border-radius: 5px; padding: 1px 6px; flex: 0 0 auto; color: #0b0b12; }
@keyframes feedIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.hero-video { width: 100%; border-radius: 20px; background: #000; aspect-ratio: 16 / 9; }

/* ============================================================ proof */
.proof { border-bottom: 1px solid var(--line); padding-block: 20px; background: var(--paper); }
.proof-in { display: flex; align-items: center; gap: 28px; }
.proof-stat { flex: 0 0 auto; font-size: 14.5px; color: var(--ink2); }
.proof-stat b { font-size: 24px; font-weight: 800; }
.marquee { flex: 1; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.marquee-track { display: flex; gap: 52px; align-items: center; width: max-content; animation: marquee 34s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-track img { height: 30px; width: auto; transition: transform .2s ease; }
.marquee-track img:hover { transform: scale(1.12); }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(50%); } }

/* ============================================================ pains */
.pains { display: grid; gap: 10px; }
.pains li { display: flex; align-items: center; gap: 14px; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 13px 16px; transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.pains li:hover { transform: translateX(-4px); border-color: var(--line2); box-shadow: 0 10px 30px rgba(20,20,40,.06); }
.pains p { font-size: 16.5px; color: var(--ink2); }
.pains .pains-end { background: var(--ink); border-color: var(--ink); }
.pains .pains-end p { color: #fff; font-weight: 700; }
.two-head .sub { margin-top: 14px; }
.two-pin { align-items: start; }
.two-pin .two-head { position: sticky; top: 110px; }
@media (max-width: 920px) { .two-pin .two-head { position: static; } }
.ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto; }
.ic svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ic-v { background: var(--v-s); color: var(--v); } .ic-b { background: var(--b-s); color: var(--b); } .ic-c { background: var(--c-s); color: #0891b2; }
.ic-r { background: var(--r-s); color: var(--r); } .ic-y { background: var(--y-s); color: #d97706; } .ic-g { background: var(--g-s); color: var(--g); }

/* ============================================================ chat */
.sec-chat::before { content: ""; position: absolute; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(225,29,72,.18), transparent 65%); top: -120px; right: -120px; }
.chatmock { background: #11111c; border: 1px solid var(--wline); border-radius: 18px; overflow: hidden; box-shadow: 0 40px 80px rgba(0,0,0,.45); }
.cm-head { display: flex; align-items: center; gap: 6px; padding: 12px 14px; border-bottom: 1px solid var(--wline); background: #0c0c15; direction: ltr; }
.cm-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff5f57; } .cm-dot:nth-child(2) { background: #febc2e; } .cm-dot:nth-child(3) { background: #28c840; }
.cm-head b { margin-inline-start: 10px; font-size: 12.5px; color: var(--wmut); font-family: var(--mono); font-weight: 500; }
.cm-body { padding: 16px; display: flex; flex-direction: column; gap: 10px; min-height: 300px; }
.cm-row { max-width: 88%; font-size: 14.5px; line-height: 1.55; padding: 10px 13px; border-radius: 14px; animation: feedIn .35s ease; }
.cm-me { align-self: flex-start; background: var(--grad); color: #fff; border-start-start-radius: 4px; }
.cm-bot { align-self: flex-end; background: #1c1c2b; color: #e5e5f2; border: 1px solid var(--wline); border-start-end-radius: 4px; }
.cm-bot .cur { display: inline-block; width: 7px; height: 1em; background: #b79cff; vertical-align: -2px; margin-inline-start: 2px; animation: blink .8s steps(1) infinite; }

/* ============================================================ I know */
.know { margin: 26px 0 30px; display: grid; gap: 10px; }
.know li { display: flex; align-items: center; gap: 14px; font-size: clamp(19px, 1.9vw, 25px); font-weight: 700; border-radius: 14px; padding: 12px 16px; border: 1px solid var(--line); background: var(--paper); }
.know-n { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 15px; color: #fff; background: var(--line2); flex: 0 0 auto; transition: background .4s ease, box-shadow .4s ease; }
.js .know li { opacity: .25; transform: translateX(10px); transition: opacity .5s ease, transform .5s ease, border-color .5s ease, background .5s ease, color .5s ease; }
.js .know li.in { opacity: 1; transform: none; border-color: var(--line2); }
.know li.in .know-n { background: var(--grad); box-shadow: 0 6px 18px rgba(92,70,240,.35); }
.know li:last-child.in { background: var(--ink); color: #fff; border-color: var(--ink); }

/* ============================================================ deal */
.sec-deal::before { content: ""; position: absolute; width: 640px; height: 640px; border-radius: 50%; background: radial-gradient(circle, rgba(245,158,11,.16), transparent 65%); bottom: -220px; left: -160px; }
.big-but { margin-top: 24px; font-size: clamp(19px, 1.8vw, 24px); color: #d0d0e2; border-inline-start: 3px solid #7fb0ff; padding-inline-start: 16px; }
.big-but b { color: #fff; }
.friday { position: relative; }
.shot { position: relative; border-radius: 20px; overflow: hidden; background: var(--grad-soft); aspect-ratio: 16 / 10; }
.shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.shot:hover img { transform: scale(1.04); }
.shot.missing img { display: none; }
.shot.missing::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 30% 30%, rgba(124,58,237,.55), transparent 55%), radial-gradient(circle at 72% 70%, rgba(6,182,212,.5), transparent 55%), repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, transparent 1px 40px), repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 1px, transparent 1px 40px), #0f0f1a; }
.shot-friday { aspect-ratio: 4 / 3; }
.bill { position: absolute; bottom: -26px; inset-inline-start: -22px; width: min(270px, 78%); background: #fffdf6; color: #1c1c1c; border-radius: 6px; padding: 16px 16px 14px; box-shadow: 0 30px 60px rgba(0,0,0,.45); transform: rotate(3deg); font-size: 13.5px; }
.bill::before { content: ""; position: absolute; top: -7px; left: 0; right: 0; height: 8px; background: radial-gradient(circle at 7px 0, transparent 5.5px, #fffdf6 6px) 0 0 / 14px 8px repeat-x; }
.bill-h { font-size: 11.5px; font-weight: 700; color: #777; margin-bottom: 8px; }
.bill li, .bill-t, .bill-vs { display: flex; justify-content: space-between; gap: 10px; }
.bill li { padding-block: 3px; border-bottom: 1px dashed #ddd; }
.bill b { font-family: var(--mono); font-weight: 500; }
.bill-t { margin-top: 8px; font-weight: 700; }
.bill-vs { margin-top: 10px; padding: 8px 10px; border-radius: 8px; background: var(--g-s); color: var(--g); font-weight: 700; }
.bill-vs b { font-weight: 700; }

/* ============================================================ dream */
.notonly { margin-bottom: 20px; }
.notonly li { font-size: 17.5px; padding-block: 11px; border-bottom: 1px solid var(--line); color: var(--mut); }
.notonly li:last-child { color: var(--ink2); border-bottom: 0; }
.notonly li b { color: var(--ink); }
.notonly s { text-decoration: none; background: linear-gradient(var(--r), var(--r)) 100% 55% / 0 2px no-repeat; transition: background-size .7s ease .2s; }
.notonly.in s, .no-js .notonly s { background-size: 100% 2px; }
.thai { position: relative; }
.shot-thai { aspect-ratio: 16 / 11; box-shadow: 0 40px 80px rgba(20,20,60,.18); }
.float-chip { position: absolute; bottom: 18px; inset-inline-end: 18px; display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); border-radius: 999px; padding: 8px 14px; font-size: 14px; font-weight: 700; box-shadow: 0 10px 30px rgba(0,0,0,.2); animation: bob 4s ease-in-out infinite; }
@keyframes bob { 50% { transform: translateY(-6px); } }

/* ---------- typo ---------- */
.typo { font-size: clamp(18px, 1.6vw, 22px); font-weight: 700; margin: 6px 0 24px; }
.typo-wrong { position: relative; display: inline-block; color: var(--r); }
.typo-wrong::after { content: ""; position: absolute; inset-inline: 0; top: 55%; height: 2px; background: var(--r); transform: scaleX(0); transform-origin: right; transition: transform .45s ease .9s; }
.typo-fix { color: var(--g); opacity: 0; transition: opacity .5s ease 1.4s; }
.typo.in .typo-wrong::after, .no-js .typo-wrong::after { transform: scaleX(1); }
.typo.in .typo-fix, .no-js .typo-fix { opacity: 1; }

/* ============================================================ plan / chart */
.story { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(28px, 5vw, 72px); align-items: center; margin-bottom: 36px; }
.chart { border: 1px solid var(--line2); border-radius: var(--r16); padding: 18px 18px 14px; background: var(--paper); box-shadow: 0 20px 50px rgba(20,20,60,.06); }
.chart figcaption { font-size: 13.5px; color: var(--mut); margin-bottom: 14px; }
.bars { display: flex; align-items: flex-end; gap: 8px; height: 230px; border-bottom: 1.5px solid var(--ink); padding-top: 30px; }
.bar { position: relative; flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; outline: none; }
.bar i { display: block; width: 100%; max-width: 38px; height: var(--h); background: linear-gradient(180deg, #60a5fa, #7c3aed); border-radius: 5px 5px 0 0; transform-origin: bottom; transform: scaleY(0); transition: transform .7s cubic-bezier(.2,.7,.2,1) var(--dl, 0s); }
.bar.drop i { background: repeating-linear-gradient(135deg, var(--r) 0 4px, #ffe4ea 4px 8px); }
.bar.top i { background: linear-gradient(180deg, #22d3ee, #3b82f6 50%, #7c3aed); box-shadow: 0 0 24px rgba(59,130,246,.45); }
.bars.in .bar i, .no-js .bar i { transform: scaleY(1); }
.bar b { position: absolute; bottom: calc(var(--h) + 4px); font-family: var(--mono); font-size: 11px; font-weight: 500; color: var(--ink2); opacity: 0; transition: opacity .3s ease calc(var(--dl, 0s) + .5s); }
.bar.drop b { color: var(--r); font-weight: 700; }
.bars.in .bar b, .no-js .bar b { opacity: 1; }
.bar.hire::after { content: "+עובד"; position: absolute; bottom: calc(var(--h) + 22px); font-size: 10px; font-weight: 700; color: var(--r); background: var(--r-s); border-radius: 5px; padding: 0 5px; white-space: nowrap; }
.bar .tip { position: absolute; bottom: calc(var(--h) + 44px); left: 50%; transform: translateX(-50%); width: max-content; max-width: 150px; background: var(--ink); color: #fff; font-size: 12px; line-height: 1.4; padding: 5px 8px; border-radius: 6px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s ease; z-index: 2; }
.bar:nth-child(-n+3) .tip { left: auto; right: 0; transform: none; }
.bar:nth-last-child(-n+3) .tip { left: 0; transform: none; }
.bar:hover .tip, .bar:focus .tip { opacity: 1; visibility: visible; }
.chart-key { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: var(--mut); margin-top: 10px; }
.chart-key span { display: inline-flex; align-items: center; gap: 6px; }
.chart-key i { width: 12px; height: 12px; border-radius: 3px; }
.k-up { background: linear-gradient(180deg, #60a5fa, #7c3aed); }
.k-drop { background: repeating-linear-gradient(135deg, var(--r) 0 3px, #ffe4ea 3px 6px); }
.then-now { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 26px; }
.tn { border: 1px solid var(--line2); border-radius: var(--r16); padding: 22px; background: var(--paper); }
.tn-then { border-top: 3px solid var(--r); }
.tn-now { background: var(--night); color: var(--white); border: 0; box-shadow: 0 30px 60px rgba(20,20,60,.25), inset 0 0 0 1px rgba(124,58,237,.35); }
.tn-h { font-weight: 700; font-size: 17px; margin-bottom: 12px; }
.tn dl div { display: flex; justify-content: space-between; gap: 12px; padding-block: 8px; border-bottom: 1px dashed var(--line2); font-size: 15px; }
.tn-now dl div { border-color: var(--wline); }
.tn dt { color: var(--mut); } .tn-now dt { color: var(--wmut); }
.tn dd { font-weight: 700; }
.meter { height: 9px; border-radius: 99px; background: var(--line); margin-top: 16px; overflow: hidden; }
.tn-now .meter { background: var(--wline); }
.meter span { display: block; height: 100%; width: var(--w); border-radius: 99px; background: var(--r); transform: scaleX(0); transform-origin: right; transition: transform 1.1s cubic-bezier(.2,.7,.2,1) .2s; }
.tn-now .meter span { background: linear-gradient(90deg, #22c55e, #06b6d4); box-shadow: 0 0 16px rgba(34,197,94,.5); }
.tn.in .meter span, .no-js .meter span { transform: scaleX(1); }
.tn-f { margin-top: 8px; font-size: 14px; color: var(--mut); } .tn-now .tn-f { color: var(--wmut); }
.tn-f b { font-size: 24px; color: var(--r); } .tn-now .tn-f b { color: var(--g2); }
.how { font-size: clamp(18px, 1.6vw, 21px); }

/* ============================================================ flow (benefits) */
.flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; position: relative; }
.flow::before { content: ""; position: absolute; top: 44px; inset-inline: 12%; height: 2px; background: linear-gradient(90deg, rgba(34,197,94,.6), rgba(6,182,212,.6), rgba(59,130,246,.6), rgba(124,58,237,.6)); transform: scaleX(0); transform-origin: right; transition: transform 1.4s ease .3s; }
.flow.in::before, .no-js .flow::before { transform: scaleX(1); }
.flow li { position: relative; z-index: 1; background: var(--night2); border: 1px solid var(--wline); border-radius: var(--r16); padding: 22px 18px; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.flow li:hover { transform: translateY(-4px); border-color: #3a3a58; box-shadow: 0 20px 40px rgba(0,0,0,.35); }
.flow-ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; }
.flow-ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.flow-ic.ic-v { background: rgba(124,58,237,.18); color: #b79cff; } .flow-ic.ic-b { background: rgba(59,130,246,.18); color: #7fb0ff; }
.flow-ic.ic-c { background: rgba(6,182,212,.18); color: #5ee0f5; } .flow-ic.ic-g { background: rgba(34,197,94,.16); color: #4ade80; }
.flow h3 { font-size: 18px; margin: 14px 0 6px; }
.flow p { font-size: 14.5px; color: #b9b9cf; }
.flow-end { margin: 24px 0 34px; font-size: 19px; font-weight: 700; }
.pull { font-size: clamp(20px, 2.1vw, 28px); font-weight: 700; line-height: 1.45; border-block: 1px solid var(--wline); padding-block: 26px; margin-bottom: 26px; max-width: 32ch; }
.pull s { color: #8a8aa3; text-decoration-color: var(--r); text-decoration-thickness: 2px; }

/* ============================================================ build your team */
.build-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.build-copy .sub { margin-bottom: 22px; }
.shot-agents { aspect-ratio: 16 / 10; box-shadow: 0 30px 70px rgba(30,20,80,.22); }
.builder { background: var(--paper); border-radius: 22px; padding: clamp(18px, 2.6vw, 28px); box-shadow: 0 30px 70px rgba(20,20,60,.1); position: relative; }
.builder::before { content: ""; position: absolute; inset: 0; border-radius: 22px; padding: 1.5px; background: var(--grad); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.roster { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.agent-chip { --ac: var(--v); display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 700; color: var(--ink2); background: var(--paper); border: 1.5px solid var(--line2); border-radius: 999px; padding: 7px 13px 7px 11px; cursor: pointer; transition: all .2s ease; }
.agent-chip i { width: 9px; height: 9px; border-radius: 50%; background: var(--ac); }
.agent-chip:hover { border-color: var(--ac); }
.agent-chip[aria-pressed="true"] { color: #fff; background: var(--ac); border-color: var(--ac); box-shadow: 0 8px 20px -6px var(--ac); }
.agent-chip[aria-pressed="true"] i { background: #fff; }
.team-view { border: 1px dashed var(--line2); border-radius: 16px; padding: 14px; background: var(--soft); min-height: 150px; }
.tv-boss { width: fit-content; margin: 0 auto 12px; font-size: 13.5px; font-weight: 700; color: #fff; background: var(--grad); border-radius: 10px; padding: 7px 14px; }
.tv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.tv-card { --ac: var(--v); display: flex; align-items: center; gap: 8px; background: var(--paper); border: 1px solid var(--line); border-inline-start: 3px solid var(--ac); border-radius: 10px; padding: 8px 10px; font-size: 13px; font-weight: 700; animation: pop .35s cubic-bezier(.2,1.4,.4,1); }
.tv-card svg { width: 18px; height: 18px; fill: none; stroke: var(--ac); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.tv-empty { grid-column: 1 / -1; text-align: center; color: var(--mut); font-size: 14px; padding: 18px 0; }
@keyframes pop { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: none; } }
.tv-stats { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 8px; margin: 16px 0 8px; }
.tv-stats div { background: var(--soft); border-radius: 12px; padding: 10px 12px; }
.tv-stats dt { font-size: 12.5px; color: var(--mut); line-height: 1.35; }
.tv-stats dd { font-size: 24px; font-weight: 800; }
.tv-stats .tv-cost { background: var(--night); color: #fff; }
.tv-stats .tv-cost dt { color: var(--wmut); }
.tv-stats .tv-cost dd { color: #fda4af; }

/* ============================================================ model calc */
.calc { border-radius: var(--r16); margin: 22px 0; overflow: hidden; background: var(--paper); border: 1px solid var(--line2); box-shadow: 0 20px 50px rgba(20,20,60,.06); }
.calc-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 15px 18px; border-bottom: 1px solid var(--line); font-size: 15.5px; }
.calc-row span { color: var(--ink2); }
.calc-row b { font-size: 18px; white-space: nowrap; }
.calc-row:first-child b { color: var(--g); }
.calc-row:last-child { border-bottom: 0; background: var(--grad); color: #fff; }
.calc-row:last-child span { color: rgba(255,255,255,.88); }
.calc-row:last-child b { font-size: 24px; }
.qa-line { font-size: 17.5px; color: var(--ink2); padding-block: 10px; border-bottom: 1px solid var(--line2); }
.qa-line b { color: var(--ink); }
.deal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: 22px; background: var(--night); color: #fff; border-radius: var(--r16); padding: 18px 20px; }
.deal p { font-size: 18px; }

/* ============================================================ chapters */
.chapters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.chap { --cc: var(--v); position: relative; background: var(--paper); border: 1px solid var(--line2); border-radius: var(--r16); padding: 22px 20px; overflow: hidden; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.chap::before { content: ""; position: absolute; top: 0; inset-inline: 0; height: 3px; background: var(--cc); }
.chap::after { content: ""; position: absolute; width: 160px; height: 160px; border-radius: 50%; background: var(--cc); opacity: .07; top: -60px; inset-inline-end: -60px; transition: opacity .3s ease; }
.chap:hover { transform: translateY(-5px); border-color: var(--cc); box-shadow: 0 24px 50px -20px var(--cc); }
.chap:hover::after { opacity: .14; }
.ch-b { --cc: var(--b); } .ch-c { --cc: #0891b2; } .ch-g { --cc: var(--g); }
.chap-ic { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; background: var(--cc); color: #fff; margin-bottom: 14px; box-shadow: 0 10px 22px -8px var(--cc); }
.chap-ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.chap-n { font-size: 13px; font-weight: 700; color: var(--cc); margin-bottom: 4px; }
.chap h3 { font-size: 18.5px; margin-bottom: 12px; }
.chap ul { display: grid; gap: 7px; }
.chap li { position: relative; padding-inline-start: 18px; font-size: 14.5px; color: var(--ink2); line-height: 1.6; }
.chap li::before { content: ""; position: absolute; inset-inline-start: 0; top: .62em; width: 7px; height: 7px; background: var(--cc); border-radius: 2px; }

/* ============================================================ bonuses */
.bonuses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.bonus { --bc: #a78bfa; position: relative; background: var(--night2); border-radius: 18px; padding: 24px; display: flex; flex-direction: column; gap: 10px; transition: transform .3s ease; }
.bonus::before { content: ""; position: absolute; inset: 0; border-radius: 18px; padding: 1px; background: linear-gradient(140deg, var(--bc), transparent 45%, transparent 60%, var(--bc)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.bonus::after { content: ""; position: absolute; inset: 0; border-radius: 18px; background: radial-gradient(400px circle at var(--mx, 50%) var(--my, 0%), rgba(255,255,255,.07), transparent 60%); pointer-events: none; opacity: 0; transition: opacity .3s ease; }
.bonus:hover { transform: translateY(-4px); }
.bonus:hover::after { opacity: 1; }
.bn-b { --bc: #60a5fa; } .bn-c { --bc: #22d3ee; } .bn-g { --bc: #4ade80; }
.bonus header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.bonus-n { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: #0b0b12; background: var(--bc); border-radius: 7px; padding: 2px 10px; }
.bonus-v { font-size: 13.5px; color: var(--wmut); }
.bonus-v b { color: #4ade80; font-size: 15px; }
.bonus h3 { font-size: 19px; }
.bonus p { font-size: 15px; color: #c3c3d8; }
.bonus .bonus-jab { font-size: 14px; color: #ffd08a; border-inline-start: 2px solid #f59e0b; padding-inline-start: 12px; margin-top: auto; }

/* ============================================================ price / receipt */
.price-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.receipt { position: relative; background: var(--paper); border-radius: 6px 6px 20px 20px; padding: 26px clamp(18px, 3vw, 32px) 28px; box-shadow: 0 40px 90px rgba(30,20,90,.18), 0 0 0 1px var(--line2); }
.receipt::before { content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 9px; background: radial-gradient(circle at 8px 0, transparent 6.5px, var(--paper) 7px) 0 0 / 16px 9px repeat-x; }
.receipt::after { content: ""; position: absolute; top: 0; inset-inline: 0; height: 4px; background: var(--grad); }
.confetti { position: absolute; top: -60px; left: 0; width: 100%; height: calc(100% + 60px); pointer-events: none; z-index: 3; }
#price { overflow-x: clip; }
.rc-top { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; font-weight: 700; color: var(--mut); padding: 6px 0 12px; border-bottom: 1px dashed var(--line2); }
.rc-lines li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-block: 11px; border-bottom: 1px dashed var(--line); font-size: 15px; color: var(--ink2); }
.rc-lines li span { display: inline-flex; align-items: center; gap: 8px; }
.rc-lines b { font-family: var(--mono); font-size: 13.5px; font-weight: 500; white-space: nowrap; }
.dotc { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.dv { background: var(--v); } .db { background: var(--b); } .dc { background: var(--c); } .dg { background: var(--g); }
.rc-total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 14px; font-size: 15px; color: var(--mut); }
.rc-total s { font-family: var(--mono); font-size: 18px; color: var(--mut); text-decoration: none; background: linear-gradient(var(--r), var(--r)) 100% 55% / 0 2px no-repeat; transition: background-size .6s ease; }
.receipt.in .rc-total s, .no-js .rc-total s { background-size: 100% 2px; }
.rc-off { margin: 12px 0 4px; font-size: 14px; color: var(--ink2); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rc-badge { background: var(--r); color: #fff; font-weight: 700; border-radius: 7px; padding: 3px 10px; animation: wiggle 3s ease-in-out infinite; }
@keyframes wiggle { 0%, 90%, 100% { transform: none; } 93% { transform: rotate(-4deg); } 96% { transform: rotate(4deg); } }
.rc-price { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 6px; }
.rc-price > span { font-weight: 700; font-size: 16px; }
.rc-price b { font-size: clamp(42px, 4.4vw, 58px); font-weight: 800; line-height: 1; letter-spacing: -.02em; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rc-price b span { font-size: inherit; }
.rc-save { font-size: 14.5px; color: var(--g); font-weight: 700; margin-top: 6px; text-align: end; }
.rc-pay { font-size: 13.5px; color: var(--mut); text-align: end; margin: 2px 0 18px; }

/* ============================================================ join / form */
.join-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.steps { counter-reset: s; display: grid; margin-top: 8px; }
.steps li { counter-increment: s; display: flex; gap: 14px; align-items: baseline; padding-block: 14px; border-bottom: 1px solid var(--line); font-size: 16px; color: var(--ink2); }
.steps li::before { content: counter(s); font-size: 13px; font-weight: 700; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; color: #fff; background: var(--grad); }
.steps b { color: var(--ink); }
.assure { display: grid; gap: 10px; margin-top: 22px; }
.assure li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: var(--ink2); }
.assure svg { width: 18px; height: 18px; fill: none; stroke: var(--g); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.form { position: relative; direction: rtl; text-align: right; background: var(--paper); border-radius: 22px; padding: clamp(20px, 3vw, 32px); display: grid; gap: 14px; box-shadow: 0 40px 90px rgba(30,20,90,.16); }
.form::before { content: ""; position: absolute; inset: 0; border-radius: 22px; padding: 1.5px; background: var(--grad); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.form-h { font-weight: 700; font-size: 19px; }
.field label { display: block; font-size: 14.5px; font-weight: 700; margin-bottom: 6px; }
.field input { width: 100%; direction: rtl; text-align: right; color: var(--ink); background: var(--soft); border: 1.5px solid var(--line); border-radius: 12px; padding: 12px 14px; min-height: 50px; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.field input[dir=ltr] { direction: ltr; text-align: right; }
.field input::placeholder { color: var(--mut2); }
.field input:hover { border-color: var(--line2); }
.field input:focus { outline: none; background: var(--paper); border-color: var(--b); box-shadow: 0 0 0 4px var(--b-s); }
.field input[aria-invalid="true"] { border-color: var(--r); background: #fff5f7; }
.err { color: var(--r); font-size: 13px; font-weight: 700; margin-top: 5px; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--ink2); cursor: pointer; line-height: 1.55; }
.check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--v); flex: 0 0 auto; }
.check a { color: var(--v); text-underline-offset: 3px; }
.form-note { font-size: 14.5px; min-height: 1.4em; }
.form-note.ok { color: var(--g); font-weight: 700; }
.form-note.bad { color: var(--r); font-weight: 700; }
.form.flash { animation: flash 1.2s ease; }
@keyframes flash { 30% { box-shadow: 0 40px 90px rgba(30,20,90,.16), 0 0 0 8px rgba(59,130,246,.18); } }

/* ============================================================ fit */
.fit { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.fit-col { background: var(--paper); border-radius: 18px; padding: clamp(20px, 3vw, 32px); border: 1px solid var(--line); }
.fit-yes-col { border-top: 4px solid var(--g); background: linear-gradient(180deg, rgba(22,163,74,.07), var(--paper) 40%); }
.fit-no-col { border-top: 4px solid var(--r); background: linear-gradient(180deg, rgba(225,29,72,.06), var(--paper) 40%); }
.fit-h { display: flex; align-items: center; gap: 10px; font-size: 20px; margin-bottom: 12px; }
.fit-badge { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 16px; font-weight: 800; }
.fit-badge.ok { background: var(--g); box-shadow: 0 6px 16px -4px var(--g); }
.fit-badge.no { background: var(--r); box-shadow: 0 6px 16px -4px var(--r); font-size: 20px; }
.fit-col li { position: relative; padding: 12px 0; padding-inline-start: 30px; border-top: 1px solid var(--line); font-size: 15.5px; color: var(--ink2); }
.fit-col li::before { position: absolute; inset-inline-start: 0; top: 13px; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.fit-yes li::before { content: "✓"; background: var(--g-s); color: var(--g); }
.fit-no li::before { content: "×"; background: var(--r-s); color: var(--r); font-size: 15px; }

/* ============================================================ testimonials */
.tms { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.tm { border: 1px solid var(--line2); border-radius: var(--r16); padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.tm p { font-size: 15.5px; color: var(--ink2); }
.tm footer { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.tm img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }

/* ============================================================ team */
.team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.person-img { position: relative; border-radius: 18px; overflow: hidden; }
.person-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(124,58,237,.35)); opacity: 0; transition: opacity .4s ease; }
.person img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: filter .5s ease, transform .6s ease; }
.person:hover img { filter: none; transform: scale(1.04); }
.person:hover .person-img::after { opacity: 1; }
.person figcaption { padding-top: 12px; }
.person b { display: block; font-size: 18px; }
.person .role { display: inline-block; font-family: var(--mono); font-size: 11px; font-weight: 500; margin: 4px 0 8px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.person p { font-size: 14.5px; color: var(--ink2); }

/* ============================================================ faq */
.qa details { border-bottom: 1px solid var(--line2); }
.qa details:first-child { border-top: 1px solid var(--line2); }
.qa summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-block: 18px; font-size: clamp(16px, 1.25vw, 18px); font-weight: 700; transition: color .2s; }
.qa summary:hover { color: var(--v); }
.qa summary::-webkit-details-marker { display: none; }
.qa summary i { width: 30px; height: 30px; border-radius: 50%; background: var(--paper); border: 1px solid var(--line2); position: relative; flex: 0 0 auto; transition: background .25s ease, transform .3s ease, border-color .25s; }
.qa summary i::before, .qa summary i::after { content: ""; position: absolute; top: 50%; left: 50%; width: 11px; height: 2px; border-radius: 2px; background: var(--ink); transform: translate(-50%, -50%); transition: transform .3s ease, background .25s ease; }
.qa summary i::after { transform: translate(-50%, -50%) rotate(90deg); }
.qa details[open] summary i { background: var(--grad); border-color: transparent; transform: rotate(180deg); }
.qa details[open] summary i::before, .qa details[open] summary i::after { background: #fff; }
.qa details[open] summary i::after { transform: translate(-50%, -50%) rotate(0deg); }
.qa-a { overflow: hidden; }
.qa-a p { font-size: 15.5px; color: var(--ink2); padding-bottom: 18px; max-width: 64ch; }
.qa-a a { color: var(--v); }

/* ============================================================ last chance */
.last .aurora { opacity: .45; }
.last-in { position: relative; z-index: 1; }
.last .h2 { font-size: clamp(28px, 3.2vw, 44px); }
.last .btn { margin-top: 26px; white-space: normal; text-align: center; }

/* ============================================================ footer */
.foot { position: relative; background: #040408; color: var(--wmut); padding-block: 64px 100px; font-size: 14px; border-top: 1px solid var(--wline); overflow: hidden; }
.foot::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: var(--grad); opacity: .6; }
.foot-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 72px); }
.foot h3 { font-size: 16px; font-weight: 700; color: var(--white); margin-bottom: 16px; }
.foot a { color: #e5e5f2; text-decoration: none; transition: color .2s ease; }
.foot a:hover, .foot a:focus-visible { color: #b79cff; }
.foot-news { position: relative; }
.foot-glow { position: absolute; inset-inline-start: -30px; top: -20px; width: 130px; height: 130px; border-radius: 50%; background: rgba(124,58,237,.28); filter: blur(46px); pointer-events: none; }
.foot-h2 { position: relative; font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: var(--white); line-height: 1.2; margin-bottom: 12px; }
.foot-news > p { position: relative; margin-bottom: 18px; line-height: 1.7; }
.news-form { position: relative; }
.news-form input[type=email] { width: 100%; height: 50px; border-radius: 999px; border: 1px solid var(--wline); background: rgba(255,255,255,.04); color: var(--white); font: inherit; font-size: 16px; padding: 0 20px 0 58px; text-align: right; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: border-color .2s ease, box-shadow .2s ease; }
.news-form input::placeholder { color: #7d7d95; }
.news-form input:focus { outline: none; border-color: #7c5cff; box-shadow: 0 0 0 4px rgba(124,58,237,.25); }
.news-form input[aria-invalid=true] { border-color: #ff8fa6; }
.news-go { position: absolute; inset-inline-end: 5px; top: 5px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--grad); color: #fff; display: grid; place-items: center; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.news-go:hover, .news-go:focus-visible { transform: scale(1.08); box-shadow: 0 8px 24px rgba(59,130,246,.45); }
.news-go:disabled { opacity: .6; cursor: default; transform: none; }
.news-go svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transform: scaleX(-1); }
.news-note { font-size: 12px; color: #7d7d95; margin-top: 10px; line-height: 1.6; }
.news-note.ok { color: #4ade80; font-size: 13.5px; }
.news-note.bad { color: #ff8fa6; font-size: 13.5px; }
.hp { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.foot-col > a { display: block; padding-block: 5px; }
.foot address { font-style: normal; display: grid; gap: 12px; }
.foot address p { display: flex; align-items: flex-start; gap: 10px; line-height: 1.6; }
.foot address svg, .soc svg { width: 17px; height: 17px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.foot address svg { margin-top: 3px; color: #7fb0ff; }
.soc-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }
.soc { position: relative; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--wline); display: grid; place-items: center; color: #e5e5f2; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.foot .soc:hover, .foot .soc:focus-visible { color: #fff; border-color: transparent; background: var(--grad); transform: translateY(-3px); }
.soc[hidden] { display: none; }
.soc::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translate(-50%, 4px); white-space: nowrap; background: var(--white); color: var(--ink); font-size: 12.5px; font-weight: 700; padding: 6px 10px; border-radius: 8px; box-shadow: 0 10px 24px rgba(0,0,0,.4); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.soc:hover::after, .soc:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.soc-row .soc:first-child::after { left: auto; right: 0; transform: translateY(4px); }
.soc-row .soc:first-child:hover::after, .soc-row .soc:first-child:focus-visible::after { transform: none; }
.foot-top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; padding-bottom: 36px; margin-bottom: 40px; border-bottom: 1px solid var(--wline); }
.foot-top img { width: 300px; max-width: 100%; height: auto; display: block; }
.foot > .wrap { max-width: none; padding-inline: clamp(20px, 4vw, 72px); }
.foot-ask { font-size: 15px; color: var(--wmut); line-height: 1.7; max-width: 52ch; }
.foot .foot-ask a { color: var(--white); text-decoration: underline; text-decoration-color: rgba(183,156,255,.5); text-underline-offset: 4px; }
.foot .foot-ask a:hover { color: #b79cff; }
.foot-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--wline); font-size: 13px; }
.foot-bottom nav { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.foot-legal { font-size: 12px; color: #7d7d95; max-width: 92ch; margin-top: 18px; line-height: 1.7; }
@media (max-width: 1080px) {
  .nav-links a:not(.btn) { padding: 7px 12px; }
  .nav-logo img { width: 124px; } .foot-grid { grid-template-columns: 1fr 1fr; gap: 40px 32px; } }
@media (max-width: 640px) { .foot { padding-top: 48px; } .foot-grid { grid-template-columns: 1fr; gap: 34px; } .foot-col > a { padding-block: 7px; } .foot-bottom { flex-direction: column; align-items: flex-start; } }

/* ============================================================ sticky + exit */
.sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; display: none; align-items: center; justify-content: space-between; gap: 12px; padding: 10px var(--pad) calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(7,7,13,.92); color: #fff; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--wline); transform: translateY(110%); transition: transform .3s ease; }
.sticky.on { transform: none; }
.sticky p { display: flex; align-items: baseline; gap: 8px; }
.sticky b { font-size: 20px; font-weight: 800; }
.sticky s { font-size: 13px; color: #7d7d95; }
.exit { position: fixed; inset: 0; z-index: 950; display: grid; place-items: center; padding: 16px; background: rgba(4,4,10,.7); backdrop-filter: blur(6px); animation: fadeIn .25s ease; }
.exit-card { position: relative; width: min(460px, 100%); background: var(--paper); border-radius: 22px; padding: 30px 26px 22px; text-align: center; box-shadow: 0 40px 100px rgba(0,0,0,.5); animation: pop .35s cubic-bezier(.2,1.3,.4,1); overflow: hidden; }
.exit-card::before { content: ""; position: absolute; top: 0; inset-inline: 0; height: 5px; background: var(--grad); }
.exit-card .kick { justify-content: center; }
.exit-card > p:not(.kick) { color: var(--ink2); margin-bottom: 18px; }
.exit-x { position: absolute; top: 12px; inset-inline-start: 12px; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line2); background: var(--paper); font-size: 20px; line-height: 1; cursor: pointer; color: var(--ink2); }
.exit-no { margin-top: 12px; background: none; border: 0; color: var(--mut); font-size: 14px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
@keyframes fadeIn { from { opacity: 0; } }

/* ============================================================ responsive */
@media (max-width: 1080px) {
  .flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow::before { display: none; }
  .chapters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tv-stats { grid-template-columns: 1fr 1fr; }
  .tv-stats .tv-cost { grid-column: 1 / -1; }
}
@media (max-width: 920px) {
  .nav-grid { grid-template-columns: 1fr auto; }
  .nav-burger { display: block; }
  .nav-links { position: absolute; top: 100%; inset-inline: 0; flex-direction: column; align-items: stretch; gap: 2px; padding: 10px var(--pad) 18px; border: 0; border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 0; background: #07070d; font-size: 16px; box-shadow: 0 24px 40px rgba(0,0,0,.35); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
  .nav-open .nav-links { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease; }
  .nav-links a:not(.btn) { padding: 13px 14px; border-radius: 12px; }
  .nav-menu-cta { display: flex; margin-top: 10px; }
  .nav.light .nav-links { background: #fff; border-color: var(--line); box-shadow: 0 24px 40px rgba(11,11,18,.1); }
  .hero-grid, .two, .story, .price-grid, .join-grid, .build-grid { grid-template-columns: minmax(0, 1fr); }
  .hero-visual { max-width: 520px; width: 100%; margin-inline: auto; }
  .proof-in { flex-direction: column; align-items: stretch; gap: 14px; text-align: center; }
  .friday { margin-bottom: 36px; }
  .bill { inset-inline-start: 8px; }
}
@media (max-width: 820px) {
  .sticky { display: flex; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .nav-in { height: 60px; }
  .nav-logo img { width: 116px; }
  .cta-lg { display: none; }
  .cta-sm { display: inline; }
  .hero-cta .btn { width: 100%; }
  .org { padding: 16px 10px 12px; }
  .org-teams { gap: 5px; }
  .org-team { padding: 6px 4px; }
  .org-team .org-node { font-size: 11.5px; padding: 6px 3px; }
  .org-feed li { font-size: 12px; }
  .then-now, .bonuses, .fit, .chapters, .flow { grid-template-columns: minmax(0, 1fr); }
  .team { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .person { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 14px; align-items: start; }
  .person figcaption { padding-top: 0; }
  .bars { gap: 4px; height: 200px; }
  .bar b { font-size: 10px; }
  .bar.hire::after { font-size: 9px; padding: 0 3px; }
  .rc-lines li { font-size: 14px; }
  .deal { flex-direction: column; align-items: stretch; text-align: center; }
  .calc-row { flex-direction: column; gap: 2px; }
  .bill { position: relative; bottom: auto; inset-inline-start: auto; width: 88%; margin: -48px auto 0; font-size: 12.5px; transform: rotate(2deg); }
  .know li { font-size: 18px; }
  .tv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .marquee-track, .live, .org-boss .dot, .aurora i, .org-lines .flow, .btn-shine::after, .grad-text, .rc-badge, .float-chip, .money-n { animation: none !important; }
}

/* ---------- accessibility widget (shared js/a11y.js) ---------- */
.a11y { position: fixed; bottom: 18px; inset-inline-end: 18px; z-index: 900; font-family: var(--f); direction: rtl; }
@media (max-width: 820px) { .a11y { bottom: 84px !important; } }
.a11y-btn { display: flex; align-items: center; gap: 8px; background: var(--ink); color: #fff; border: 2px solid #fff; border-radius: 999px; padding: 9px 14px; cursor: pointer; font: inherit; font-size: 13.5px; font-weight: 700; box-shadow: 0 8px 24px rgba(0,0,0,.25); }
.a11y-btn svg { width: 20px; height: 20px; fill: #fff; }
.a11y-panel { position: absolute; bottom: 54px; inset-inline-end: 0; width: min(340px, calc(100vw - 32px)); background: #fff; color: #111; border: 1px solid #111; border-radius: 14px; padding: 16px; box-shadow: 0 24px 60px rgba(0,0,0,.3); text-align: start; }
.a11y-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.a11y-head h2 { font-size: 17px; margin: 0; }
.a11y-close { background: none; border: 1px solid #bbb; border-radius: 8px; width: 34px; height: 34px; font-size: 22px; line-height: 1; cursor: pointer; color: #111; }
.a11y-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0 12px; border-bottom: 1px solid #e5e5e5; margin-bottom: 12px; font-size: 14px; font-weight: 600; }
.a11y-font { display: flex; align-items: center; gap: 6px; direction: ltr; }
.a11y-font button { width: 40px; height: 36px; border-radius: 8px; border: 1px solid #bbb; background: #f6f6f6; font: inherit; font-weight: 800; cursor: pointer; color: #111; }
.a11y-font output { min-width: 44px; text-align: center; font-size: 13px; }
.a11y-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.a11y-opt { font: inherit; font-size: 13.5px; font-weight: 600; color: #111; text-align: start; background: #f6f6f6; border: 1px solid #bbb; border-radius: 9px; padding: 10px 12px; padding-inline-start: 32px; cursor: pointer; position: relative; }
.a11y-opt::before { content: ""; position: absolute; inset-inline-start: 11px; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; border-radius: 3px; border: 2px solid #777; background: #fff; }
.a11y-opt[aria-pressed="true"] { border-color: #111; background: #ececec; }
.a11y-opt[aria-pressed="true"]::before { background: #111; border-color: #111; }
.a11y-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; font-size: 13px; }
.a11y-foot a { color: #111; font-weight: 600; }
.a11y-reset { background: none; border: none; font: inherit; font-size: 13px; font-weight: 600; color: #555; cursor: pointer; text-decoration: underline; }
.a11y-guide-bar { display: none; position: fixed; left: 0; right: 0; height: 12px; margin-top: -6px; background: rgba(0,0,0,.12); border-block: 2px solid #111; pointer-events: none; z-index: 899; }
.a11y-font-1 { font-size: 112.5%; } .a11y-font-2 { font-size: 125%; } .a11y-font-3 { font-size: 140%; }
.a11y-contrast body { filter: contrast(1.35); }
.a11y-invert body > *:not(.a11y):not(.a11y-guide-bar) { filter: invert(1); }
.a11y-invert img, .a11y-invert video { filter: invert(1); }
.a11y-mono body > *:not(.a11y):not(.a11y-guide-bar) { filter: grayscale(1); }
.a11y-links a { text-decoration: underline !important; text-decoration-thickness: 2px; }
.a11y-readable body, .a11y-readable body * { font-family: Arial, 'Segoe UI', Helvetica, sans-serif !important; letter-spacing: 0 !important; }
.a11y-spacing body { line-height: 1.95; letter-spacing: .04em; word-spacing: .12em; }
.a11y-motion *, .a11y-motion *::before, .a11y-motion *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.a11y-motion .reveal, .a11y-motion .know li { opacity: 1 !important; transform: none !important; }
.a11y-cursor, .a11y-cursor * { cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'><path d='M4 2l16 10-7 1 4 7-3 1.5-4-7-5 5z' fill='%23000' stroke='%23fff' stroke-width='1.2'/></svg>") 4 2, auto !important; }
.a11y-kbd :focus-visible, .a11y-focus :focus { outline: 3px solid #111 !important; outline-offset: 3px !important; box-shadow: 0 0 0 6px #fff !important; }
@media print { .a11y, .a11y-guide-bar, .sticky, .exit { display: none !important; } }