/* =====================================================================
   Guy Mizinski — Scrolling brand site (Qwilr-inspired) · STYLES
   Modern & energetic · RTL · Secular One + Assistant
   (Structure-first build — palette will be fine-tuned later)
   ===================================================================== */

:root{
  --ink:#0b0c16; --ink-2:#14162a;
  --bg:#ffffff; --bg-alt:#f4f5fb; --bg-soft:#eef0fa;
  --line:#e7e9f3; --line-d:rgba(255,255,255,.12);

  --accent:#4f46e5; --accent-2:#7c3aed; --accent-3:#06b6d4;
  --pop:#c8ff3d;
  --grad:linear-gradient(125deg,#4f46e5 0%,#7c3aed 48%,#06b6d4 100%);
  --grad-soft:linear-gradient(125deg,#eef0ff,#f6efff);

  --blue:#4f46e5; --green:#10b981; --amber:#f59e0b; --purple:#8b5cf6; --pink:#ec4899; --red:#ef4444;
  /* האדום של המילויים נותן 3.76:1 על לבן, מתחת לסף. לטקסט משתמשים בגוון כהה יותר */
  --red-txt:#c81e1e; --green-txt:#0a7d52;

  --txt:#0b0c16; --muted:#5b6478; --faint:#9aa2b6;
  --txt-d:#f3f4fb; --muted-d:#a9b1c6;

  --r:22px; --r-sm:14px;
  --shadow:0 30px 70px -34px rgba(20,20,60,.4);
  --shadow-sm:0 14px 34px -20px rgba(20,20,60,.35);
  --ease:cubic-bezier(.16,1,.3,1);
  --container:1120px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Assistant',system-ui,sans-serif;font-size:17px;direction:rtl;color:var(--txt);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.disp{font-family:'Secular One',sans-serif;font-weight:400;letter-spacing:-.005em;line-height:1.05}
.mono{font-family:'JetBrains Mono',monospace}
/* section headers: centered column, right-aligned text (consistent across the page) */
.sec-head{max-width:840px;margin-inline:auto;text-align:right}
.sec-head .eyebrow{justify-content:flex-start}
/* page-wide: never leave a lone/short word on the last line.
   short paragraphs → balance (even line lengths); long body → pretty */
.disp,h1,h2,h3,h4,h5,.belief,.lead,.sub,.principle-lead,.punch-sub,.p-sub,.hrs,.eyebrow{text-wrap:balance}
p,.tf p,.std p,.ck p,.road-card p{text-wrap:pretty}
::selection{background:var(--accent);color:#fff}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* ---------- progress + nav ---------- */
.progress{position:fixed;top:0;right:0;height:3px;width:0;background:var(--grad);z-index:300;transition:width .1s linear}
.nav{position:fixed;top:0;inset-inline:0;z-index:200;background:rgba(13,12,32,.55);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.nav.scrolled{background:rgba(13,12,32,.9);box-shadow:0 10px 30px -18px rgba(0,0,0,.6)}
.nav-inner{display:flex;align-items:center;gap:8px;padding:14px 36px;max-width:1320px;margin:0 auto}
.nav .logo{display:flex;align-items:center;gap:10px;font-family:'Secular One';font-size:19px;color:#fff;white-space:nowrap}
.nav .logo .mk i{font-size:15px;color:var(--pop)}
.nav .logo img{height:34px;width:auto;display:block}
.nav-menu{display:flex;gap:4px;margin-inline-start:18px}
.nav-item{position:relative}
.nav-item>a,.nav-item>button{display:flex;align-items:center;gap:7px;background:none;border:none;cursor:pointer;
  font-family:inherit;font-size:15px;font-weight:600;color:rgba(255,255,255,.82);padding:9px 14px;border-radius:10px;transition:.2s}
.nav-item>a:hover,.nav-item>button:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav-item .caret{font-size:10px;opacity:.7;transition:transform .2s}
.nav-item:hover .caret,.nav-item.open .caret{transform:rotate(180deg)}
.dropdown{position:absolute;top:calc(100% + 10px);inset-inline-end:0;min-width:248px;background:#fff;border:1px solid var(--line);
  border-radius:16px;box-shadow:var(--shadow);padding:8px;opacity:0;visibility:hidden;transform:translateY(10px);transition:.22s var(--ease);z-index:5}
.nav-item:hover .dropdown,.nav-item.open .dropdown{opacity:1;visibility:visible;transform:none}
.dropdown::before{content:"";position:absolute;top:-10px;inset-inline:0;height:10px}
.dropdown a{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:11px;color:var(--ink);font-size:14.5px;font-weight:600;transition:.16s}
.dropdown a:hover{background:var(--grad-soft);color:var(--accent)}
.dropdown a i{color:var(--accent);width:20px;text-align:center;font-size:15px}
.dropdown a small{display:block;color:var(--faint);font-weight:500;font-size:12px;margin-top:1px}
.nav-right{display:flex;align-items:center;gap:12px;margin-inline-start:auto}
.nav-logout{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.8);font-size:13.5px;font-weight:700;padding:8px 14px;border:1px solid rgba(255,255,255,.18);border-radius:30px;cursor:pointer;transition:.2s;white-space:nowrap}
.nav-logout:hover{background:rgba(239,68,68,.18);border-color:rgba(239,68,68,.5);color:#fff}
.nav-toggle{display:inline-flex;gap:3px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);padding:4px;border-radius:30px}
.nav-toggle button{border:none;background:transparent;color:rgba(255,255,255,.75);font-family:inherit;font-weight:700;font-size:13px;padding:6px 15px;border-radius:24px;cursor:pointer;transition:.2s}
.nav-toggle button.active{background:var(--pop);color:var(--ink)}
.nav-cta{display:flex;align-items:center;gap:8px;background:var(--pop);color:var(--ink);border:none;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:14.5px;padding:10px 20px;border-radius:30px;transition:transform .2s,box-shadow .2s;white-space:nowrap}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 12px 26px -10px rgba(200,255,61,.6)}
.menu-btn{display:none;align-items:center;justify-content:center;width:42px;height:42px;border-radius:11px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;font-size:18px;cursor:pointer;margin-inline-start:auto}

/* ---------- layout ---------- */
.container{max-width:var(--container);margin:0 auto;padding:0 28px}
section{position:relative;padding:92px 0;scroll-margin-top:74px}
.sec-alt{background:var(--bg-alt)}
.sec-dark{background:var(--ink);color:var(--txt-d)}
.sec-dark .muted{color:var(--muted-d)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--accent);border-radius:2px}
.sec-dark .eyebrow{color:var(--pop)}.sec-dark .eyebrow::before{background:var(--pop)}
h2.disp{font-size:clamp(28px,3.5vw,44px);max-width:none;line-height:1.1;letter-spacing:-.02em}
.lead{font-size:19px;color:var(--muted);margin-top:14px;max-width:none;line-height:1.6}
.muted{color:var(--muted)}

/* ---------- scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}

/* ---------- buttons / chips ---------- */
.chip{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13px;padding:7px 16px;border-radius:30px;background:var(--grad-soft);color:var(--accent);border:1px solid var(--line)}
.sec-dark .chip{background:rgba(255,255,255,.08);color:var(--pop);border-color:var(--line-d)}

/* =====================================================================
   1 · HERO
   ===================================================================== */
.hero{min-height:100vh;display:flex;align-items:center;background:var(--ink);color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(800px 600px at 80% 10%,rgba(124,58,237,.55),transparent 60%),
    radial-gradient(700px 700px at 15% 90%,rgba(6,182,212,.4),transparent 55%),
    radial-gradient(900px 500px at 50% -10%,rgba(79,70,229,.5),transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;z-index:0;opacity:.4;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:54px 54px;-webkit-mask-image:radial-gradient(circle at 60% 40%,#000,transparent 78%);mask-image:radial-gradient(circle at 60% 40%,#000,transparent 78%)}
.hero .container{position:relative;z-index:2;text-align:right;padding-top:90px}
.hero h1,.hero .sub,.hero .supp{max-width:780px;margin-inline:0}
.hero .toggle-hero{display:inline-flex;gap:4px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:5px;border-radius:30px;margin-bottom:30px}
.hero .toggle-hero button{border:none;background:transparent;color:rgba(255,255,255,.7);font-family:inherit;font-weight:700;font-size:13.5px;padding:8px 22px;border-radius:24px;cursor:pointer;transition:.2s}
.hero .toggle-hero button.active{background:var(--pop);color:var(--ink)}
.hero h1{font-size:clamp(40px,7vw,86px);line-height:1.02;letter-spacing:-.02em}
.hero h1 .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto;animation:shine 6s linear infinite}
@keyframes shine{to{background-position:200% center}}
.hero .sub{font-size:clamp(18px,2.4vw,26px);color:#fff;font-weight:600;margin-top:22px}
.hero .supp{font-size:17px;color:rgba(255,255,255,.62);margin:18px 0 0;max-width:780px;line-height:1.7}
.scroll-cue{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.6);font-size:12px;display:flex;flex-direction:column;align-items:center;gap:8px}
.scroll-cue .m{width:24px;height:38px;border:2px solid rgba(255,255,255,.4);border-radius:14px;position:relative}
.scroll-cue .m::after{content:"";position:absolute;top:7px;left:50%;transform:translateX(-50%);width:4px;height:7px;background:#fff;border-radius:3px;animation:wheel 1.5s infinite}
@keyframes wheel{0%{opacity:1;top:7px}100%{opacity:0;top:18px}}

/* =====================================================================
   2 · PROOF STRIP (stats + client logos)
   ===================================================================== */
.proof{padding:48px 0 56px;background:var(--bg);border-bottom:1px solid var(--line)}
.lc-cap{text-align:center;font-size:13px;font-weight:700;letter-spacing:.03em;color:var(--faint);margin-bottom:22px}
/* direction:ltr חובה כאן. העמוד כולו RTL, ולכן קופסת המסלול (רחבה מהמסגרת)
   נצמדה לקצה הימני וגלשה שמאלה, בעוד האנימציה הזיזה אותה שמאלה עוד.
   התוצאה: הלוגואים נשפכו החוצה ולא נכנסו חדשים, והפס התרוקן. */
.logo-carousel{overflow:hidden;position:relative;padding:8px 0;margin-bottom:44px;direction:ltr;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.logo-track{display:flex;align-items:center;gap:100px;width:max-content;animation:marquee 60s linear infinite}
.logo-carousel:hover .logo-track{animation-play-state:paused}
/* שליש מדויק ולא 33.333%: יש שלושה עותקים זהים, וכל סטייה מצטברת לקפיצה בסוף המחזור */
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(calc(-100% / 3))}}
.lc-logo{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:62px}
.lc-logo img{max-height:62px;max-width:170px;width:auto;object-fit:contain;opacity:.85;transition:opacity .2s,transform .2s}
.lc-logo img:hover{opacity:1;transform:scale(1.06)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:14px}
.stat{text-align:center;padding:8px}
.stat .v{font-family:'Secular One';font-size:clamp(40px,5vw,64px);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;direction:ltr;line-height:1}
.stat .l{font-size:14px;color:var(--muted);font-weight:600;margin-top:8px}
.note{text-align:center;font-size:11.5px;color:var(--faint);margin-top:6px}

/* =====================================================================
   3 · CHALLENGE
   ===================================================================== */
.split{display:grid;grid-template-columns:1fr 420px;gap:52px;align-items:start;margin-top:64px}
.funnel{width:100%;max-width:430px;margin:0 auto;position:relative}
.fstage{text-align:center;padding:24px 16px;color:var(--ink)}
.fstage .fnum{display:block;font-family:'Secular One';font-size:34px;line-height:1;direction:ltr}
.fstage .flabel{display:block;font-size:14.5px;font-weight:700;color:var(--muted);margin-top:7px}
.fstage.s1{clip-path:polygon(0 0,100% 0,88% 100%,12% 100%);background:linear-gradient(180deg,#eef2f9,#e7ecf4)}
.fstage.s1 .fnum{font-size:42px}
.fstage.s2{clip-path:polygon(12% 0,88% 0,74% 100%,26% 100%);background:linear-gradient(180deg,#e7ecf4,#dde4ef)}
.fstage.s3{clip-path:polygon(26% 0,74% 0,60% 100%,40% 100%);background:linear-gradient(180deg,#dde4ef,#d2dbea)}
.fleak{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px 0;position:relative;z-index:3}
.floss{background:#fff;border:1.5px solid #f8d3d3;color:var(--red-txt);font-weight:800;font-size:13.5px;padding:6px 15px;border-radius:20px;box-shadow:var(--shadow-sm)}
.drop{color:var(--red);font-size:12px;opacity:.7;animation:drip 2.2s infinite}
.drop.d2{animation-delay:1.1s}
@keyframes drip{0%{transform:translateY(-7px);opacity:0}30%{opacity:.85}100%{transform:translateY(15px);opacity:0}}
.pains{display:grid;gap:16px}
.pain{display:flex;align-items:flex-start;gap:16px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:22px 24px;border-right:4px solid var(--red);box-shadow:var(--shadow-sm)}
.pain .ic{width:48px;height:48px;border-radius:13px;background:#fff0f0;color:var(--red);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.pain h4{font-size:18px;font-weight:800}
.pain p{font-size:15.5px;color:var(--muted);margin-top:5px;line-height:1.55}

/* =====================================================================
   4 · SOLUTION PILLARS
   ===================================================================== */
.pillar{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:80px 0}
.pillar:nth-child(even) .p-visual{order:-1}
/* entrance animation per solution — text + visual slide in from opposite sides */
.pillar .p-text,.pillar .p-visual{opacity:0;transition:opacity .8s var(--ease),transform .8s var(--ease)}
.pillar .p-text{transform:translateX(48px)}
.pillar .p-visual{transform:translateX(-48px) scale(.96)}
.pillar:nth-child(even) .p-text{transform:translateX(-48px)}
.pillar:nth-child(even) .p-visual{transform:translateX(48px) scale(.96)}
.pillar.in .p-text,.pillar.in .p-visual{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pillar .p-text,.pillar .p-visual{opacity:1;transform:none;transition:none}}
.p-visual{position:relative;aspect-ratio:4/3;border-radius:26px;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,color-mix(in srgb,var(--c) 22%,#fff),color-mix(in srgb,var(--c) 6%,#fff));border:1px solid var(--line)}
.p-visual .big-ic{font-size:96px;color:var(--c);filter:drop-shadow(0 16px 30px color-mix(in srgb,var(--c) 40%,transparent))}
.p-text .p-no{font-family:'Secular One';font-size:15px;color:var(--c)}
.p-text h3{font-size:clamp(24px,3vw,34px);font-weight:800;margin:6px 0 8px;line-height:1.12}
.p-text .p-sub{font-size:18px;color:var(--muted);line-height:1.6;margin-bottom:20px}
.p-points{display:grid;gap:14px}
.p-points .pt{display:flex;gap:14px;align-items:flex-start}
.p-points .pt .d{width:38px;height:38px;border-radius:11px;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.p-points .pt h5{font-size:16.5px;font-weight:800}
.p-points .pt p{font-size:15px;color:var(--muted);line-height:1.55}
.callout{background:var(--grad-soft);border:1px solid var(--line);border-radius:var(--r);padding:22px 28px;font-size:19px;font-weight:700;color:var(--accent);text-align:center;margin:0 auto 30px;max-width:760px}

/* ---------- living pillar visuals (show, don't tell) ---------- */
.p-visual{aspect-ratio:auto;min-height:360px;padding:24px}
.p-visual .pv{position:relative;z-index:2;width:90%;max-width:330px}
.pv{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 26px 54px -26px rgba(20,20,60,.4);overflow:hidden}

/* phone — warming */
.wa-head{display:flex;align-items:center;gap:11px;background:#075e54;color:#fff;padding:13px 16px}
.wa-head i{font-size:24px;color:#25d366}
/* תמונת פרופיל עגולה כמו בוואטסאפ, במקום סמל האפליקציה */
.wa-av{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;
  background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.wa-head b{font-size:14px}
.wa-head em{font-size:11px;opacity:.85;font-style:normal;display:flex;align-items:center;gap:6px;margin-top:1px}
.typ{display:inline-flex;gap:2px}
.typ i{width:4px;height:4px;border-radius:50%;background:#fff;animation:typ 1.3s infinite}
.typ i:nth-child(2){animation-delay:.2s}.typ i:nth-child(3){animation-delay:.4s}
@keyframes typ{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.wa-chat{background:#e5ddd5;padding:14px;display:flex;flex-direction:column;gap:8px;
  height:300px;overflow:hidden;scrollbar-width:none}
.wa-chat::-webkit-scrollbar{display:none}
.wa{display:none;max-width:84%;padding:8px 12px;border-radius:12px;font-size:12.5px;line-height:1.45;color:#111;opacity:0;transform:translateY(10px) scale(.96)}
.wa.in{background:#fff;align-self:flex-start;border-top-right-radius:3px}
.wa.out{background:#dcf8c6;align-self:flex-end;border-top-left-radius:3px}
/* החשיפה מנוהלת מהקוד, כי מספר הבועות משתנה והחלון גולל */
.wa.show{display:block;animation:waIn .45s var(--ease) forwards}
@keyframes waIn{to{opacity:1;transform:none}}
.pv-chip{display:flex;align-items:center;justify-content:center;gap:7px;background:var(--c);color:#fff;font-weight:800;font-size:12.5px;padding:10px}

/* reminders — noshow */
.pv-rem{padding:16px}
/* כל שורה היא סוג מגע אחר, ולכן יש בה כותרת קצרה ושורת פירוט,
   ולא רק תווית אחת כמו קודם */
.rem-b{flex:1;min-width:0}
.rem-b b{display:block;font-size:13px;font-weight:800;color:var(--ink);line-height:1.3}
.rem-b em{display:block;font-style:normal;font-size:12px;line-height:1.5;
  color:var(--muted);margin-top:3px}
.rem-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.rem-acts span{font-size:11px;font-weight:800;padding:4px 10px;border-radius:20px;
  background:color-mix(in srgb,var(--accent) 12%,#fff);color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 26%,#fff)}
/* המועד שהלקוח בחר: מלא במקום מתואר, הבחנה בעוצמה ולא בגוון */
.rem-acts span.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.rem-head{font-weight:800;font-size:13.5px;display:flex;align-items:center;gap:8px;margin-bottom:14px;color:var(--ink)}
.rem-head i{color:var(--c)}
.rem{display:flex;align-items:flex-start;gap:10px;background:var(--bg-alt);border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-bottom:9px;font-size:13px;font-weight:600;color:var(--muted);opacity:0;transform:translateX(12px)}
.rem i{color:var(--c)}
.rem.ok{background:color-mix(in srgb,var(--green) 13%,#fff);border-color:color-mix(in srgb,var(--green) 30%,#fff);color:#0a7d52}
.rem.ok i{color:var(--green)}
.pillar.in .rem{animation:remIn .5s var(--ease) forwards}
.pillar.in .rem.r1{animation-delay:.25s}.pillar.in .rem.r2{animation-delay:.6s}.pillar.in .rem.r3{animation-delay:.95s}.pillar.in .rem.r4{animation-delay:1.3s}.pillar.in .rem.r5{animation-delay:1.75s}
@keyframes remIn{to{opacity:1;transform:none}}

/* recycle — data */
.pv-recycle{padding:26px 22px;text-align:center}
.pv-recycle .spin{font-size:40px;color:var(--c);animation:spin 5s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.rc-num{font-family:'Secular One';font-size:46px;color:var(--c);direction:ltr;margin-top:10px;line-height:1}
.rc-lbl{font-size:13px;color:var(--muted);margin-top:4px}
.rc-flow{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:16px;font-size:12px;font-weight:700;color:var(--muted)}
.rc-flow i{color:var(--c);font-size:11px}
.rc-flow .hl{background:var(--c);color:#fff;padding:4px 11px;border-radius:20px}

/* mini dashboard — control */
.pv-dash{padding:20px}
.d-stats{display:flex;gap:10px;margin-bottom:16px}
.d-stats>div{flex:1;background:var(--bg-alt);border:1px solid var(--line);border-radius:12px;padding:12px 6px;text-align:center}
.d-stats b{font-family:'Secular One';font-size:20px;color:var(--c);display:block;direction:ltr}
.d-stats i{font-size:10px;color:var(--muted);font-style:normal}
.d-bars{display:flex;align-items:flex-end;gap:8px;height:92px;padding:0 4px}
.d-bars span{flex:1;background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 35%,#fff));border-radius:6px 6px 0 0;height:0;align-self:flex-end}
.pillar.in .d-bars span{animation:grow .9s var(--ease) forwards}
.pillar.in .d-bars span:nth-child(1){animation-delay:.25s}.pillar.in .d-bars span:nth-child(2){animation-delay:.35s}
.pillar.in .d-bars span:nth-child(3){animation-delay:.45s}.pillar.in .d-bars span:nth-child(4){animation-delay:.55s}
.pillar.in .d-bars span:nth-child(5){animation-delay:.65s}.pillar.in .d-bars span:nth-child(6){animation-delay:.75s}
@keyframes grow{to{height:var(--h)}}
/* lead-intel visual (pillar 05) */
.li-card{overflow:hidden}
.li-card-head{background:var(--c);color:#fff;font-weight:800;font-size:13.5px;padding:12px 18px;display:flex;align-items:center;gap:8px}
.li-card-body{padding:22px;text-align:center}
.li-avatar{width:62px;height:62px;border-radius:50%;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c);display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 12px}
.li-name{font-size:20px;font-weight:800;color:var(--ink)}
.li-meta{font-size:13.5px;color:var(--muted);margin-top:3px}
.li-worth{margin-top:16px;background:var(--bg-alt);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center}
.li-worth span{font-size:13px;color:var(--muted)}
.li-worth b{font-size:15px;color:var(--c)}
.li-route{background:color-mix(in srgb,var(--c) 12%,#fff);color:var(--c);font-weight:800;font-size:13.5px;padding:13px;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px}

/* =====================================================================
   5 · TECHNOLOGY (dark)
   ===================================================================== */
.flow-big{max-width:1000px;margin:36px auto 34px}
.flow-big svg{width:100%;height:auto;overflow:visible}
.tech-feats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;margin-top:40px}
.tech-feats{display:grid;gap:14px}
.tf{background:rgba(255,255,255,.04);border:1px solid var(--line-d);border-radius:var(--r-sm);padding:20px 22px;border-right:3px solid var(--c)}
.tf h4{font-size:17.5px;font-weight:800;color:#fff}
.tf p{font-size:15.5px;color:var(--muted-d);margin-top:6px;line-height:1.55}
.diagram{background:rgba(255,255,255,.03);border:1px solid var(--line-d);border-radius:26px;padding:28px}
.flow-line{stroke-dasharray:8 6;animation:flow 1s linear infinite}
@keyframes flow{to{stroke-dashoffset:-28}}

/* =====================================================================
   6 · ROI
   ===================================================================== */
.roi-card{background:var(--bg);border:1px solid var(--line);border-radius:26px;padding:34px;box-shadow:var(--shadow);margin-top:32px}
/* compact inputs */
.roi-glabel{font-size:12.5px;font-weight:800;letter-spacing:.05em;color:var(--accent);display:flex;align-items:center;gap:8px;margin-bottom:12px}
.roi-inputs{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:20px}
.ri label{display:block;font-size:12.5px;font-weight:700;color:var(--muted);text-align:center;margin-bottom:8px}
.ri input{width:100%;padding:11px;border:1.5px solid var(--line);border-radius:11px;background:var(--bg-alt);color:var(--ink);font-family:'JetBrains Mono';font-size:16px;font-weight:700;text-align:center;direction:ltr;outline:none;transition:.2s}
.ri input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--grad-soft)}
.roi-slider{margin-bottom:30px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.roi-slider label{display:block;font-size:15px;font-weight:700;color:var(--ink);margin-bottom:12px}
.roi-slider label b{color:var(--accent);font-family:'JetBrains Mono';direction:ltr}
.roi-slider input[type=range]{width:100%;height:6px;accent-color:var(--accent);cursor:pointer}
/* before -> after */
.ba{display:flex;align-items:center;justify-content:center;gap:clamp(20px,5vw,60px);margin-bottom:30px}
.ba-side{text-align:center}
.ba-l{font-size:14px;font-weight:700;color:var(--muted)}
.ba-v{font-family:'Secular One';font-size:clamp(46px,7vw,68px);line-height:1;color:var(--ink);direction:ltr;margin:8px 0}
.ba-side.hi .ba-v{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ba-u{font-size:13px;color:var(--faint)}
.ba-arrow{font-size:32px;color:var(--accent)}
/* money hero */
.roi-hero{background:var(--ink);color:#fff;border-radius:22px;padding:34px;text-align:center;position:relative;overflow:hidden}
.roi-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 240px at 50% -40%,rgba(124,58,237,.5),transparent 60%)}
.roi-hero>*{position:relative}
.rh-l{font-size:15.5px;color:rgba(255,255,255,.65)}
.rh-v{font-family:'Secular One';font-size:clamp(42px,7vw,72px);color:var(--pop);direction:ltr;line-height:1;margin:10px 0}
.rh-sub{font-size:15px;color:rgba(255,255,255,.72)}

/* =====================================================================
   7 · CLIENTS
   ===================================================================== */
.client-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:40px}
.client{display:flex;align-items:center;justify-content:center;min-height:84px;padding:16px;text-align:center;background:var(--bg);border:1px solid var(--line);border-radius:16px;font-weight:700;font-size:14px;color:var(--muted);transition:.22s var(--ease)}
.client:hover{color:var(--ink);transform:translateY(-4px);box-shadow:var(--shadow-sm);border-color:var(--accent)}
.client.add{border-style:dashed;color:var(--faint)}

/* =====================================================================
   8 · ABOUT
   ===================================================================== */
.about-co{text-align:right;max-width:840px;margin:0 auto}
.principle-lead{font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--muted);margin-bottom:12px}
.belief{font-size:clamp(28px,4vw,46px);max-width:none;margin:0;line-height:1.14;letter-spacing:-.01em;text-align:right}
.punch-sub{font-size:clamp(18px,2.2vw,24px);color:var(--accent);font-weight:800;margin-top:16px}
@media(min-width:600px){.belief{white-space:nowrap}}
.co-label{font-weight:800;font-size:13px;letter-spacing:.12em;color:var(--accent);margin-top:36px}
.co-para{font-size:19px;color:var(--muted);line-height:1.75;max-width:none;margin:12px 0 0;text-align:justify;text-align-last:right;text-wrap:pretty}
.std-head{font-family:'Secular One';font-size:25px;color:var(--ink);text-align:center;margin:40px 0 24px}
.std-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.std{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:32px 28px;box-shadow:var(--shadow-sm);transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.std:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--accent)}
.std-ic{width:58px;height:58px;border-radius:16px;background:var(--grad-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:18px}
.std h4{font-size:20px;font-weight:800;margin-bottom:9px}
.std p{font-size:15.5px;color:var(--muted);line-height:1.6}
.loc-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:40px}
.loc-chip{display:inline-flex;align-items:center;gap:8px;background:var(--bg-alt);border:1px solid var(--line);border-radius:30px;padding:10px 20px;font-weight:700;font-size:15px;color:var(--muted)}
.loc-chip i{color:var(--accent);font-size:13px}
.loc-chip.main{background:var(--grad-soft);color:var(--accent)}

/* =====================================================================
   9 · ROADMAP
   ===================================================================== */
.road-row{display:flex;align-items:stretch;gap:8px;margin-top:34px}
.road-card{flex:1;background:var(--bg);border:1px solid var(--line);border-top:4px solid var(--c);border-radius:var(--r);padding:28px;box-shadow:var(--shadow-sm);transition:transform .25s var(--ease),box-shadow .25s}
.road-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.rc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.rc-ic{width:54px;height:54px;border-radius:15px;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c);display:flex;align-items:center;justify-content:center;font-size:23px}
.rc-badge{background:var(--c);color:#fff;font-weight:800;font-size:13px;padding:6px 16px;border-radius:20px}
.road-card h3{font-size:20px;font-weight:800;margin-bottom:16px}
.road-arrow{flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:24px;padding:0 2px}

/* =====================================================================
   10 · INVESTMENT
   ===================================================================== */
.sub-h{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:40px 0 18px;display:flex;align-items:center;gap:12px}
.sub-h:first-of-type{margin-top:40px}
.sub-h::after{content:"";flex:1;height:1px;background:var(--line)}
.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.plan{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:30px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;position:relative;transition:transform .25s var(--ease),box-shadow .25s}
.plan:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
/* recommended = visual hierarchy (dominant dark card), no "מומלץ" text */
.plan.feat{background:linear-gradient(165deg,#1c1550,#0c0d18);border:1px solid rgba(124,58,237,.55);color:#fff;transform:scale(1.05);box-shadow:0 46px 84px -30px rgba(79,70,229,.7);z-index:2}
.plan.feat:hover{transform:scale(1.05) translateY(-6px)}
.plan.feat h3{color:#fff}
.plan.feat .hrs{color:rgba(255,255,255,.72)}
.plan.feat .price{color:#fff}
.plan.feat .price .cur{color:rgba(255,255,255,.55)}
.plan.feat .extra-l{color:rgba(255,255,255,.58)}
.plan.feat .feat-list li{color:rgba(255,255,255,.9)}
.plan.feat .feat-list li i{color:var(--pop)}
.plan h3{font-size:21px;font-weight:800;text-align:center}
.plan .hrs{text-align:center;color:var(--muted);font-size:13.5px;margin-top:4px}
/* בלי direction:ltr. הוא נוסף כדי להחזיק את סימן השקל במקום,
   ועכשיו כשכתוב ש"ח באותיות הוא רק הופך את הסדר. */
.plan .price{font-family:'Secular One';font-size:42px;text-align:center;margin:16px 0 4px;color:var(--ink)}
.plan .price bdi{unicode-bidi:isolate}
.plan .price .cur{font-size:16px;color:var(--muted)}
.plan .extra-l{text-align:center;font-size:12.5px;color:var(--muted);margin-bottom:14px}
.feat-list{list-style:none;display:grid;gap:10px}
.feat-list li{display:flex;gap:11px;font-size:15.5px;color:var(--txt);line-height:1.55}
.feat-list li i{color:var(--accent);margin-top:4px;flex-shrink:0}
.extras-col{display:grid;gap:18px}
.extra-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:22px;border-right:4px solid var(--c);box-shadow:var(--shadow-sm)}
.extra-card h4{font-size:16px;font-weight:800}
/* בלי direction:ltr, מאותה סיבה כמו במחיר: הוא הפך את הסדר
   ברגע שהמטבע נכתב באותיות עבריות */
.extra-card .ep{font-family:'Secular One';font-size:26px;color:var(--c);margin:6px 0}
.extra-card .ep span{font-size:13px;color:var(--muted);font-family:'Assistant'}
.tag-strip{display:flex;align-items:center;gap:10px;background:var(--bg-alt);border:1px solid var(--line);border-radius:14px;padding:14px 20px;margin-top:26px;font-size:15px;color:var(--muted)}
.tag-strip i{color:var(--accent)}
.step-note{font-size:16.5px;color:var(--muted);margin-bottom:24px}
.step-note strong{color:var(--ink)}.step-note em{font-style:normal;color:var(--accent);font-weight:700}
.choice-h{font-family:'Secular One';font-size:22px;color:var(--ink);margin:6px 0 18px;display:flex;align-items:center;gap:12px}
.choice-h::before{content:"";width:6px;height:24px;border-radius:3px;background:var(--accent)}
.rec-pill{font-family:'Assistant';font-size:12.5px;font-weight:800;color:#fff;background:var(--purple);padding:5px 14px;border-radius:20px}
.flex-pill{font-family:'Assistant';font-size:12.5px;font-weight:800;color:var(--accent);background:var(--grad-soft);border:1px solid var(--line);padding:5px 14px;border-radius:20px}
.or-divider{display:flex;align-items:center;gap:16px;margin:38px 0}
.or-divider::before,.or-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.or-divider span{font-family:'Secular One';font-size:16px;color:var(--accent);background:var(--grad-soft);border:1px solid var(--line);border-radius:30px;padding:8px 28px}

/* live price calculator */
.calc-wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start;margin-top:24px}
.calc-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--shadow-sm)}
.opt{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:14px;padding:14px 16px;cursor:pointer;transition:.18s;margin-bottom:10px}
.opt:hover{border-color:var(--accent)}
.opt.sel{border-color:var(--accent);background:var(--grad-soft)}
.opt input{accent-color:var(--accent);width:18px;height:18px}
.opt .n{flex:1;font-weight:700;font-size:14.5px}
.opt .p{font-family:'JetBrains Mono';font-weight:700;font-size:13.5px;color:var(--accent);direction:ltr}
.total{position:sticky;top:90px;background:var(--ink);color:#fff;border-radius:var(--r);padding:30px;text-align:center}
.total .l{font-size:14px;color:rgba(255,255,255,.6)}
.total .setup{font-family:'Secular One';font-size:48px;direction:ltr;margin-top:6px}
.total .monthly{font-size:14px;color:var(--pop);font-weight:700;direction:ltr;margin-top:10px}
.total .hint{font-size:12px;color:rgba(255,255,255,.45);margin-top:16px}

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer{background:var(--ink);color:#fff;padding:50px 0 36px}
.footer .container{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer .logo{font-family:'Secular One';font-size:22px;display:flex;align-items:center;gap:10px}
.footer .logo img{height:54px;width:auto;display:block}
.footer .tg{font-size:13px;color:rgba(255,255,255,.5);letter-spacing:.1em}
.footer .lock{display:flex;align-items:center;gap:8px;font-size:12.5px;color:rgba(255,255,255,.55)}
.footer .lock i{color:var(--pop)}

/* ---------- mega menu ---------- */
.nav-item.has-mega{position:static}
.mega{position:absolute;top:100%;inset-inline:0;background:#fff;border-top:1px solid var(--line);
  box-shadow:0 34px 64px -28px rgba(10,10,40,.4);opacity:0;visibility:hidden;transform:translateY(8px);transition:.24s var(--ease);z-index:5}
.nav-item.has-mega:hover .mega,.nav-item.has-mega.open .mega{opacity:1;visibility:visible;transform:none}
.mega::before{content:"";position:absolute;top:-12px;inset-inline:0;height:12px}
.mega-inner{max-width:1320px;margin:0 auto;padding:34px 40px;display:grid;grid-template-columns:1.7fr 1fr;gap:44px}
.mega-col-head{font-size:11.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
.mega-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 22px}
.mega-item{display:flex;gap:13px;padding:11px 12px;border-radius:13px;transition:background .16s}
.mega-item:hover{background:var(--bg-alt)}
.mega-item .mi-ic{width:40px;height:40px;border-radius:12px;background:var(--grad-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.mega-item h5{font-size:14.5px;font-weight:800;color:var(--ink)}
.mega-item p{font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.4}
.mega-integ-col{border-inline-start:1px solid var(--line);padding-inline-start:36px}
.mega-integ{display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}
.integ{display:flex;align-items:center;gap:11px;padding:10px;border-radius:10px;font-weight:700;font-size:14px;color:var(--ink);transition:background .16s}
.integ:hover{background:var(--bg-alt)}
.integ i{width:24px;text-align:center;font-size:18px;color:var(--accent)}

/* =====================================================================
   CASE STUDIES
   ===================================================================== */
.pillar{scroll-margin-top:96px}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:42px}
.ck-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:32px 0 26px}
.ck{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:22px;text-align:center;box-shadow:var(--shadow-sm)}
.ck-n{font-family:'Secular One';font-size:clamp(34px,4vw,44px);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;direction:ltr;line-height:1}
.ck-l{font-size:13px;color:var(--muted);font-weight:600;margin-top:7px}
.rep-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.rep{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.rep:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--accent)}
.rep-ic{width:54px;height:54px;border-radius:15px;background:var(--grad-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:23px;margin-bottom:16px}
.rep h4{font-size:20px;font-weight:800;margin-bottom:9px}
.rep p{font-size:15px;color:var(--muted);line-height:1.55;margin-bottom:22px}
.rep-btn{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--accent);color:#fff;font-family:inherit;font-weight:800;font-size:15px;padding:13px;border-radius:12px;transition:transform .2s,box-shadow .2s;box-shadow:0 12px 26px -12px rgba(79,70,229,.6)}
.rep-btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px -12px rgba(79,70,229,.7)}

/* =====================================================================
   FLOATING QUOTE BUTTON + MODAL
   ===================================================================== */
.quote-fab{position:fixed;bottom:26px;inset-inline-start:26px;z-index:180;display:flex;align-items:center;gap:10px;
  background:var(--accent);color:#fff;border:none;cursor:pointer;font-family:inherit;font-weight:800;font-size:15px;
  padding:15px 24px;border-radius:50px;box-shadow:0 16px 38px -12px rgba(79,70,229,.7);transition:transform .2s,box-shadow .2s}
.quote-fab:hover{transform:translateY(-3px);box-shadow:0 22px 48px -14px rgba(79,70,229,.85)}
.quote-fab i{font-size:18px}
.modal-ov{position:fixed;inset:0;z-index:400;background:rgba(11,12,22,.62);backdrop-filter:blur(7px);display:none;align-items:center;justify-content:center;padding:20px}
.modal-ov.open{display:flex;animation:ovin .25s ease}
@keyframes ovin{from{opacity:0}to{opacity:1}}
.modal{background:#fff;border-radius:24px;width:100%;max-width:580px;max-height:92vh;overflow-y:auto;box-shadow:var(--shadow);animation:mup .35s var(--ease)}
@keyframes mup{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.modal-head{background:var(--ink);color:#fff;padding:26px 30px;position:relative;overflow:hidden}
.modal-head::before{content:"";position:absolute;inset:0;background:radial-gradient(500px 200px at 80% -40%,rgba(124,58,237,.6),transparent 60%)}
.modal-head h3{font-family:'Secular One';font-size:24px;position:relative}
.modal-head p{font-size:13.5px;color:rgba(255,255,255,.6);margin-top:5px;position:relative}
.modal-close{position:absolute;top:18px;inset-inline-start:18px;width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,.14);color:#fff;font-size:20px;cursor:pointer;z-index:2;transition:.2s}
.modal-close:hover{background:rgba(255,255,255,.28)}
.modal-body{padding:26px 30px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{margin-bottom:15px}
.fld label{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:7px}
.fld label .req{color:var(--red)}
.fld input,.fld select,.fld textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--bg-alt);
  color:var(--ink);font-family:inherit;font-size:14.5px;outline:none;transition:.2s}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--grad-soft);background:#fff}
.fld textarea{resize:vertical;min-height:74px}
.fld input::placeholder,.fld textarea::placeholder{color:var(--faint)}
/* quote builder — selectable option cards (checkbox style) */
.opt-hint{font-weight:600;font-size:11.5px;color:var(--faint)}
.opt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opt-card{position:relative;display:flex;align-items:center;gap:11px;padding:13px 14px;border:1.5px solid var(--line);border-radius:13px;background:var(--bg-alt);cursor:pointer;transition:.18s var(--ease)}
.opt-card:hover{border-color:var(--accent)}
.opt-card.on{border-color:var(--accent);background:var(--grad-soft);box-shadow:0 0 0 3px var(--grad-soft)}
.opt-card input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.oc-check{flex:0 0 auto;width:21px;height:21px;border:2px solid var(--line);border-radius:7px;display:flex;align-items:center;justify-content:center;transition:.18s}
.opt-card.on .oc-check{background:var(--accent);border-color:var(--accent)}
.opt-card.on .oc-check::after{content:"✓";color:#fff;font-size:13px;font-weight:900;line-height:1}
.oc-body{display:flex;flex-direction:column;flex:1;min-width:0}
.oc-body b{font-size:14.5px;color:var(--ink);font-weight:800}
.oc-body em{font-style:normal;font-size:11.5px;color:var(--muted);margin-top:1px}
.oc-price{font-family:'Secular One';font-size:14px;color:var(--accent);direction:ltr;white-space:nowrap}
@media(max-width:560px){.opt-grid{grid-template-columns:1fr}}
.modal-total{display:flex;justify-content:space-between;align-items:center;background:var(--grad-soft);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin:6px 0 16px}
.modal-total .ml{font-size:13px;color:var(--muted)}
.modal-total .mv{font-family:'Secular One';font-size:24px;color:var(--accent);direction:ltr}
.modal-total .mm{font-size:12.5px;color:var(--green);font-weight:700;direction:ltr;margin-top:2px}
.btn-send{width:100%;background:var(--accent);color:#fff;border:none;border-radius:13px;padding:15px;font-family:inherit;font-weight:800;font-size:16px;cursor:pointer;transition:transform .2s,box-shadow .2s;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 12px 30px -12px rgba(79,70,229,.7)}
.btn-send:hover{transform:translateY(-2px)}
.btn-send:disabled{opacity:.55;cursor:not-allowed;transform:none}
.form-msg{display:none;text-align:center;font-size:14px;font-weight:700;margin-top:14px;padding:11px;border-radius:11px}
.form-msg.ok{display:block;color:#047857;background:#e7f9f1}
.form-msg.err{display:block;color:#b91c1c;background:#fef0f0}

/* =====================================================================
   GENERATED PROPOSAL DOCUMENT (in-page overlay → print/PDF)
   ===================================================================== */
.proposal-ov{position:fixed;inset:0;z-index:500;background:#e9ebf0;overflow:auto;padding:30px;direction:rtl}
.pdoc{max-width:840px;margin:0 auto;background:#fff;border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.3);color:#1c2333;font-family:'Assistant',sans-serif;padding:48px 56px;line-height:1.7;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.pdoc-head{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #eef0f5;padding-bottom:20px;margin-bottom:18px}
.pdoc-head .pl-guy{height:46px;width:auto}
.pl-oct{text-align:left;line-height:1.2}
.pl-oct b{display:block;font-family:'Secular One';font-size:20px;letter-spacing:.5px;color:#0c0d18}
.pl-oct small{font-size:10.5px;color:#5a6478;letter-spacing:.03em}
.pdoc-addr{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:14px;color:#3a4456;margin-bottom:24px}
.pdoc-addr b{color:#0c0d18}
.pdoc-title{font-family:'Secular One';font-weight:400;font-size:30px;color:#2a2f8f;text-align:center;margin:8px 0 6px;line-height:1.15}
.pdoc-sub{text-align:center;font-weight:700;font-size:16px;color:#1c2333;margin-bottom:30px}
.pdoc-h{font-weight:800;font-size:18px;color:#0c0d18;margin:24px 0 10px}
.pdoc-ol{padding-inline-start:22px;margin:0;font-size:14.5px;color:#3a4456}
.pdoc-ol li{margin-bottom:7px;line-height:1.65}
.pdoc-ol.values li{margin-bottom:11px}
.pdoc-ol.values b,.pdoc-ul b{color:#0c0d18}
.pdoc-ul{list-style:none;padding:0;margin:14px 0 0;font-size:14px;color:#3a4456}
.pdoc-ul li{position:relative;padding-inline-start:18px;margin-bottom:7px;line-height:1.6}
.pdoc-ul li::before{content:"•";position:absolute;inset-inline-start:0;color:#4f46e5;font-weight:900}
.pdoc-pill{display:inline-block;background:#2a2f8f;color:#fff;font-family:'Secular One';font-size:18px;padding:6px 22px;border-radius:8px;margin:32px 0 14px}
.pdoc-pkg{background:#f4f5f8;border:1px solid #e6e8f0;border-radius:14px;padding:16px 20px}
.pkg-name{font-weight:800;font-size:16px;color:#2a2f8f;margin-bottom:8px}
.pdoc-table{width:100%;border-collapse:collapse}
.pdoc-table td{text-align:right;padding:10px 4px;font-size:14.5px;border-bottom:1px solid #e6e8f0}
.pdoc-table td.v{font-weight:800;direction:ltr;text-align:left;white-space:nowrap;color:#0c0d18}
.pdoc-table tr:last-child td{border-bottom:none}
.pdoc-total{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border-radius:12px;padding:15px 22px;margin-top:14px;font-size:14px;font-weight:700}
.pdoc-total .v{font-family:'Secular One';font-size:26px;direction:ltr}
.pdoc-notes{margin-top:16px;background:#fff8e6;border:1px solid #f0e2b8;border-radius:10px;padding:13px 16px;font-size:13.5px;color:#6b5a1e}
.pdoc-p{font-size:14.5px;color:#3a4456;line-height:1.75;margin:6px 0}
.pdoc-cta{font-family:'Secular One';font-weight:400;font-size:24px;color:#2a2f8f;text-align:center;margin:36px 0 10px}
.pdoc-join{text-align:center;font-size:15px;color:#3a4456;margin-bottom:8px}
.pdoc-note{font-size:12.5px;color:#5a6478;line-height:1.6;margin:4px 0 14px}
.pdoc-sign{display:flex;gap:40px;margin:18px 0 26px}
.sign-box{flex:1;text-align:center}
.sign-line{height:46px;border:1px dashed #c3c8d4;border-radius:8px;background:#fafbfd;margin-bottom:6px}
.sign-box span{font-size:12.5px;color:#5a6478}
.pdoc-appendix{margin-top:30px;border-top:2px solid #eef0f5;padding-top:22px;page-break-before:always}
.ap-title{color:#2a2f8f;text-align:center}
.ap-h{font-weight:800;font-size:15px;color:#0c0d18;margin:18px 0 8px;text-decoration:underline}
.pdoc-appendix .pdoc-ol{font-size:12.5px;color:#46506a}
.pdoc-appendix .pdoc-ol li{margin-bottom:6px}
.pdoc-tlh{text-align:center;font-size:12px;color:#5a6478;margin-top:18px}
.pdoc-ftr{border-top:1px solid #eceef3;margin-top:26px;padding-top:16px;text-align:center;font-size:12.5px;color:#5a6478}
.proposal-status{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:511;max-width:90%;background:#fff;border:1px solid var(--line);border-radius:30px;padding:10px 22px;font-size:14px;font-weight:700;color:var(--muted);box-shadow:0 10px 28px rgba(0,0,0,.18);text-align:center}
.proposal-status:empty{display:none}
.proposal-status.ok{color:#047857;background:#e7f9f1;border-color:#bdebd2}
.proposal-status.err{color:#b91c1c;background:#fef0f0;border-color:#f6caca}
.proposal-bar{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:510;display:flex;gap:12px}
.proposal-bar button{font-family:'Heebo',sans-serif;font-weight:800;font-size:15px;padding:13px 26px;border-radius:30px;border:none;cursor:pointer;box-shadow:0 10px 28px rgba(0,0,0,.25);display:flex;align-items:center;gap:8px}
.proposal-bar .pb-print{background:var(--accent);color:#fff}
.proposal-bar .pb-close{background:#fff;color:#1c2333;border:1px solid #ccc}
@media print{
  body>*:not(.proposal-ov){display:none!important}
  .progress{display:none!important}
  .proposal-ov{position:static;inset:auto;padding:0;background:#fff;overflow:visible}
  .pdoc{box-shadow:none;border-radius:0;max-width:none;margin:0}
  .proposal-bar,.proposal-status{display:none!important}
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media(max-width:980px){
  .split,.pillar,.tech-grid,.calc-wrap,.tech-feats-row{grid-template-columns:1fr;gap:30px}
  .pillar:nth-child(even) .p-visual{order:0}
  .about-split{grid-template-columns:1fr;gap:32px}
  .client-grid{grid-template-columns:repeat(3,1fr)}
  .road-row{flex-direction:column}.road-arrow{transform:rotate(-90deg);padding:6px 0}
  .total{position:static}
}
@media(max-width:1080px){
  .nav-cta span,.nav-cta{font-size:13.5px}
  .nav-menu{margin-inline-start:8px}
}
@media(max-width:860px){
  .nav-inner{padding:12px 18px}
  .nav-menu,.nav-toggle{display:none}
  .nav-logout span{display:none}.nav-logout{padding:9px 11px}
  .menu-btn{display:flex;margin-inline-start:8px}
  .nav.mobile-open .nav-menu{display:flex;flex-direction:column;position:absolute;top:100%;inset-inline:0;background:#fff;padding:14px;gap:4px;box-shadow:var(--shadow);margin:0}
  .nav.mobile-open .nav-item>a,.nav.mobile-open .nav-item>button{color:var(--ink);width:100%}
  .nav.mobile-open .dropdown{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:0 0 6px;min-width:auto}
  .nav.mobile-open .mega{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none}
  .mega-inner{grid-template-columns:1fr;gap:18px;padding:14px 0}
  .mega-grid,.mega-integ{grid-template-columns:1fr}
  .mega-integ-col{border-inline-start:none;padding-inline-start:0;border-top:1px solid var(--line);padding-top:16px}
}
@media(max-width:680px){
  section{padding:72px 0}
  .stats,.wow,.price-grid,.tier-grid,.rep-grid,.std-grid{grid-template-columns:1fr}
  .ck-strip{grid-template-columns:1fr 1fr}
  .client-grid{grid-template-columns:repeat(2,1fr)}
  .roi-inputs{grid-template-columns:1fr 1fr}
  .frow{grid-template-columns:1fr}
  .quote-fab span{display:none}.quote-fab{padding:16px}
}

/* =====================================================================
   שינויים על המקור — סבב תיקונים 25 באוגוסט 2026
   ===================================================================== */

/* --- 1 · לוגואי לקוחות בפס העליון, מוגדלים --- */
.proof .lc-cap{font-size:15px;margin-bottom:28px}
.proof .lc-logo{height:96px}
.proof .lc-logo img{max-height:96px;max-width:250px;opacity:1}
.proof .logo-track{gap:120px}
@media(max-width:860px){
  .proof .lc-logo{height:64px}
  .proof .lc-logo img{max-height:64px;max-width:170px}
  .proof .logo-track{gap:64px}
}

/* --- 2 · הסטנדרט המקצועי: ארבע קוביות בשורה --- */
.std-grid{grid-template-columns:repeat(4,1fr);gap:18px}
.std{padding:28px 24px}
@media(max-width:1100px){.std-grid{grid-template-columns:repeat(2,1fr)}}

/* --- 3 · התחומים שלנו --- */
.field-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:38px}
.field{background:var(--bg);border:1px solid var(--line);border-top:4px solid var(--c);
  border-radius:var(--r);padding:28px 22px;box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.field:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.field-ic{width:54px;height:54px;border-radius:15px;color:var(--c);
  background:color-mix(in srgb,var(--c) 13%,#fff);
  display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:16px}
/* הכותרות מתחילות כולן באותו קו, כי האייקון מעליהן אחיד.
   הטקסט יושב מיד מתחת לכותרת שלו, גם אם היא נשברה לשתי שורות. */
.field h4{font-size:18px;font-weight:800;line-height:1.25}
.field p{font-size:14px;color:var(--muted);margin-top:7px;line-height:1.5}
@media(max-width:1100px){.field-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.field-grid{grid-template-columns:1fr}}

/* --- 4 · המשפך: המספרים נערכים בתוכו --- */
.fleak{flex-wrap:wrap}
.fstage .f-lead{display:block;width:100%;max-width:190px;margin:0 auto;
  background:transparent;border:none;border-bottom:2px dashed rgba(79,70,229,.4);
  font-family:'Secular One';font-size:42px;line-height:1;text-align:center;
  color:var(--accent);direction:ltr;padding:0 0 4px;outline:none;-moz-appearance:textfield}
.fstage .f-lead:focus{border-bottom-color:var(--accent)}
.fstage .f-lead::-webkit-outer-spin-button,
.fstage .f-lead::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.f-rate{display:inline-flex;align-items:center;gap:5px;background:#fff;
  border:1.5px solid var(--line);border-radius:20px;padding:5px 12px;
  font-size:12.5px;font-weight:700;color:var(--muted);box-shadow:var(--shadow-sm)}
.f-rate input{width:40px;border:none;background:transparent;font-family:inherit;
  font-weight:800;font-size:14px;color:var(--accent);text-align:center;
  direction:ltr;outline:none;-moz-appearance:textfield}
.f-rate input::-webkit-outer-spin-button,
.f-rate input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.f-rate b{color:var(--accent);font-weight:800}

/* --- 5 · "נעים להכיר" — הובא מגיליון המצגת, לא היה קיים כאן --- */
.guy-split{display:grid;grid-template-columns:0.85fr 1.15fr;gap:44px;align-items:center;margin-top:22px}
.guy-photo img{width:100%;max-height:56vh;object-fit:cover;border-radius:22px;
  box-shadow:var(--shadow);display:block}
.ph-cap{text-align:center;margin-top:14px;font-size:12.5px;font-weight:700;
  letter-spacing:.06em;color:var(--muted)}
.guy-text h2{margin-bottom:0}
.gtext{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.guy-points{display:grid;gap:18px;margin-top:22px}
.gp{display:flex;gap:16px;align-items:flex-start}
.gp-txt{flex:1}
.gp-txt h5{font-size:17.5px;font-weight:800;line-height:1.35}
.gp-txt p{font-size:14.5px;color:var(--muted);margin-top:5px;line-height:1.55}
.gp-num{flex:0 0 auto;width:44px;height:44px;border-radius:12px;display:flex;
  align-items:center;justify-content:center;font-family:'Secular One';font-size:18px;
  background:var(--grad-soft);color:var(--accent)}
/* במקור הכללים האלה הצביעו על משתנים שלא הוגדרו (--blue-soft וכו') ולכן לא צבעו כלום */
/* צבע אחד לשלוש הנקודות. ההבחנה ביניהן היא המספר, לא הגוון */
.gp-num{background:color-mix(in srgb,var(--accent) 13%,#fff);color:var(--accent)}
@media(max-width:980px){
  .guy-split{grid-template-columns:1fr;gap:26px}
  .guy-photo img{max-height:42vh}
}

/* --- 6 · כרטיסיות היכולות --- */
.cap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:20px;margin-top:40px}
.cap-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 26px 24px;box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.cap-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--accent)}
.cap-top{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.cap-ic{width:46px;height:46px;border-radius:13px;background:var(--grad-soft);color:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:19px;flex:0 0 auto}
.cap-card h4{font-size:19px;font-weight:800;line-height:1.25}
.cap-card p{font-size:15.5px;color:var(--muted);line-height:1.65}

/* --- 7 · ויזואל האינטגרציות בעמוד תווך 10 --- */
.pv-int{padding:18px}
.int-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.int-chip{background:var(--bg-alt);border:1px solid var(--line);border-radius:20px;
  padding:7px 14px;font-size:12.5px;font-weight:700;color:var(--muted);opacity:0;transform:translateY(8px)}
.pillar.in .int-chip{animation:remIn .45s var(--ease) forwards}
.pillar.in .int-chip:nth-child(1){animation-delay:.20s}
.pillar.in .int-chip:nth-child(2){animation-delay:.28s}
.pillar.in .int-chip:nth-child(3){animation-delay:.36s}
.pillar.in .int-chip:nth-child(4){animation-delay:.44s}
.pillar.in .int-chip:nth-child(5){animation-delay:.52s}
.pillar.in .int-chip:nth-child(6){animation-delay:.60s}
.pillar.in .int-chip:nth-child(7){animation-delay:.68s}
.pillar.in .int-chip:nth-child(8){animation-delay:.76s}
.pillar.in .int-chip:nth-child(9){animation-delay:.84s}

/* --- 8 · דוחות אלפא נכסים: ארבעה במקום שלושה --- */
.rep-grid{grid-template-columns:repeat(4,1fr);gap:18px}
.rep{padding:24px 22px}
.rep h4{font-size:18px}
@media(max-width:1100px){.rep-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.rep-grid{grid-template-columns:1fr}}

/* --- 9 · מצגת: אין סרגל ניווט קבוע, ולכן אין צורך ברווח עליון בשער --- */
.hero .container{padding-top:0}

/* --- 10 · כפתור הדגמה ופופ-אפ אתר --- */
.demo-btn{margin-top:24px;display:inline-flex;align-items:center;gap:9px;background:var(--c);color:#fff;
  border:none;border-radius:30px;padding:12px 24px;font-family:inherit;font-weight:800;font-size:14.5px;
  cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s,filter .2s}
.demo-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow);filter:brightness(1.06)}
.demo-btn i{font-size:13px}
/* שורת קישורים לדוחות. גרסה מתוארת של אותו כפתור,
   כדי שהיא לא תתחרה בכפתור הדמו הראשי שלידה */
.p-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.p-links .demo-btn{margin-top:0}
.demo-btn.ghost{background:transparent;color:var(--c);border:1.5px solid var(--c);
  padding:9px 18px;font-size:13.5px;box-shadow:none;text-decoration:none}
.demo-btn.ghost:hover{background:var(--c);color:#fff}

body.modal-lock{position:fixed;width:100%;overflow:hidden}

.site-ov{position:fixed;inset:0;z-index:600;background:rgba(8,9,20,.74);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;padding:22px;
  opacity:0;visibility:hidden;transition:opacity .25s var(--ease),visibility .25s}
.site-ov.open{opacity:1;visibility:visible}
.site-modal{width:min(1280px,96vw);height:min(900px,92vh);background:#fff;border-radius:20px;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 40px 100px -30px rgba(0,0,0,.62);transform:translateY(16px);transition:transform .28s var(--ease)}
.site-ov.open .site-modal{transform:none}
.site-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:13px 18px;border-bottom:1px solid var(--line);background:var(--bg-alt)}
.site-title{font-weight:800;font-size:16px;color:var(--ink)}
.site-actions{display:flex;align-items:center;gap:10px}
.site-open{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--accent);
  background:var(--grad-soft);border:1px solid var(--line);border-radius:30px;padding:8px 16px;transition:.18s}
.site-open:hover{border-color:var(--accent)}
.site-close{width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:#fff;
  color:var(--muted);font-size:24px;line-height:1;cursor:pointer;transition:.18s;flex:0 0 auto}
.site-close:hover{background:#fdeaea;color:#b83232;border-color:#f3c9c9}
.site-body{flex:1 1 auto;position:relative;background:var(--bg-alt);overflow:hidden}
/* מיקום מוחלט ולא גובה באחוזים: בתוך פריט flex אחוזי גובה לא נפתרים */
.site-body iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.site-shot{height:100%;overflow-y:auto;text-align:center;padding-bottom:20px}
.site-shot img{width:100%;display:block}
.site-note{display:inline-flex;align-items:center;gap:9px;margin-top:16px;background:#fff;
  border:1px solid var(--line);border-radius:30px;padding:10px 20px;font-size:13px;color:var(--muted);
  box-shadow:var(--shadow-sm);text-align:right}
.site-note i{color:var(--accent)}
@media(max-width:760px){
  .site-ov{padding:0}
  .site-modal{width:100%;height:100%;border-radius:0}
  .site-open span{display:none}
}

/* --- 11 · המסר המרכזי --- */
.manifesto{padding:104px 0;background:var(--bg)}
.manifesto .container{text-align:right}
.mf-head{max-width:none;margin:0;font-size:clamp(30px,4.2vw,54px);line-height:1.15;letter-spacing:-.02em}
.mf-a{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.mf-b{color:var(--ink)}
.mf-p{font-size:clamp(16px,1.5vw,19px);line-height:1.55;color:var(--muted);margin-top:20px;max-width:none}
.mf-close{display:inline-block;margin-top:34px;background:var(--grad-soft);
  border:1px solid var(--line);border-inline-start:4px solid var(--accent);
  border-radius:14px;padding:16px 26px;font-size:clamp(17px,1.7vw,21px);font-weight:800;color:var(--accent)}
@media(max-width:760px){.manifesto{padding:72px 0}}

/* --- 12 · דיאגרמת המעגל בסקשן הטכנולוגיה --- */
/* direction:ltr כדי שהמיקום הרדיאלי לא יתהפך בעמוד RTL */
.cyc{position:relative;direction:ltr;height:560px;margin-top:48px;--r:218px}
.cyc-ring{position:absolute;left:50%;top:50%;width:calc(var(--r) * 2 + 92px);height:calc(var(--r) * 2 + 92px);
  margin:calc(-1 * var(--r) - 46px) 0 0 calc(-1 * var(--r) - 46px);
  border-radius:50%;border:1px dashed rgba(255,255,255,.13)}
.cyc-ring::before{content:"";position:absolute;inset:-2px;border-radius:50%;
  border:2px solid transparent;border-top-color:var(--pop);border-right-color:rgba(200,255,61,.35);
  animation:cycSpin 9s linear infinite}
@keyframes cycSpin{to{transform:rotate(360deg)}}

.cyc-spokes{position:absolute;inset:0}
.cyc-spoke{position:absolute;left:50%;top:50%;width:var(--r);height:2px;transform-origin:0 50%;
  transform:rotate(var(--a));
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 7px,transparent 7px 15px)}
.cyc-spoke::after{content:"";position:absolute;top:-4px;width:10px;height:10px;border-radius:50%;
  background:var(--c);box-shadow:0 0 12px var(--c);animation:cycFlow 3.4s linear infinite;animation-delay:var(--d)}
.cyc-spoke.out::after{animation-direction:reverse}
.cyc-spoke.both::before{content:"";position:absolute;top:-4px;width:10px;height:10px;border-radius:50%;
  background:#fff;opacity:.75;animation:cycFlow 3.4s linear infinite reverse;animation-delay:calc(var(--d) + 1.5s)}
@keyframes cycFlow{
  0%{left:calc(var(--r) - 10px);opacity:0}
  12%{opacity:1}
  88%{opacity:1}
  100%{left:88px;opacity:0}
}

.cyc-hub{position:absolute;left:50%;top:50%;width:176px;height:176px;margin:-88px 0 0 -88px;
  border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  background:radial-gradient(circle at 50% 35%,rgba(124,58,237,.42),rgba(13,12,32,.9));
  border:2px solid rgba(124,58,237,.75);box-shadow:0 0 60px -10px rgba(124,58,237,.8);z-index:3}
.cyc-hub b{font-family:'Secular One',sans-serif;font-size:34px;color:#fff;line-height:1}
.cyc-hub span{font-size:12.5px;font-weight:700;color:var(--pop);text-align:center;direction:rtl}

.cyc-node{position:absolute;left:50%;top:50%;z-index:2;
  transform:translate(-50%,-50%) rotate(var(--a)) translateX(var(--r)) rotate(calc(-1 * var(--a)));
  display:flex;flex-direction:column;align-items:center;gap:9px;width:132px}
.cyc-ic{width:58px;height:58px;border-radius:17px;display:flex;align-items:center;justify-content:center;
  font-size:23px;color:var(--c);background:rgba(255,255,255,.06);border:1px solid var(--line-d);
  box-shadow:0 0 26px -12px var(--c)}
.cyc-lb{font-size:14px;font-weight:800;color:#fff;text-align:center;direction:rtl;white-space:nowrap}

.cyc-note{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:14px;
  font-size:14px;font-weight:700;color:var(--muted-d)}
.cyc-note i{color:var(--pop)}

@media(max-width:900px){
  .cyc{height:auto;direction:rtl;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
  .cyc-ring,.cyc-spokes{display:none}
  .cyc-hub{position:static;margin:0 0 8px;width:auto;height:auto;grid-column:1 / -1;
    border-radius:var(--r-sm);padding:22px;flex-direction:row;gap:12px}
  .cyc-node{position:static;transform:none;width:auto;flex-direction:row;gap:12px;
    background:rgba(255,255,255,.04);border:1px solid var(--line-d);border-radius:14px;padding:14px}
  .cyc-ic{width:44px;height:44px;font-size:18px;border-radius:13px}
}

/* --- 13 · יישור סקשן "מי אנחנו" לשאר המצגת --- */
/* היה נעול על 840px וממורכז, בעוד כל שאר הסקשנים נפרשים על רוחב המכולה */
.about-co{max-width:none;margin-inline:0;text-align:right}
.about-co .belief,.about-co .principle-lead,
.about-co .punch-sub,.about-co .co-para{max-width:none;margin-inline:0}
/* co-para היה justify, וזה יצר ריווח מילים לא אחיד מול שאר הפסקאות */
.about-co .co-para{text-align:right}

/* --- 14 · בולט בלי כותרת (מנועים 01–02) --- */
/* אותה שורה, אותו עיגול אייקון, רק בלי הכותרת המודגשת מעליו. */
.p-points .pt-solo{font-size:15px;line-height:1.6;color:var(--ink);font-weight:600;margin:0;padding-top:2px}

/* --- 16 · רשת עגינה לשקפים --- */
/* גיבוי לקפיצה שב-JS. אם בכל זאת דלפה גלילה טבעית, השקף עדיין
   נוחת צמוד לראש המסך במקום להישאר תקוע באמצע.
   proximity ולא mandatory: שקף שגבוה מהמסך נגלל בחופשיות
   ולא נלכד בין שתי נקודות עגינה. */
html{scroll-snap-type:y proximity}
#site>section,#solution .sec-head,#solution .pillar{scroll-snap-align:start}
#solution{scroll-snap-align:none}   /* הגוש כולו לא נקודת עגינה, רק חלקיו */
@media(prefers-reduced-motion:reduce){html{scroll-snap-type:none}}
/* --- 15 · תקציב ומחירים בתוך המשפך --- */
/* התקציב יושב בראש המשפך, וכל שלב מציג כמה הוא באמת עולה.
   הקימור הורחב כי כל שלב מחזיק עכשיו שלוש שורות ולא שתיים. */
.funnel{max-width:520px}
.fbudget{display:flex;align-items:center;justify-content:center;gap:12px;
  margin-bottom:14px;padding:12px 18px;border-radius:14px;
  background:var(--grad-soft);border:1px solid var(--line)}
.fb-label{font-size:13.5px;font-weight:800;color:var(--muted)}
.fb-in{display:inline-flex;align-items:center;gap:6px;background:#fff;
  border:1.5px solid var(--line);border-radius:10px;padding:5px 12px;
  box-shadow:var(--shadow-sm)}
.fb-in input{width:92px;border:none;background:transparent;font-family:'Secular One';
  font-size:19px;color:var(--ink);text-align:center;direction:ltr;outline:none}
.fb-in input::-webkit-outer-spin-button,
.fb-in input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.fb-in b{color:var(--accent);font-weight:800}

.fstage{padding:20px 16px}
.fcost{display:block;margin-top:6px;font-size:12.5px;font-weight:700;color:var(--muted)}
.fcost b{font-family:'Secular One';font-weight:400;font-size:15px;color:var(--accent);
  direction:ltr;unicode-bidi:plaintext}

/* קימור מתון יותר, כדי שארבעה שלבים יחזיקו טקסט */
.fstage.s1{clip-path:polygon(0 0,100% 0,93% 100%,7% 100%)}
.fstage.s2{clip-path:polygon(7% 0,93% 0,86% 100%,14% 100%)}
.fstage.s3{clip-path:polygon(14% 0,86% 0,79% 100%,21% 100%)}
.fstage.s4{clip-path:polygon(21% 0,79% 0,79% 100%,21% 100%);
  background:linear-gradient(180deg,#d2dbea,#c4d0e6)}
.fstage.s4 .fnum{font-size:38px;color:var(--accent)}
.fstage.s4 .fcost b{color:var(--red-txt)}

/* --- 17 · כל שקף תופס מסך מלא --- */
/* בלי זה השקפים קצרים מהמסך, ומתחת לכל אחד מציץ הבא אחריו.
   זאת הסיבה שהקוביות והמנועים לא נראו מופרדים. */
#site>section{min-height:100vh;display:flex;align-items:center;padding:56px 0}
#site>section>.container{width:100%}

/* סרגל הניווט הוסר במצב מצגת, אז אין מה לקזז מנקודת העגינה */
section,.pillar{scroll-margin-top:0}

/* גוש המנועים הוא מיכל של אחד עשר שקפים, לא שקף בעצמו */
#solution{display:block;min-height:0;padding:0}
#solution .sec-head{min-height:100vh;display:flex;flex-direction:column;
  justify-content:center;padding:56px 0}
#solution .pillar{min-height:100vh;align-content:center;padding:56px 0}

/* שקף שגבוה מהמסך נגלל בתוכו, אז הוא נצמד לראש ולא ממורכז */
#caps,#investment,#technology{align-items:flex-start}

/* --- 18 · הלוגואים בתוך שקף המסר --- */
/* שני ילדים בסקשן במקום אחד, אז הוא נערם לאורך ולא לרוחב */
#manifesto{flex-direction:column;justify-content:center}
#manifesto>.proof,#manifesto>.container{width:100%}
/* הפס כבר לא סקשן עצמאי: בלי קו מפריד, בלי רקע משלו */
.mf-logos{padding:0;background:transparent;border-bottom:0;margin-bottom:8px}
.mf-logos .logo-carousel{margin-bottom:0}
.mf-logos .lc-cap{margin-bottom:20px}

/* --- 19 · המשפך כצורה אחת רציפה --- */
/* קודם כל שלב נחתך בנפרד והרווחים ביניהם שברו את הצורה לערימת טרפזים.
   עכשיו החיתוך הוא אחד, על המעטפת, והשלבים יושבים בתוכו בלי מרווח. */
.funnel{max-width:500px}
.fbudget{margin-bottom:12px;padding:10px 16px}

.fcone{position:relative;overflow:hidden;border-radius:6px 6px 0 0;
  clip-path:polygon(0 0,100% 0,78% 100%,22% 100%);
  background:linear-gradient(180deg,#eef2f9 0%,#e5eaf4 40%,#d8e0ee 72%,#cbd6e8 100%)}

.funnel .fcone .fstage{clip-path:none;background:none;padding:13px 16px;text-align:center}
.fcone .fnum{font-size:28px}
.fcone .fstage.s4 .fnum{font-size:30px}
.fcone .f-lead{font-size:32px;max-width:150px;margin-bottom:2px}
.fcone .flabel{font-size:13px;margin-top:3px}
.fcone .fcost{margin-top:2px;font-size:11.5px}
.fcone .fcost b{font-size:14px}

/* התפר: אחוז המעבר ולידו הנזילה, על קו ההפרדה בין שני שלבים */
.fseam{display:flex;align-items:center;justify-content:center;gap:8px;
  padding:6px 10px;background:rgba(255,255,255,.5);
  border-top:1px solid rgba(255,255,255,.85);
  border-bottom:1px solid rgba(255,255,255,.85)}
.fcone .f-rate{padding:3px 9px;font-size:11.5px;gap:4px;box-shadow:none;white-space:nowrap}
.fcone .f-rate input{width:30px;font-size:13px}
.fcone .floss{padding:3px 10px;font-size:11.5px;box-shadow:none;white-space:nowrap}

@media(max-width:900px){
  .fcone{clip-path:polygon(0 0,100% 0,85% 100%,15% 100%)}
  .fcone .floss,.fcone .f-rate{font-size:10.5px}
}

/* --- 20 · שיהיה לכל שקף מקום במסך אחד --- */
/* מדדתי כל שקף מול גובה המסך וצמצמתי רק את מה שחרג. */
#site>section{padding:40px 0}

/* התמחור מפוצל לשלושה שקפים, אז הסקשן עצמו הוא מיכל ולא שקף */
#investment{display:block;min-height:0;padding:0}
.inv-part{min-height:100vh;display:flex;align-items:center;padding:40px 0}
.inv-part>.container{width:100%}
.inv-part .sec-head{margin-bottom:6px}
.inv-part .or-divider{margin-top:0}

/* מי אנחנו: ארבע קוביות נמוכות יותר וריווח הדוק */
#about .std-grid{gap:14px}
#about .std{padding:20px 18px}
#about .std h4{font-size:16px;margin-bottom:6px}
#about .std p{font-size:13.5px;line-height:1.55}
#about .co-para{margin-bottom:0}
#about .loc-row{margin-top:10px}

/* היכולות: חמש בשורה במקום שתיים, וכרטיס נמוך יותר */
.cap-grid{grid-template-columns:repeat(5,1fr);gap:12px;margin-top:22px}
.cap-card{padding:16px 14px}
.cap-card h4{font-size:14.5px}
.cap-card p{font-size:12.5px;line-height:1.5}
@media(max-width:1200px){.cap-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.cap-grid{grid-template-columns:1fr}}

/* הטכנולוגיה: העיגול מוקטן כדי שהדיאגרמה והכרטיסים ייכנסו יחד */
.cyc{height:440px;margin-top:26px;--r:170px}
.cyc-hub{width:140px;height:140px;margin:-70px 0 0 -70px}
.tech-feats-row{margin-top:18px}

/* כותרות סקשן דחוסות מעט, זה מה שהחזיר את הגובה בכל השקפים */
.sec-head .lead{margin-top:8px}
#caps .sec-head,#technology .sec-head{margin-bottom:4px}

/* --- 21 · מבנה אחיד לשקף --- */
/* לכל שקף בן יחיד אחד, וזה מה שמוקטן כשהוא חורג מהמסך. */
.slide{min-height:100vh;display:flex;align-items:center;padding:40px 0}
.slide>*{width:100%}
#solution .pillar{min-height:0;padding:0}
#solution .sec-head{min-height:0;display:block;padding:0}
#manifesto>.mf-wrap{width:100%}

/* --- 22 · שקף = מסך אחד בדיוק --- */
/* ההקטנה ב-JS מכווצת את מה שנראה, אבל לא את תיבת הפריסה.
   בלי גובה קבוע השקף נשאר ארוך מהמסך וממשיך לגלוש. */
#site>section,.slide,.inv-part{height:100vh;overflow:hidden}
#solution,#investment{height:auto;overflow:visible}
#caps,#technology{align-items:center}

/* --- 23 · תוספות התמחור בשתי עמודות --- */
/* בעמודה אחת הן האריכו את השקף עד שההקטנה הגיעה ל-64%. */
#inv-2 .extras-col{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
#inv-2 .extra-card{padding:16px 14px}
#inv-2 .extra-card h4{font-size:15px}
#inv-2 .extra-card .feat-list li{font-size:12.5px}
@media(max-width:900px){#inv-2 .extras-col{grid-template-columns:1fr}}

/* --- 24 · אוויר בין הלוגואים למסר --- */
.mf-logos{margin-bottom:52px}

/* --- 25 · חזרה לעיצוב המקורי של המשפך --- */
/* רווחים בין השלבים וטיפות על הנזילות, כמו בהתחלה,
   רק שעכשיו יש ארבעה שלבים ולכל אחד שורת מחיר. */
.funnel{max-width:540px}
.fcone{clip-path:none;background:none;overflow:visible;border-radius:0}
.funnel .fcone .fstage{padding:16px 16px}

/* כל שלב נחתך בנפרד, והקימור ממשיך משלב לשלב כדי שהצורה עדיין תיקרא כמשפך */
.fstage.s1{clip-path:polygon(0 0,100% 0,92% 100%,8% 100%);
  background:linear-gradient(180deg,#eef2f9,#e7ecf4)}
.fstage.s2{clip-path:polygon(8% 0,92% 0,84% 100%,16% 100%);
  background:linear-gradient(180deg,#e7ecf4,#dde4ef)}
.fstage.s3{clip-path:polygon(16% 0,84% 0,76% 100%,24% 100%);
  background:linear-gradient(180deg,#dde4ef,#d2dbea)}
.fstage.s4{clip-path:polygon(24% 0,76% 0,68% 100%,32% 100%);
  background:linear-gradient(180deg,#d2dbea,#c5d1e5)}

/* שורת הנזילה חוזרת אל מחוץ למשפך, בין השלבים */
.fleak{display:flex;align-items:center;justify-content:center;gap:8px;
  margin:5px 0;padding:0;background:none;border:0;position:relative;z-index:3}
.fcone .floss{padding:5px 13px;font-size:12.5px;box-shadow:var(--shadow-sm);white-space:nowrap}
.fcone .f-rate{padding:4px 11px;font-size:12.5px;box-shadow:var(--shadow-sm);white-space:nowrap}
.fcone .f-rate input{width:34px;font-size:14px}

/* --- 26 · תיקון: התמחור נפרס לרוחב במקום להיערם --- */
/* #investment לבדו חלש יותר מ-#site>section, אז display:flex ניצח
   ושלושת החלקים הסתדרו בשורה אחת. צריך סלקטור חזק ממנו. */
#site>section#investment{display:block;height:auto;overflow:visible;padding:0}

/* --- 27 · תיקון: גוש המנועים נחתך למסך אחד --- */
/* אותה תקלה כמו בתמחור: #solution חלש מ-#site>section, אז הוא קיבל
   height:100vh ו-overflow:hidden, וחתך עשרה מנועים לשקף אחד. */
#site>section#solution{display:block;height:auto;overflow:visible;padding:0}
#site>section#solution>.container{width:auto}

/* --- 28 · תיקון: השלבים במשפך נשארו בלי מילוי --- */
/* .funnel .fcone .fstage{background:none} מבלוק 19 חזק מ-.fstage.s1,
   אז הגרדיאנטים שהחזרתי לא נראו. מעלים את הסלקטור לאותה רמה. */
.funnel .fcone .fstage.s1{clip-path:polygon(0 0,100% 0,92% 100%,8% 100%);
  background:linear-gradient(180deg,#eef2f9,#e7ecf4)}
.funnel .fcone .fstage.s2{clip-path:polygon(8% 0,92% 0,84% 100%,16% 100%);
  background:linear-gradient(180deg,#e7ecf4,#dde4ef)}
.funnel .fcone .fstage.s3{clip-path:polygon(16% 0,84% 0,76% 100%,24% 100%);
  background:linear-gradient(180deg,#dde4ef,#d2dbea)}
.funnel .fcone .fstage.s4{clip-path:polygon(24% 0,76% 0,68% 100%,32% 100%);
  background:linear-gradient(180deg,#d2dbea,#c5d1e5)}

/* --- 29 · אוויר בין הקוביות לשורת הסניפים --- */
#about .loc-row{margin-top:30px}

/* --- 30 · סקשן שמחזיק כמה שקפים --- */
/* במקום חריג לכל מזהה בנפרד, שזה מה שגרם פעמיים לשקפים להיחתך:
   כל סקשן עם multi הוא מיכל של שקפים ולא שקף בעצמו. */
#site>section.multi{display:block;height:auto;overflow:visible;padding:0}
#about .slide{padding:40px 0}

/* --- 31 · שהתוכן יכבד את הרוחב שההתאמה קובעת לו --- */
/* בלי זה הוא נדחס כפריט גמיש וההצרה שמאפשרת את ההגדלה לא תופסת. */
#site>section>.container,.inv-part>.container,.slide>*,#manifesto>.mf-wrap{flex:0 0 auto}

/* --- 32 · תיקון: התוכן המוצר חייב להיות ממורכז --- */
/* ההגדלה מצרה את התוכן ואז מגדילה אותו מהמרכז שלו. אם הקופסה המוצרת
   יושבת בצד, ההגדלה דוחפת אותה החוצה והצד השני נחתך. */
#site>section,.slide,.inv-part{justify-content:center}
/* --- 33 · מסע הלקוח: איור גדול בכל תחנה, בסגנון האינפוגרפיקה --- */
/* בלי קופסה סביב האיור ובלי מוקאפים: זה מה שיצר את הצפיפות.
   האיור נושם על הרקע, המספר יושב על הסרט, והטקסט קצר. */





/* --- 34 · תפר חלק בין הפסים לעיקול --- */
/* שתי סיבות לקפיצה: הקצה המעוגל של הפס יצר חריץ מול הקצה הישר של
   העיקול, והצבעים לא נפגשו. הגרדיאנט מתחיל ב-#4f46e5 בקצה השמאלי,
   והעיקול היה צבוע ב-#7c3aed. */

/* --- 35 · נקודת יציאה: צומת על המסלול --- */
/* יושבת במרווח שבין התחנה לבאה אחריה, בדיוק על גובה הסרט.
   ההילה הלבנה חותכת את הסרט כך שהיא נראית מונחת עליו, כמו המספרים. */
/* שורה ראשונה זורמת ימינה לשמאלה, אז הבאה אחריה משמאל */
/* השורה השנייה הפוכה, אז הבאה אחריה מימין */

.jx-ov{position:fixed;inset:0;z-index:120;display:grid;place-items:center;
  background:rgba(11,12,22,.55);backdrop-filter:blur(4px);padding:24px;
  opacity:0;visibility:hidden;transition:.25s var(--ease)}
.jx-ov.open{opacity:1;visibility:visible}

/* קומפקטי ואופקי, במבנה של שורת בולט במנוע: ריבוע אייקון ולידו הטקסט.
   פאנל גדול עם אייקון קטן יצר הרבה קופסה סביב מעט תוכן. */
.jx-box{position:relative;background:var(--bg);border:1px solid var(--line);
  border-radius:var(--r);padding:30px 34px;max-width:470px;width:100%;
  box-shadow:var(--shadow);transform:translateY(12px);transition:.25s var(--ease)}
.jx-ov.open .jx-box{transform:none}
.jx-close{position:absolute;top:14px;inset-inline-end:14px;width:30px;height:30px;
  border-radius:50%;border:1px solid var(--line);background:var(--bg);
  color:var(--faint);cursor:pointer;font-size:13px;transition:.2s var(--ease)}
.jx-close:hover{background:var(--bg-alt);color:var(--ink)}

.jx-row{display:flex;align-items:flex-start;gap:18px}
.jx-ic{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;flex:none;
  background:color-mix(in srgb,var(--c) 13%,#fff);color:var(--c);font-size:21px}
.jx-step{font-size:12.5px;font-weight:800;color:var(--faint);margin-bottom:6px}
.jx-box h3{font-size:22px;font-weight:800;color:var(--ink);line-height:1.25;margin-bottom:7px}
.jx-txt{font-size:15px;line-height:1.6;color:var(--muted)}

/* --- 36 · טקסט גדול ומודגש בתוך המשפך --- */
/* הסכום בשורה נפרדת מהתווית, כדי שיישאר קריא גם בשלבים הצרים.
   הקימור רוכך והמשפך הורחב, אחרת הטקסט הגדול לא נכנס למטה. */
.funnel{max-width:590px}
.funnel .fcone .fstage.s1{clip-path:polygon(0 0,100% 0,94% 100%,6% 100%)}
.funnel .fcone .fstage.s2{clip-path:polygon(6% 0,94% 0,88% 100%,12% 100%)}
.funnel .fcone .fstage.s3{clip-path:polygon(12% 0,88% 0,82% 100%,18% 100%)}
.funnel .fcone .fstage.s4{clip-path:polygon(18% 0,82% 0,76% 100%,24% 100%)}

.fcone .flabel{font-size:16px;font-weight:800;color:var(--ink);margin-top:4px}
.fcone .fcost{display:block;margin-top:7px}
.fcone .fcost b{display:block;font-family:'Secular One';font-weight:400;
  font-size:19px;color:var(--accent);direction:rtl}
.fcone .fcost em{display:block;font-style:normal;font-size:13.5px;
  font-weight:800;color:var(--muted);margin-top:2px}
.fcone .fstage.s4 .fcost b{color:var(--red-txt)}
.funnel .fcone .fstage{padding:15px 16px}

/* --- 37 · יישור המסר ומי אנחנו למרכז, כמו שאר המצגת --- */
/* שאר הסקשנים משתמשים ב-.sec-head שהוא בלוק ממורכז ברוחב 840,
   ואלה נשארו ברוחב מלא ולכן נדחפו ימינה. */
#manifesto .container{max-width:840px}
#about .about-co{max-width:840px;margin-inline:auto}

/* --- 38 · היציאה של תחנה 4 יושבת על העיקול --- */
/* היא התחנה האחרונה בשורה, אז אין אחריה מרווח והצומת ברחה מחוץ למסלול.
   העיקול חופף לעמודה הזאת ממילא, אז הצומת מתמקמת על הקטע האנכי שלו. */

/* --- 39 · הכותרת ב"מי אנחנו" חייבת להישבר לשורות --- */
/* .belief מוגדר white-space:nowrap מעל 600 פיקסל. זה התאים למשפט הקודם
   שהיה קצר, והמשפט החדש ארוך ממנו ולכן גלש ונחתך בקצה השקף. */
#about .belief{white-space:normal}

/* --- 40 · האתגר מפוצל לשני שקפים --- */
/* הכשלים והמשפך ישבו זה לצד זה והיו צפופים. עכשיו כל אחד בשקף שלו,
   ולכן הכשלים עוברים לשתי עמודות והמשפך מתמרכז. */
#challenge .pains{grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
#challenge .funnel{margin:26px auto 0}
@media(max-width:820px){#challenge .pains{grid-template-columns:1fr}}

/* --- 41 · הצומת שעל העיקול חייבת להיות לחיצה --- */
/* היא יושבת מתחת לגובה השורה הראשונה, ולכן השורה השנייה, שמגיעה
   אחריה ב-DOM באותו z-index, נצבעה מעליה ובלעה את הלחיצה. */

}

/* ===== 43 · קרוסלת הלוגואים: רווח אחיד בין קצה לקצה =====
   משבצת ברוחב קבוע לא עובדת כאן: לוגו רחב ממלא אותה עד הקצה
   ולוגו מרובע משאיר בה אוויר, ואז הרווח הנראה לעין משתנה.
   כאן המשבצת מתהדקת לגודל הלוגו, ולכן המרווח בין כל שני לוגואים
   הוא בדיוק ערך ה-gap, בלי תלות בצורה של הלוגו. */
.lc-logo{width:auto}
.lc-logo img{max-width:170px}
.logo-track{gap:80px}
.proof .lc-logo{width:auto}
.proof .lc-logo img{max-height:96px;max-width:230px}
.proof .logo-track{gap:100px}
/* קבצי SVG בלי מידות מוגדרות מקבלים אפס רוחב כשהמשבצת
   מתהדקת אליהם, ולכן נותנים להם גובה מפורש */
.proof .lc-logo img[src*=".svg"]{height:96px;width:auto}
@media(max-width:980px){
  .proof .lc-logo img{max-height:64px;max-width:160px}
  .proof .lc-logo img[src*=".svg"]{height:64px}
  .proof .logo-track{gap:64px}
}

/* ===== 45 · שקף הברקודים =====
   הברקוד חייב להיות גדול מספיק כדי שאפשר לסרוק אותו מסוף האולם,
   ועל רקע לבן נקי כדי שהמצלמה תנעל עליו מיד. */
.qr-slide{text-align:center;max-width:860px;margin:0 auto}
.qr-slide h2{margin-top:6px}
.qr-slide .lead{margin-top:12px;color:var(--muted)}
.qr-pair{display:flex;justify-content:center;gap:44px;margin-top:38px;flex-wrap:wrap}
.qr-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow-sm);padding:18px 18px 14px}
.qr-card img{display:block;width:206px;height:206px;image-rendering:pixelated}
.qr-card{width:242px}
.qr-card b{display:block;margin-top:13px;font-size:14px;font-weight:800;
  line-height:1.4;color:var(--ink);text-wrap:balance}
@media(max-width:640px){
  .qr-pair{gap:22px}
  .qr-card img{width:150px;height:150px}
}


/* ===== 46 · מסע הלקוח =====
   רקע כהה, אייקונים עדינים, קו זוהר.
   הכל בצבע הליים של ההדגשה, כי עשרה צבעים הפכו את השקף לרועש.

   קנה מידה אחד, --js, שולט על כל המידות.
   הוא גדל רק כשגם הרוחב וגם הגובה של המסך מספיקים,
   כדי שבמסך מלא זה יהיה גדול ובמחשב נייד זה עדיין ייכנס לשקף. */
/* גם הכותרת הקטנה עוברת לסגול, אחרת נשאר כתם ליים בודד בשקף */
#journey .eyebrow{color:var(--purple)}
#journey .eyebrow::before{background:var(--purple)}
#journey{--js:1}
@media (max-height:790px){#journey{--js:.9}}
@media (min-width:1400px) and (min-height:850px){#journey{--js:1.1}}
@media (min-width:1600px) and (min-height:920px){#journey{--js:1.2}}
@media (min-width:1800px) and (min-height:965px){#journey{--js:1.28}}
#journey>.container{max-width:min(1680px,95vw)}
/* השקף הזה צפוף יותר משאר השקפים, ולכן הוא מוותר על ריפוד הגובה */
#journey .slide{padding:18px 0}

/* .slide מוגדר בגיליון כ-flex בשורה, ולכן הכותרת
   והמסלול נעמדו זה לצד זה במקום זה מתחת לזה. */
#journey .slide{flex-direction:column;justify-content:center}
#journey .slide>.container{width:100%}
/* אוויר בין הכותרת לתחנות. גדל יחד עם שאר השקף */
#journey .sec-head{margin-bottom:calc(40px * var(--js))}
#journey h2.disp{font-size:clamp(28px,calc(3.5vw * var(--js)),56px)}

.jr-wrap{position:relative;padding-right:calc(74px * var(--js))}
.jr-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;
  overflow:visible}
.jr-svg path{fill:none;stroke:rgba(255,255,255,.16);stroke-width:calc(8px * var(--js));
  stroke-linecap:round;stroke-linejoin:round}

.jr-rows{position:relative;z-index:2}
.jr-row{display:grid;grid-template-columns:repeat(5,1fr);gap:calc(24px * var(--js));
  align-items:start}
.jr-row.one{direction:ltr}
.jr-row.two{margin-top:calc(30px * var(--js))}
.jr-row .jr-st{direction:rtl}

/* אותו קצב בכל תחנה, אחרת העיגולים לא יושבים על קו אחד */
.jr-st{display:flex;flex-direction:column;align-items:center;text-align:center;
  max-width:calc(252px * var(--js));margin:0 auto}
.jr-art{position:relative;height:calc(100px * var(--js));
  display:flex;align-items:center;justify-content:center}
/* סמל הוואטסאפ המקורי, כתג על השעון.
   עיגול בצבע הרקע מפריד אותו מקווי השעון */
.jr-wa{position:absolute;right:2%;top:-2%;
  width:calc(48px * var(--js));height:calc(48px * var(--js));border-radius:50%;
  display:grid;place-items:center;font-size:calc(33px * var(--js));
  color:var(--c);background:var(--ink)}
.jr-art svg{width:calc(132px * var(--js));height:calc(99px * var(--js));color:var(--c);
  filter:drop-shadow(0 0 calc(16px * var(--js)) color-mix(in srgb,var(--c) 32%,transparent))}
/* המילוי הלבן שבתוך האיורים הופך לכהה, אחרת הוא זוהר על רקע כהה */
.jr-art svg [fill="#fff"]{fill:#141530}
.jr-dot{width:calc(42px * var(--js));height:calc(42px * var(--js));border-radius:50%;
  display:grid;place-items:center;
  background:var(--c);color:#0b0c16;font-family:'Secular One';
  font-size:calc(17px * var(--js));line-height:1;
  box-shadow:0 0 0 calc(8px * var(--js)) var(--ink),0 0 calc(22px * var(--js)) -2px var(--c)}
.jr-st h4{margin-top:calc(15px * var(--js));font-size:calc(16.5px * var(--js));
  font-weight:800;line-height:1.35;color:#fff;text-wrap:balance}
/* גם כשהתווית ריקה היא שומרת את הגובה שלה,
   ולכן כל הפסקאות מתחילות באותו קו */
.jr-st h4 em{display:block;font-style:normal;font-size:calc(12px * var(--js));
  font-weight:700;color:var(--c);margin-top:calc(3px * var(--js));
  line-height:1.3;letter-spacing:.02em}
.jr-st p{margin-top:calc(9px * var(--js));font-size:calc(13.5px * var(--js));
  line-height:1.7;color:rgba(255,255,255,.74)}

/* היעד: שקף משלו, עם קונפטי */
.jr-goal-slide{display:flex;align-items:center;justify-content:center}
.jr-goal{position:relative;text-align:center;max-width:820px;margin:0 auto}
.jr-in{position:absolute;top:-92px;inset-inline-start:50%;width:300px;height:160px;
  transform:translateX(-50%);pointer-events:none}
.jr-in path{fill:none;stroke:rgba(255,255,255,.16);stroke-width:8;stroke-linecap:round}
.jr-key{position:relative;width:132px;height:132px;border-radius:38px;margin:0 auto 30px;
  display:grid;place-items:center;background:var(--green);color:#0b0c16;font-size:56px;
  box-shadow:0 0 70px -8px color-mix(in srgb,var(--green) 75%,transparent)}
.jr-conf{position:absolute;inset:0;pointer-events:none}
.jr-conf i{position:absolute;top:50%;left:50%;width:11px;height:17px;border-radius:3px;
  background:var(--c2);opacity:.95;
  transform:translate(-50%,-50%) translate(var(--x),var(--y)) rotate(var(--r));
  box-shadow:0 0 10px -1px var(--c2)}
.jr-goal h3{font-family:'Secular One',sans-serif;font-weight:400;
  font-size:clamp(28px,4.2vw,50px);line-height:1.18;color:#fff;text-wrap:balance}
.jr-goal p{margin-top:16px;font-size:clamp(17px,2.1vw,23px);line-height:1.65;
  color:rgba(255,255,255,.78);max-width:660px;margin-inline:auto}

@media(max-width:1150px){
  .jr-row{grid-template-columns:1fr 1fr;gap:26px}
  .jr-row.one{direction:rtl}
  .jr-wrap{padding-right:0}
  .jr-svg{display:none}
}

/* ===== 47 · האינפוגרפיקה של מסע הלקוח =====
   התמונה מהרפרנס, אחרי שלושה תיקונים: הסרט נצבע בסגול של המצגת,
   אזורי הטקסט נמחקו בצבע הרקע, וחתימת NotebookLM ירדה.
   הטקסטים נכתבים מעל, בקואורדינטות באחוזים ובגופן של המצגת,
   ולכן הם גדלים יחד עם התמונה ולא מתפרקים בשום גודל מסך. */
/* בלי ריפוד ובלי מסגרת: התמונה היא השקופית.
   רקע השקופית בדיוק בצבע רקע התמונה, ולכן כשיחס המסך
   שונה מיחס התמונה לא נראות רצועות כהות בצדדים. */
.jm-slide{display:flex;align-items:center;justify-content:center;padding:0;
  background:rgb(227,225,243)}
/* בלי מידות קבועות ובלי חישוב לפי vh.
   למצגת יש כבר מנגנון שמודד כל שקף ומתאים אותו לגובה המסך,
   ולכן נותנים לו לעשות את העבודה. הטקסטים ממוקמים באחוזים
   מרוחב העטיפה, ולכן הם נצמדים לתמונה בכל קנה מידה. */
/* מקצה לקצה של המסך, וכשהמסך נמוך מדי הרוחב נחסם לפי הגובה
   כדי שהתמונה תמיד תיכנס בשלמותה. יחס התמונה, 1.7917, זהה כמעט
   ליחס של מסך רגיל, ולכן בפועל היא ממלאת כמעט את כל השקף. */
.jm-wrap{position:relative;margin:0 auto;
  width:min(100vw, calc(100vh * 1.7917));
  container-type:inline-size}
.jm-wrap img{width:100%;height:auto;display:block}

.jm-t{position:absolute;color:#16233a;text-align:right;line-height:1.55}
.jm-t b{display:block;font-weight:800;color:#0f1c33}

.jm-title{right:5%;left:5%;top:3.1%;text-align:center;
  font-family:'Secular One',sans-serif;font-weight:400;
  font-size:2.15cqw;line-height:1.2;color:#12213d}

.jm-st{font-size:.88cqw;color:#3d4759}
.jm-st b{font-size:1.12cqw;line-height:1.3;margin-bottom:.5cqw}

.jm-goal{right:1.37%;width:23.25%;top:12.8%;font-size:.88cqw;color:#48546b}
.jm-goal b{font-size:1.62cqw;line-height:1.24;margin-bottom:.7cqw;color:#12213d}

/* ===== 48 · קיר הלוגואים =====
   ניסוי: הלוגואים בשקופית שלמה במקום בפס נע.
   הלוגואים תוכננו לרקע בהיר, ולכן השקופית בהירה.
   כל לוגו בכרטיס בגודל אחיד, כדי שגדלים שונים לא ייראו מבולגנים. */
#logos .lg-head{text-align:center;margin-bottom:34px}
#logos .lg-head h2{max-width:900px;margin-inline:auto}

.lg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
/* כשמספר הלוגואים לא מתחלק בחמש, האחרון נשאר לבד בשורה.
   במקום שיישב בקצה, הוא נדחף לעמודה האמצעית. */
.lg-grid > .lg:last-child:nth-child(5n+1){grid-column:3}
.lg{display:flex;align-items:center;justify-content:center;
  background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:16px 14px;height:132px;box-shadow:var(--shadow-sm);
  transition:transform .2s var(--ease),box-shadow .2s}
.lg:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.lg img{max-height:60px;max-width:100%;width:auto;object-fit:contain}
/* לוגו לגובה, או לוגו שהוא בעצמו כרטיס כהה, יוצא קטן מדי
   בגובה האחיד. הוא מקבל תקרה גבוהה יותר וכמעט את כל רוחב הכרטיס. */
.lg.tall{padding:8px}
.lg.tall img{max-height:116px}
/* קובצי SVG בלי מידות פנימיות מתכווצים לרוחב אפס בלי הכלל הזה */
.lg img[src*=".svg"]{height:60px;width:auto;max-width:100%}

@media(max-width:1100px){.lg-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:820px){.lg-grid{grid-template-columns:repeat(3,1fr)}
  .lg{height:104px}.lg img{max-height:48px}
  .lg.tall img{max-height:88px}}
@media(max-width:560px){.lg-grid{grid-template-columns:repeat(2,1fr)}}

/* ===== 49 · סקשן הדוחות =====
   שורות ולא כרטיסים גדולים: יש כאן עשרה פריטים,
   ורשימה קריאה עדיפה על קיר של קופסאות. */
.rp-eyebrow{margin-bottom:14px}
.rp-eyebrow .eyebrow{margin-bottom:0}
.rp-group + .rp-group{margin-top:26px}
.rp-head{font-size:13px;font-weight:800;letter-spacing:.06em;color:var(--muted);
  margin-bottom:12px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.rp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rp{display:flex;align-items:center;gap:15px;text-decoration:none;color:inherit;
  background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:15px 18px;box-shadow:var(--shadow-sm);
  transition:transform .2s var(--ease),border-color .2s,box-shadow .2s}
.rp:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:var(--shadow)}
.rp-ic{flex:none;width:44px;height:44px;border-radius:13px;background:var(--grad-soft);
  color:var(--accent);display:grid;place-items:center;font-size:18px}
.rp-tx{flex:1;min-width:0}
.rp-tx b{display:block;font-size:16px;font-weight:800;line-height:1.3}
.rp-tx em{display:block;font-style:normal;font-size:13px;line-height:1.55;
  color:var(--muted);margin-top:3px}
.rp-go{flex:none;color:var(--faint);font-size:14px;transition:color .2s,transform .2s}
.rp:hover .rp-go{color:var(--accent);transform:translate(-3px,-3px)}

@media(max-width:900px){.rp-grid{grid-template-columns:1fr}}

/* ===== 50 · שקופית התודה =====
   סוגרת מול הפתיחה: רקע כהה, ולכן ההדגשה בליים לפי הכלל.
   הברקודים על אריח לבן, כי סורק זקוק לניגודיות מלאה. */
#thanks{text-align:center}
.th-wrap{max-width:1000px;margin:0 auto}
.th-h{font-size:clamp(38px,6vw,76px);color:#fff;line-height:1.05}
.th-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:46px}
.th-card{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.04);border:1px solid var(--line-d);border-radius:var(--r);
  padding:24px 22px 20px;
  transition:transform .25s var(--ease),border-color .25s,box-shadow .25s}
.th-card:hover{transform:translateY(-5px);border-color:var(--pop);
  box-shadow:0 26px 56px -26px color-mix(in srgb,var(--pop) 55%,transparent)}
.th-top{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.th-ic{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--pop) 16%,transparent);color:var(--pop);font-size:19px}
.th-tag{font-size:11.5px;font-weight:800;letter-spacing:.12em;color:var(--pop)}
.th-card h3{font-size:21px;font-weight:800;color:#fff;line-height:1.3}
/* גובה קבוע של שתי שורות, אחרת תיאור קצר מרים את הברקוד
   וברקוד אחד יוצא גבוה מהשני */
.th-card p{margin-top:8px;font-size:14.5px;line-height:1.65;min-height:3.3em;
  color:rgba(255,255,255,.66);max-width:330px}
.th-qr{margin-top:auto;padding-top:18px;background:#fff;border-radius:16px;padding:12px;line-height:0}
.th-qr img{width:172px;height:172px;display:block}
.th-scan{margin-top:10px;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--pop)}
.th-scan i{margin-inline-end:5px}

.th-sign{margin-top:34px;font-size:13px;letter-spacing:.06em;color:rgba(255,255,255,.45)}

@media(max-width:760px){
  .th-grid{grid-template-columns:1fr}
  .th-qr img{width:140px;height:140px}
}

/* ===== 51 · נקודות היציאה על המסלול =====
   כפתור X אדום על הסרט, בנקודה שבה הליד נושר.
   אדום כי זה אובדן ליד, לפי כלל צבעי המצב.
   המידות ב-cqw ולכן הן גדלות יחד עם התמונה. */
.jm-exit{position:absolute;transform:translate(50%,-50%);
  width:2.5cqw;height:2.5cqw;border-radius:50%;
  display:grid;place-items:center;padding:0;cursor:pointer;
  color:#fff;background:var(--red);border:.16cqw solid #fff;
  font-size:1.25cqw;line-height:1;
  box-shadow:0 .25cqw .8cqw -.1cqw rgba(120,20,20,.6);
  transition:transform .2s var(--ease),box-shadow .2s,filter .2s;z-index:3}
.jm-exit:hover{transform:translate(50%,-50%) scale(1.18);filter:brightness(1.06);
  box-shadow:0 .45cqw 1.3cqw -.1cqw rgba(120,20,20,.75)}
.jm-exit:focus-visible{outline:.2cqw solid var(--ink);outline-offset:.2cqw}

.jx-lead{margin-top:8px;font-size:16px;font-weight:800;line-height:1.5;color:var(--ink)}
.jx-txt{margin-top:8px}

/* ===== 52 · הדגמת קביעת פגישה =====
   לולאה של שמונה שניות: בחירת מועד, כניסה ליומן, אישור.
   כל האלמנטים על אותו ציר זמן באחוזים, ולכן הם נשארים מסונכרנים. */
.pv-book{padding:18px;position:relative}
.bk-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;
  color:var(--ink);margin-bottom:12px}
.bk-head i{color:var(--accent)}

.bk-days{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:12px}
.bk-days span{text-align:center;font-size:12px;font-weight:800;color:var(--faint);
  padding:6px 0;border-radius:9px;background:var(--bg-alt)}
.bk-days span.on{background:color-mix(in srgb,var(--accent) 14%,#fff);color:var(--accent)}

.bk-slots{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.bk-s{text-align:center;font-size:12.5px;font-weight:800;padding:9px 0;border-radius:10px;
  background:var(--bg-alt);border:1px solid var(--line);color:var(--muted)}
.bk-s.off{color:var(--faint);opacity:.5;text-decoration:line-through}
.bk-cursor{position:absolute;color:var(--ink);font-size:17px;pointer-events:none;
  right:14%;top:78%;opacity:0}

.bk-cal{margin-top:14px;border-top:1px dashed var(--line);padding-top:12px;
  display:flex;flex-direction:column;gap:7px}
.bk-row{display:flex;align-items:center;gap:9px}
.bk-row b{flex:none;width:42px;font-size:11.5px;font-weight:800;color:var(--faint)}
.bk-row span{flex:1;height:26px;border-radius:8px;background:var(--bg-alt);
  border:1px dashed var(--line)}
.bk-book span{background:var(--accent);border:1px solid var(--accent);
  display:flex;align-items:center;padding:0 10px;overflow:hidden;width:0;flex:none}
.bk-book em{font-style:normal;font-size:11.5px;font-weight:800;color:#fff;white-space:nowrap}

.bk-toast{margin-top:12px;display:inline-flex;align-items:center;gap:7px;
  font-size:12px;font-weight:800;padding:7px 13px;border-radius:20px;
  background:color-mix(in srgb,var(--green) 13%,#fff);color:#0a7d52;
  border:1px solid color-mix(in srgb,var(--green) 30%,#fff);opacity:0;transform:translateY(6px)}
.bk-toast i{color:var(--green)}

/* הלולאה מתחילה רק כשהשקופית נחשפת */
.pillar.in .bk-cursor{animation:bkCur 8s var(--ease) infinite}
.pillar.in .bk-s.pick{animation:bkPick 8s var(--ease) infinite}
.pillar.in .bk-book span{animation:bkGrow 8s var(--ease) infinite}
.pillar.in .bk-toast{animation:bkToast 8s var(--ease) infinite}

@keyframes bkCur{
  0%,4%{right:14%;top:78%;opacity:0}
  10%{opacity:1}
  22%{right:50%;top:26%;opacity:1}
  25%{transform:scale(.82)}
  28%{transform:scale(1)}
  36%{opacity:1}
  44%,100%{right:50%;top:26%;opacity:0}
}
@keyframes bkPick{
  0%,24%{background:var(--bg-alt);border-color:var(--line);color:var(--muted)}
  27%,88%{background:var(--accent);border-color:var(--accent);color:#fff}
  96%,100%{background:var(--bg-alt);border-color:var(--line);color:var(--muted)}
}
@keyframes bkGrow{
  0%,30%{width:0}
  44%,88%{width:100%}
  96%,100%{width:0}
}
@keyframes bkToast{
  0%,46%{opacity:0;transform:translateY(6px)}
  52%,88%{opacity:1;transform:none}
  94%,100%{opacity:0;transform:translateY(6px)}
}
@media(prefers-reduced-motion:reduce){
  .pillar.in .bk-cursor{display:none}
  .pillar.in .bk-s.pick{animation:none;background:var(--accent);border-color:var(--accent);color:#fff}
  .pillar.in .bk-book span{animation:none;width:100%}
  .pillar.in .bk-toast{animation:none;opacity:1;transform:none}
}

/* ===== 53 · הדגמת תזכורת ודחיית מועד =====
   לולאה של תשע שניות. הלקוח לא מבריז, הוא דוחה מועד בלחיצה. */
.pv-remind{padding:18px;position:relative}
.rm-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;
  color:var(--ink);margin-bottom:14px}
.rm-head i{color:var(--green);font-size:16px}

.rm-thread{display:flex;flex-direction:column;gap:9px}
.rm-b{max-width:82%;font-size:12.5px;line-height:1.5;font-weight:600;
  padding:9px 12px;border-radius:14px;opacity:0;transform:translateY(8px)}
/* בעברית ההודעה שמתקבלת יושבת משמאל ומה שהלקוח שולח יושב מימין,
   כמו בוואטסאפ. ב-RTL זה flex-end לנכנסת ו-flex-start ליוצאת. */
.rm-b.in{align-self:flex-end;background:var(--bg-alt);border:1px solid var(--line);
  color:var(--ink);border-end-end-radius:5px}
.rm-b.out{align-self:flex-start;background:color-mix(in srgb,var(--accent) 14%,#fff);
  border:1px solid color-mix(in srgb,var(--accent) 28%,#fff);color:var(--accent);
  border-end-start-radius:5px;font-weight:800}

.rm-acts{position:relative;align-self:flex-end;display:flex;flex-wrap:wrap;gap:6px;
  max-width:92%;opacity:0}
.rm-acts span{font-size:11.5px;font-weight:800;padding:6px 12px;border-radius:20px;
  background:#fff;color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 30%,#fff)}
.rm-cursor{position:absolute;color:var(--ink);font-size:16px;pointer-events:none;
  left:6%;top:150%;opacity:0}

.rm-toast{margin-top:14px;display:inline-flex;align-items:center;gap:7px;
  font-size:12px;font-weight:800;padding:7px 13px;border-radius:20px;
  background:color-mix(in srgb,var(--green) 13%,#fff);color:#0a7d52;
  border:1px solid color-mix(in srgb,var(--green) 30%,#fff);opacity:0;transform:translateY(6px)}
.rm-toast i{color:var(--green)}

.pillar.in .rm-b.b1{animation:rmIn 9s var(--ease) infinite}
.pillar.in .rm-acts.a1{animation:rmActs 9s var(--ease) infinite}
.pillar.in .rm-cursor{animation:rmCur 9s var(--ease) infinite}
.pillar.in .rm-acts .tap{animation:rmTap 9s var(--ease) infinite}
.pillar.in .rm-b.b2{animation:rmB2 9s var(--ease) infinite}
.pillar.in .rm-b.b3{animation:rmB3 9s var(--ease) infinite}
.pillar.in .rm-b.b4{animation:rmB4 9s var(--ease) infinite}
.pillar.in .rm-toast{animation:rmToast 9s var(--ease) infinite}

@keyframes rmIn{0%,3%{opacity:0;transform:translateY(8px)}9%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes rmActs{0%,11%{opacity:0}16%,92%{opacity:1}97%,100%{opacity:0}}
@keyframes rmCur{
  0%,17%{left:6%;top:150%;opacity:0}
  21%{opacity:1}
  27%{left:34%;top:14%;opacity:1;transform:scale(1)}
  30%{transform:scale(.8)}
  33%{transform:scale(1)}
  40%{left:34%;top:14%;opacity:0}
  100%{opacity:0}
}
@keyframes rmTap{
  0%,30%{background:#fff;color:var(--accent)}
  33%,92%{background:var(--accent);color:#fff;border-color:var(--accent)}
  97%,100%{background:#fff;color:var(--accent)}
}
@keyframes rmB2{0%,37%{opacity:0;transform:translateY(8px)}43%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes rmB3{0%,50%{opacity:0;transform:translateY(8px)}56%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes rmB4{0%,63%{opacity:0;transform:translateY(8px)}69%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes rmToast{0%,74%{opacity:0;transform:translateY(6px)}80%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(6px)}}

@media(prefers-reduced-motion:reduce){
  .pillar.in .rm-b,.pillar.in .rm-acts,.pillar.in .rm-toast{animation:none;opacity:1;transform:none}
  .pillar.in .rm-cursor{display:none}
  .pillar.in .rm-acts .tap{animation:none;background:var(--accent);color:#fff;border-color:var(--accent)}
}

/* ===== 54 · האייקון והטקסט באותו גובה =====
   ניקול אישרה את המיקום של האריח בבולט הדו שורתי של סעיף 02: ראשו
   5.25 פיקסלים מתחת לראש הטקסט, כלומר בדיוק בגובה השורה הראשונה.
   הכלל כאן לוקח את המיקום המאושר הזה והופך אותו לקבוע בכל 32 הבולטים,
   בלי קשר לאורך הטקסט.

   למה לא align-items:center: בבולט של שלוש או ארבע שורות המרכוז מוריד
   את האריח לאמצע הפסקה, ליד השורה השנייה, והוא מתנתק מתחילת המשפט.
   ניקול סימנה את זה במפורש: כשהטקסט ארוך, ראש האריח נשאר על השורה
   הראשונה.

   שלושת המספרים, וכולם נגזרים ולא שרירותיים:
   48.5 = גובה בולט דו שורתי, שתי שורות של 23.25 ועוד padding-top של 2.
   5.25 = (48.5 - 38) / 2, ההיסט שניקול אישרה בסעיף 02.
   ה-min-height מרים בולט של שורה אחת לאותו גובה וממרכז בתוכו את
   הטקסט, ואז מרכז הטקסט ומרכז האריח נופלים שניהם על 24.25. בלעדיו
   האריח היה נשמט מתחת לשורה הבודדת, וזאת הייתה התלונה הראשונה.

   גובה הפריסה גדל ב-10.5 פיקסלים רק בשלושת הבולטים של שורה אחת,
   שניים במנוע 01 ואחד במנוע 05. שניהם נשארים הרחק מתקרת 607 של
   fitSlides, ולכן k נשאר 1.35 בכל שבעת הסעיפים.

   תלות: 23.25 מגיע מ-line-height 1.55 בשורה 200, שמנצחת בסלקטור את
   ההכרזה 1.6 של pt-solo בשורה 891. אם 891 תיהפך לפעילה, 48.5 יהפוך
   ל-50 ו-5.25 יהפוך ל-6. */
.p-points .pt{align-items:flex-start}
.p-points .pt .d{margin-top:5.25px}
.p-points .pt>div:last-child{min-height:48.5px;display:flex;flex-direction:column;justify-content:center}