/* ============================================================
   Simple Solution | עיצוב האתר, גרסה ב
   רקע אחד רציף · כרטיסי זכוכית · כותרות ממורכזות עד שתי שורות
   יחידת ריווח: 8px. כל מרווח הוא כפולה שלה.
   ============================================================ */

:root{
  /* צבע */
  --ink:#0d0822; --ink-2:#120b2c; --deep:#2d1b69; --deep-2:#3d2a8f;
  --purple:#8b6ae0; --purple-lo:#6d4ac9; --blue:#4f7cf7;
  --gold:#e8c25a; --gold-lo:#c89f3c;
  --text:#f4f1fd; --text-dim:#b0a5d2; --text-faint:#7a6fa3;
  --line:rgba(255,255,255,.12); --line-2:rgba(255,255,255,.06);
  /* ירוק שמור לעמוד הוואטסאפ. לא בשימוש בעמוד הבית. */
  --green-a:#1a5c40; --green-b:#0f3d2a;
  /* מידה */
  --u:8px; --wrap:1180px; --gutter:20px;
  --r:16px; --r-lg:22px; --r-xl:28px;
  --ease:cubic-bezier(.2,.7,.3,1);
  color-scheme:dark;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip}
body{
  font-family:'Heebo',Arial,sans-serif;color:var(--text);background:var(--ink);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;
  direction:rtl;
}
/* חשוב: אין overflow על body. overflow-x:hidden הופך אותו למיכל גלילה,
   וזה שובר כל position:sticky בתוכו. החיתוך האופקי נעשה על html. */

/* ============================================================
   רקע אחד רציף לכל הדף. קבוע במקומו, ולכן אין תפרים בין מקטעים.
   ============================================================ */
body::before{
  content:'';position:fixed;inset:-10%;z-index:-2;pointer-events:none;
  background:
    radial-gradient(1000px 760px at 80% -6%,  rgba(139,106,224,.30), transparent 62%),
    radial-gradient(820px 680px  at 4%  20%,  rgba(79,124,247,.15),  transparent 64%),
    radial-gradient(960px 820px  at 92% 48%,  rgba(61,42,143,.34),   transparent 60%),
    radial-gradient(880px 720px  at 8%  72%,  rgba(139,106,224,.20), transparent 64%),
    radial-gradient(900px 700px  at 70% 98%,  rgba(45,27,105,.42),   transparent 62%),
    linear-gradient(175deg,#0b0620 0%,#130c30 42%,#0f0927 72%,#0b0620 100%);
}
/* גרעיניות עדינה. מוציאה מהרקע את המראה הדיגיטלי השטוח. */
body::after{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.038;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.sec{padding-block:clamp(52px,7.2vw,92px);position:relative}

/* ============================================================
   טיפוגרפיה. כותרות ממורכזות, עד שתי שורות.
   ============================================================ */
h1,h2,h3{text-wrap:balance;text-align:center}
h1{font-size:clamp(34px,5.5vw,64px);font-weight:900;line-height:1.08;letter-spacing:-1.4px;
   max-width:none;margin-inline:auto}
/* שתי שורות קבועות. שורה שלא נכנסת ברוחב המסך מקטינה את הכותרת, ולא נשברת לשלוש.
   נקודת השבירה זזה במסך צר, כדי שהכותרת לא תקטן יותר מדי. */
/* שורות הכותרת הראשית. גרסה אחת בלבד, כדי שגוגל לא יקרא אותה פעמיים. */
h1 .ln{display:block;white-space:nowrap}
h2{font-size:clamp(25px,4.4vw,44px);font-weight:900;line-height:1.16;letter-spacing:-.7px;
   max-width:19ch;margin-inline:auto}
h3{font-size:clamp(21px,3vw,32px);font-weight:900;line-height:1.3;max-width:26ch;margin-inline:auto}
h4{font-size:19.5px;font-weight:700;line-height:1.38}

/* תת כותרת בכתב יד, שורה אחת */
.script{
  font-family:'Gveret Levin','Heebo',cursive;
  font-size:clamp(20px,3.3vw,31px);line-height:1.25;text-align:center;
  color:var(--gold);margin-top:calc(var(--u)*2);
  text-shadow:0 2px 18px rgba(232,194,90,.22);
  /* בלי nowrap: שורה ארוכה תישבר במקום להכתיב רוחב לפריסה ולשבור אותה */
  text-wrap:balance;max-width:min(100%,46ch);margin-inline:auto;
  overflow-wrap:anywhere;
}
/* מתחת ל-560 פיקסל מותר לשורת הכתב להישבר, כדי שלא תחרוג מהמסך */

.kicker{display:block;text-align:center;font-size:12.5px;font-weight:900;letter-spacing:2.4px;
        color:var(--purple);margin-bottom:calc(var(--u)*1.75)}
.note{font-size:13.5px;font-weight:500;color:var(--text-faint);text-align:center}
.gold{color:var(--gold)}
.head{margin-bottom:calc(var(--u)*6)}

/* ============================================================
   חשיפה ומושן
   ============================================================ */
.rv-on .rv{opacity:0;transform:translateY(26px);
  transition:opacity .75s var(--ease),transform .75s var(--ease)}
.rv-on .rv.on{opacity:1;transform:none}

/* כותרת נחשפת מאחורי מסכה */
.rv-on .rvh{overflow:hidden;opacity:1;transform:none}
.rv-on .rvh > .msk{display:block;transform:translateY(112%);
  transition:transform .95s cubic-bezier(.16,.84,.26,1)}
.rv-on .rvh.on > .msk{transform:none}

/* הברק בכותרת הראשית */
.sheen{
  background:linear-gradient(100deg,var(--gold) 0%,#fff4d4 34%,var(--gold) 58%,#eccf85 100%);
  background-size:260% 100%;-webkit-background-clip:text;background-clip:text;
  color:transparent;animation:sheen 8s ease-in-out infinite}
@keyframes sheen{0%,100%{background-position:0% 0}50%{background-position:100% 0}}

@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(232,194,90,.42)}70%{box-shadow:0 0 0 16px rgba(232,194,90,0)}100%{box-shadow:0 0 0 0 rgba(232,194,90,0)}}

/* ============================================================
   זכוכית. כל כרטיס שיושב עליו תוכן.
   ============================================================ */
.glass{
  position:relative;isolation:isolate;border-radius:var(--r-lg);
  background:linear-gradient(152deg,rgba(255,255,255,.085),rgba(255,255,255,.026));
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 18px 44px rgba(4,1,18,.40), inset 0 1px 0 rgba(255,255,255,.16);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s ease;
}
.glass::after{  /* ברק שעובר במעבר עכבר */
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;
  background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.11) 50%,transparent 62%);
  background-size:280% 100%;background-position:120% 0;opacity:0;
  transition:background-position .85s ease,opacity .35s ease;
}
.glass:hover{
  transform:translateY(-7px);border-color:rgba(139,106,224,.48);
  box-shadow:0 34px 70px rgba(4,1,18,.55), 0 0 0 1px rgba(139,106,224,.18),
             inset 0 1px 0 rgba(255,255,255,.22);
}
.glass:hover::after{background-position:-40% 0;opacity:1}

/* ---------- כפתורים ---------- */
.btn{display:inline-block;font-weight:700;font-size:15.5px;padding:15px 30px;
     border-radius:13px;cursor:pointer;border:0;font-family:inherit;position:relative;
     transition:transform .22s var(--ease),box-shadow .22s ease,filter .22s ease}
.btn:hover{transform:translateY(-3px)}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-lo));color:#3a2b06;
          box-shadow:0 12px 32px rgba(232,194,90,.26)}
.btn-gold:hover{box-shadow:0 18px 44px rgba(232,194,90,.38);filter:brightness(1.06)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.26);color:var(--text);background:rgba(255,255,255,.04);
           -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn-ghost:hover{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.08)}
.btn-dark{background:linear-gradient(135deg,#1a1040,#2d1b69);color:#fff;
          box-shadow:0 12px 30px rgba(26,16,64,.42)}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;padding-block:calc(var(--u)*15) calc(var(--u)*6);overflow:hidden}
.hero .in{position:relative;z-index:2;text-align:center}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:700;
         color:#d6cdf8;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
         padding:8px 18px;border-radius:999px;margin-bottom:calc(var(--u)*4);
         -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--gold);font-style:normal;
           animation:pulseRing 2.8s ease-out infinite}
.hero .btns{display:flex;flex-wrap:wrap;gap:13px;margin-top:calc(var(--u)*5);justify-content:center}
.hero .wave{width:100%;height:auto;margin-top:calc(var(--u)*8);opacity:.85}

/* ============================================================
   קרוסלות. ה-marq ב-LTR בכוונה: ב-RTL הרצועה נצמדת לקצה הימני,
   ואז translateX השלילי מוציא אותה מהמסך. אין כאן טקסט.
   ============================================================ */
.marq{direction:ltr;overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq .track{display:flex;width:max-content;align-items:center;will-change:transform;direction:ltr}
.marq.a .track{animation:mq-a var(--sp,48s) linear infinite}
.marq.b .track{animation:mq-b var(--sp,56s) linear infinite}
.marq:hover .track{animation-play-state:paused}
@keyframes mq-a{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mq-b{from{transform:translateX(-50%)}to{transform:translateX(0)}}

/* לוגואים */
.logos{padding-block:calc(var(--u)*7);position:relative}
.logos::before,.logos::after{content:'';position:absolute;inset-inline:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent)}
.logos::before{top:0}.logos::after{bottom:0}
.logos .cap{text-align:center;margin-bottom:calc(var(--u)*4)}
.logos .cap span{font-size:12.5px;font-weight:900;letter-spacing:2.2px;color:var(--text-faint)}
.logos .track{gap:calc(var(--u)*7);padding-block:calc(var(--u)*1.5)}
.logos img{height:34px;width:auto;opacity:.42;filter:grayscale(1);flex:0 0 auto;
           transition:opacity .3s ease,transform .3s var(--ease),filter .3s ease}
.logos .marq:hover img{opacity:.7}
.logos img:hover{opacity:1;filter:grayscale(0);transform:scale(1.12)}
@media(min-width:760px){.logos img{height:42px}}

/* ---------- מה שאתה כבר יודע ---------- */
.burn .grid{display:grid;gap:calc(var(--u)*2)}
@media(min-width:780px){.burn .grid{grid-template-columns:repeat(2,1fr)}}
.burn .item{padding:calc(var(--u)*3.25);display:flex;gap:calc(var(--u)*2);align-items:flex-start}
.burn .n{flex:0 0 auto;width:30px;height:30px;border-radius:10px;
         background:linear-gradient(140deg,rgba(139,106,224,.35),rgba(139,106,224,.12));
         color:#e2d8ff;font-weight:900;font-size:13px;display:grid;place-items:center;margin-top:2px;
         border:1px solid rgba(139,106,224,.3)}
.burn .item p{font-size:15.5px;color:var(--text-dim)}
.burn .close{margin-top:calc(var(--u)*6);font-weight:900;line-height:1.4;text-align:center;
             font-size:clamp(19px,3vw,28px);max-width:22ch;margin-inline:auto}

/* ---------- רצועת הציטוט ---------- */
.stand{padding-block:clamp(56px,8vw,104px);text-align:center;position:relative}
.stand blockquote{font-size:clamp(21px,3.4vw,38px);font-weight:900;line-height:1.3;
                  max-width:34ch;margin-inline:auto;letter-spacing:-.5px}
.stand .qm{display:block;font-size:64px;line-height:.5;color:var(--purple);opacity:.45;
           margin-bottom:calc(var(--u)*3);font-family:Georgia,serif}

/* ============================================================
   פסיפס הווידאו. מסונרי אסימטרי, משחק בין הגדלים.
   ============================================================ */
.mosaic{column-gap:calc(var(--u)*2);columns:2}
@media(min-width:640px){.mosaic{columns:3}}
@media(min-width:1000px){.mosaic{columns:4;column-gap:calc(var(--u)*2.5)}}
.tile{break-inside:avoid;margin-bottom:calc(var(--u)*2);border-radius:var(--r-lg);
      overflow:hidden;position:relative;
      transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s ease;
      border:1px solid rgba(255,255,255,.1);
      box-shadow:0 16px 38px rgba(4,1,18,.42)}
@media(min-width:1000px){.mosaic{column-gap:calc(var(--u)*2.5)}.tile{margin-bottom:calc(var(--u)*2.5)}}
.tile .in{display:block;animation:floatY 7s ease-in-out infinite}
.tile:nth-child(3n+1) .in{animation-duration:8.5s;animation-delay:-1.2s}
.tile:nth-child(3n+2) .in{animation-duration:7.4s;animation-delay:-3.1s}
.tile:nth-child(4n)   .in{animation-duration:9.2s;animation-delay:-2.4s}
.tile video,.tile img{width:100%;height:100%;object-fit:cover;display:block}
.tile .fr{display:block;width:100%}
.tile:hover{transform:translateY(-10px) scale(1.022);border-color:rgba(139,106,224,.55);
            box-shadow:0 34px 68px rgba(4,1,18,.6),0 0 0 1px rgba(139,106,224,.2);z-index:3}
.tile:hover .in{animation-play-state:paused}
.tile::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(to top,rgba(11,6,32,.5),transparent 44%);
  transition:opacity .4s ease}
.tile:hover::after{opacity:.4}

/* ---------- שירותים ---------- */
.svc .grid{display:grid;gap:calc(var(--u)*2.5)}
@media(min-width:700px){.svc .grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.svc .grid{grid-template-columns:repeat(3,1fr)}}
.card{padding:calc(var(--u)*4);text-align:center}
.card .ic{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;
          margin:0 auto calc(var(--u)*2.5);
          background:linear-gradient(145deg,rgba(139,106,224,.28),rgba(139,106,224,.07));
          border:1px solid rgba(139,106,224,.26);
          transition:transform .45s var(--ease),box-shadow .45s ease}
.card:hover .ic{transform:translateY(-3px) scale(1.08) rotate(-4deg);
                box-shadow:0 12px 28px rgba(139,106,224,.3)}
.card h4{margin-bottom:calc(var(--u)*1.25)}
.card p{color:var(--text-dim);font-size:14.5px}

/* ============================================================
   גרפיקות באלכסון
   ============================================================ */
.diag{position:relative;overflow:hidden;padding-block:clamp(56px,8vw,104px)}
.diag .head{position:relative;z-index:3}
.diag .rails{transform:rotate(-4.5deg);width:120%;margin-inline-start:-10%;
             display:grid;gap:calc(var(--u)*2.25)}
.gfx .track{gap:calc(var(--u)*2.25)}
/* גובה קטן יותר, לפי בקשת מאור */
.gfx .track img{height:132px;width:auto;border-radius:var(--r);flex:0 0 auto;object-fit:cover;
                border:1px solid rgba(255,255,255,.1);
                box-shadow:0 14px 34px rgba(4,1,18,.45);
                transition:transform .35s var(--ease),box-shadow .35s ease,border-color .35s ease}
.gfx .track img:hover{transform:scale(1.07) translateY(-5px);
                      box-shadow:0 26px 54px rgba(4,1,18,.62);border-color:rgba(139,106,224,.6)}
@media(min-width:760px){.gfx .track img{height:168px}}

/* ============================================================
   אתרים, גלילה במעבר עכבר
   ============================================================ */
.sites{display:grid;gap:calc(var(--u)*3.5)}
@media(min-width:740px){.sites{grid-template-columns:repeat(3,1fr)}}
.site{overflow:hidden}
.site .view{position:relative;aspect-ratio:4/5;overflow:hidden;background:#fff;
            border-radius:var(--r-lg) var(--r-lg) 0 0}
.site .view img{position:absolute;inset-inline:0;top:0;width:100%;height:auto;
                transition:transform 7s cubic-bezier(.32,.05,.35,1)}
.site:hover .view img{transform:translateY(calc(-100% + var(--vh,460px)))}
.site .bar{padding:calc(var(--u)*2.25) calc(var(--u)*3);display:flex;
           align-items:center;justify-content:space-between;gap:10px}
.site .bar b{font-size:14.5px;font-weight:900}
.site .bar span{font-size:12px;font-weight:900;letter-spacing:1px;color:var(--purple)}
.site .hint{position:absolute;bottom:12px;inset-inline-start:12px;z-index:3;
            background:rgba(11,6,32,.8);color:#d8cffa;font-size:12px;font-weight:700;
            padding:6px 12px;border-radius:999px;
            -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
            transition:opacity .3s ease}
.site:hover .hint{opacity:0}

/* ---------- ההצעה ---------- */
.offer .in{display:grid;gap:calc(var(--u)*5);align-items:center}
@media(min-width:920px){.offer .in{grid-template-columns:1.05fr .95fr}}
.offer .copy{text-align:center}
@media(min-width:920px){.offer .copy h2,.offer .copy .kicker,.offer .copy .script{text-align:center}}
.offer ul{list-style:none;margin-top:calc(var(--u)*4);display:grid;gap:calc(var(--u)*1.75);
          text-align:start;max-width:440px;margin-inline:auto}
.offer li{display:flex;gap:12px;font-size:15.5px;color:var(--text-dim)}
.offer li b{color:var(--gold);flex:0 0 auto}
.formcard{padding:calc(var(--u)*4.5)}
.formcard h4{text-align:center}
.formcard .hint{color:var(--text-faint);font-size:13.5px;margin-top:5px;text-align:center}
.field{margin-top:calc(var(--u)*2.25)}
.field label{display:block;font-size:12.5px;font-weight:700;color:#c9bff0;margin-bottom:7px}
.field input,.field select{width:100%;border:1px solid rgba(255,255,255,.16);border-radius:12px;
  padding:14px 15px;font-family:inherit;font-size:15px;color:var(--text);
  background:rgba(255,255,255,.05);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.field input::placeholder{color:#7d72a8}
.field select option{background:#180f38;color:var(--text)}
.field input:focus,.field select:focus{outline:none;border-color:var(--purple);
  background:rgba(255,255,255,.08);box-shadow:0 0 0 3px rgba(139,106,224,.2)}
.field input:user-invalid{border-color:#e07189;box-shadow:0 0 0 3px rgba(224,113,137,.15)}
.field .err{display:none;color:#f0a0b1;font-size:12.5px;margin-top:6px;font-weight:500}
.field input:user-invalid ~ .err{display:block}
/* מוצג גם כשהבדיקה שלנו פוסלת, ולא רק כשהדפדפן פוסל */
.field input[aria-invalid] ~ .err{display:block}
.formcard button{width:100%;margin-top:calc(var(--u)*3)}
.formcard .micro{text-align:center;color:var(--text-faint);font-size:12.5px;margin-top:13px}
.done{display:none;text-align:center;padding-block:calc(var(--u)*2)}
.done .tick{width:54px;height:54px;border-radius:50%;font-size:26px;display:grid;place-items:center;
            margin:0 auto calc(var(--u)*2);color:var(--gold);
            background:rgba(232,194,90,.14);border:1px solid rgba(232,194,90,.35)}
.done p{color:var(--text-dim);font-size:14.5px;margin-top:6px}
.formcard.sent form{display:none}
.formcard.sent .done{display:block}

/* ---------- אודות בקצרה ---------- */
.portrait{width:150px;height:150px;border-radius:50%;overflow:hidden;
          margin:0 auto calc(var(--u)*3.5);padding:5px}
.portrait img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.about .body{max-width:660px;margin-inline:auto;text-align:center}
.about p{color:var(--text-dim);font-size:16.5px;margin-top:calc(var(--u)*2.25)}
.about .sig{margin-top:calc(var(--u)*3.5);font-weight:900;font-size:15px}
.about .sig span{display:block;color:var(--text-faint);font-weight:400;font-size:14px;margin-top:4px}

/* ---------- שאלות ---------- */
.faq .list{max-width:820px;margin-inline:auto;overflow:hidden}
.faq details{border-top:1px solid var(--line-2)}
.faq details:first-child{border-top:0}
.faq summary{cursor:pointer;list-style:none;padding:calc(var(--u)*2.75) calc(var(--u)*3.5);
             font-weight:700;font-size:16px;display:flex;align-items:center;gap:14px;
             transition:background .25s ease}
.faq summary:hover{background:rgba(255,255,255,.04)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';margin-inline-start:auto;font-size:24px;font-weight:300;
                    color:var(--purple);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(135deg)}
.faq .a{padding:0 calc(var(--u)*3.5) calc(var(--u)*3.5);color:var(--text-dim);font-size:15.5px}

.rule{height:3px;background:linear-gradient(90deg,transparent,var(--blue),#7c5ce0,var(--blue),transparent)}

@media (prefers-reduced-motion:reduce){
  .rv-on .rv,.rv-on .rvh > .msk{opacity:1;transform:none;transition:none}
  .marq .track,.tile .in,.sheen,.eyebrow i{animation:none}
  .site .view img{transition:none}
  html{scroll-behavior:auto}
}

/* ============================================================
   עמודים פנימיים
   ============================================================ */
.phero{padding-block:clamp(56px,9vw,116px) clamp(30px,4vw,52px);text-align:center;position:relative}
.phero .lead{max-width:52ch;margin:calc(var(--u)*3) auto 0;color:var(--text-dim);font-size:17.5px}
.crumb{display:block;text-align:center;font-size:12px;font-weight:700;letter-spacing:1.6px;
       color:var(--text-faint);margin-bottom:calc(var(--u)*2)}
.crumb a{color:var(--purple)}

/* גוש עומק: כותרת, תיאור, וארבע שאלות עם תשובה */
.deep{padding:clamp(24px,3.4vw,38px);margin-bottom:calc(var(--u)*3.5)}
.deep > .top{display:flex;align-items:flex-start;gap:calc(var(--u)*2.25);margin-bottom:calc(var(--u)*2.5)}
.deep .ic{flex:0 0 auto;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
          background:linear-gradient(140deg,rgba(139,106,224,.30),rgba(79,124,247,.16));
          border:1px solid rgba(139,106,224,.34)}
.deep .ic svg{width:23px;height:23px;stroke:var(--purple);fill:none;stroke-width:1.75;
              stroke-linecap:round;stroke-linejoin:round}
.deep h3{text-align:start;max-width:none;margin:0 0 4px}
.deep .sub{color:var(--text-faint);font-size:14px;font-weight:700}
.deep .qa{display:grid;gap:calc(var(--u)*2);grid-template-columns:1fr}
@media(min-width:800px){.deep .qa{grid-template-columns:1fr 1fr}}
.deep .qa > div{background:rgba(255,255,255,.035);border:1px solid var(--line-2);
                border-radius:14px;padding:calc(var(--u)*2.25)}
.deep .qa b{display:block;font-size:12.5px;font-weight:900;letter-spacing:1.4px;
            color:var(--purple);margin-bottom:6px}
.deep .qa p{color:var(--text-dim);font-size:15.5px;line-height:1.7}
.deep ul{list-style:none;margin-top:calc(var(--u)*2);display:flex;flex-wrap:wrap;gap:8px}
.deep ul li{font-size:13px;font-weight:700;color:var(--text-dim);background:rgba(255,255,255,.05);
            border:1px solid var(--line-2);border-radius:999px;padding:6px 13px}

/* מסלולים */
.plans{display:grid;gap:calc(var(--u)*2.5);grid-template-columns:1fr}
@media(min-width:900px){.plans{grid-template-columns:repeat(3,1fr);align-items:start}}
.plan{padding:calc(var(--u)*3.25);display:flex;flex-direction:column;height:100%}
.plan.best{border-color:rgba(232,194,90,.42)}
.plan .tag{display:inline-block;align-self:flex-start;font-size:11px;font-weight:900;letter-spacing:1.6px;
           padding:5px 11px;border-radius:999px;margin-bottom:calc(var(--u)*2);
           background:rgba(139,106,224,.18);color:var(--purple);border:1px solid rgba(139,106,224,.3)}
.plan.best .tag{background:linear-gradient(135deg,var(--gold),var(--gold-lo));color:#3a2b06;border-color:transparent}
.plan h3{text-align:start;max-width:none;margin-bottom:6px}
.plan .for{color:var(--text-faint);font-size:14px;font-weight:700;margin-bottom:calc(var(--u)*2.5)}
.plan ul{list-style:none;margin:0 0 calc(var(--u)*3);display:grid;gap:10px}
.plan li{display:flex;gap:9px;align-items:flex-start;font-size:15px;color:var(--text-dim)}
.plan li b{color:var(--gold);flex:0 0 auto;font-weight:900}
.plan .go{margin-top:auto}

/* שלבים ממוספרים */
.steps{display:grid;gap:calc(var(--u)*2);counter-reset:s;grid-template-columns:1fr}
@media(min-width:700px){.steps{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
.steps .st{padding:calc(var(--u)*3);position:relative}
.steps .st .n{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-weight:900;
   font-size:15px;color:#fff;background:linear-gradient(135deg,var(--deep),var(--purple-lo));
   margin-bottom:calc(var(--u)*2)}
.steps .st h4{margin-bottom:6px}
.steps .st p{color:var(--text-dim);font-size:15px}

/* טקסט ארוך */
.prose{max-width:66ch;margin-inline:auto}
.prose p{color:var(--text-dim);font-size:17px;line-height:1.85;margin-top:calc(var(--u)*2.5)}
.prose h3{text-align:start;max-width:none;margin-top:calc(var(--u)*5)}
.prose blockquote{font-size:clamp(19px,2.6vw,27px);font-weight:900;line-height:1.42;color:var(--text);
  border-inline-start:3px solid var(--gold);padding-inline-start:calc(var(--u)*2.5);
  margin:calc(var(--u)*4) 0;text-align:start}
.prose ul{margin-top:calc(var(--u)*2.5);padding-inline-start:calc(var(--u)*2.5);color:var(--text-dim)}
.prose li{margin-top:10px;font-size:16.5px;line-height:1.75}

/* גלריות תיק עבודות */
.gallery{display:grid;gap:calc(var(--u)*2);grid-template-columns:repeat(2,1fr)}
@media(min-width:680px){.gallery{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1000px){.gallery{grid-template-columns:repeat(4,1fr)}}
.gallery figure{border-radius:var(--r);overflow:hidden;background:rgba(255,255,255,.04);
  border:1px solid var(--line-2);transition:transform .45s var(--ease),border-color .45s ease,box-shadow .45s var(--ease)}
.gallery figure:hover{transform:translateY(-8px) scale(1.02);border-color:rgba(139,106,224,.45);
  box-shadow:0 26px 54px rgba(4,1,18,.5)}
.gallery img{width:100%;height:auto;display:block}
.logogrid{display:grid;gap:calc(var(--u)*1.75);grid-template-columns:repeat(3,1fr)}
@media(min-width:680px){.logogrid{grid-template-columns:repeat(5,1fr)}}
@media(min-width:1000px){.logogrid{grid-template-columns:repeat(7,1fr)}}
.logogrid div{height:74px;display:grid;place-items:center;padding:12px;border-radius:14px;
  background:rgba(255,255,255,.04);border:1px solid var(--line-2);transition:background .35s ease,border-color .35s ease}
.logogrid div:hover{background:rgba(255,255,255,.08);border-color:rgba(139,106,224,.4)}
.logogrid img{max-height:40px;width:auto;opacity:.9}

/* מאמרים */
.artlist{display:grid;gap:calc(var(--u)*2.5);grid-template-columns:1fr}
@media(min-width:800px){.artlist{grid-template-columns:repeat(3,1fr)}}
.art{padding:calc(var(--u)*3);display:flex;flex-direction:column}
.art .meta{font-size:12px;font-weight:900;letter-spacing:1.4px;color:var(--purple);margin-bottom:calc(var(--u)*1.5)}
.art h3{text-align:start;max-width:none;font-size:23px;margin-bottom:10px}
.art p{color:var(--text-dim);font-size:15px;flex:1}
.art .more{margin-top:calc(var(--u)*2.5);font-weight:900;font-size:14.5px;color:var(--gold)}

/* יצירת קשר */
.cgrid{display:grid;gap:calc(var(--u)*3);grid-template-columns:1fr;align-items:start}
@media(min-width:920px){.cgrid{grid-template-columns:1.05fr .95fr}}
.cway{padding:calc(var(--u)*3);display:block;margin-bottom:calc(var(--u)*2)}
.cway .lbl{font-size:12px;font-weight:900;letter-spacing:1.6px;color:var(--purple);margin-bottom:6px}
.cway .val{font-size:19px;font-weight:900;direction:ltr;text-align:right}
.cway .un{font-size:13.5px;color:var(--text-faint);margin-top:6px}

/* הערה כנה */
.frank{max-width:70ch;margin-inline:auto;padding:calc(var(--u)*3);border-radius:var(--r);
  background:rgba(255,255,255,.035);border:1px dashed rgba(255,255,255,.18);text-align:center}
.frank p{color:var(--text-dim);font-size:15.5px;line-height:1.75}
.frank b{color:var(--text)}
@media(min-width:900px){.plan.best{transform:translateY(-14px)}
  .plan.best:hover{transform:translateY(-21px)}}

/* ============================================================
   עמוד השער של תחומי הפעילות. שישה שערי כניסה.
   ============================================================ */
.hubgrid{display:grid;gap:calc(var(--u)*2.5);grid-template-columns:1fr}
@media(min-width:720px){.hubgrid{grid-template-columns:1fr 1fr}}
@media(min-width:1080px){.hubgrid{grid-template-columns:repeat(3,1fr)}}
.hub{display:flex;flex-direction:column;overflow:hidden;position:relative;isolation:isolate}
.hub .pic{position:relative;aspect-ratio:16/10;overflow:hidden;
  background:linear-gradient(145deg,rgba(139,106,224,.34),rgba(79,124,247,.12) 55%,rgba(13,8,34,.6))}
.hub .pic img{width:100%;height:100%;object-fit:cover;object-position:center center;
  display:block;transition:transform .8s var(--ease)}
.hub:hover .pic img{transform:scale(1.06)}
.hub .pic::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(11,6,32,.55),transparent 34%)}
.hub .pic .ico{position:absolute;inset-inline-start:18px;inset-block-end:16px;z-index:2;
  width:48px;height:48px;border-radius:15px;display:grid;place-items:center;
  background:rgba(13,8,34,.62);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hub .pic .ico svg{width:24px;height:24px;stroke:var(--gold);fill:none;stroke-width:1.75;
  stroke-linecap:round;stroke-linejoin:round}
.hub .bd{padding:calc(var(--u)*3);display:flex;flex-direction:column;flex:1}
.hub h3{text-align:start;max-width:none;font-size:24px;margin-bottom:8px}
.hub p{color:var(--text-dim);font-size:15px;flex:1}
.hub .chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:calc(var(--u)*2.25)}
.hub .chips span{font-size:12px;font-weight:700;color:var(--text-faint);
  background:rgba(255,255,255,.05);border:1px solid var(--line-2);border-radius:999px;padding:5px 11px}
.hub .go{margin-top:calc(var(--u)*2.5);font-weight:900;font-size:14.5px;color:var(--gold)}
.hub .go::after{content:'';display:inline-block;width:14px;height:1.5px;background:var(--gold);
  vertical-align:middle;margin-inline-start:8px;transition:width .35s var(--ease)}
.hub:hover .go::after{width:26px}

/* ============================================================
   מערכות. עובד עם קובץ לוגו ובלעדיו.
   ============================================================ */
.syslist{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.sys{display:inline-flex;align-items:center;gap:9px;padding:9px 15px;border-radius:12px;
  background:rgba(255,255,255,.05);border:1px solid var(--line-2);
  font-size:13.5px;font-weight:700;color:var(--text-dim);
  transition:background .3s ease,border-color .3s ease,transform .3s var(--ease)}
.sys:hover{background:rgba(255,255,255,.09);border-color:rgba(139,106,224,.42);transform:translateY(-3px)}
/* הלוגואים מגיעים ככיתוב כהה על רקע שקוף, ולכן הם יושבים על לוחית לבנה.
   בלעדיה הם נבלעים ברקע הכהה ונראים כאילו לא נטענו. */
.sys img{height:26px;width:auto;max-width:160px;object-fit:contain;display:block;flex:0 0 auto;
  background:#fff;border-radius:8px;padding:6px 9px}
.sys em{font-style:normal;font-size:12.5px;color:var(--text-faint);font-weight:500}
.sys--logo{padding:7px 13px 7px 9px}
/* טקסט לקוראי מסך בלבד */
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ============================================================
   השוואה בשתי עמודות
   ============================================================ */
.vs{display:grid;gap:calc(var(--u)*2.5);grid-template-columns:1fr}
@media(min-width:820px){.vs{grid-template-columns:1fr 1fr}}
.vs .col{padding:calc(var(--u)*3)}
.vs .col h4{font-size:15px;letter-spacing:.4px;margin-bottom:calc(var(--u)*2.5);
  padding-bottom:calc(var(--u)*1.5);border-bottom:1px solid var(--line-2)}
.vs .col.a h4{color:var(--text-faint)}
.vs .col.b h4{color:var(--gold)}
.vs ul{list-style:none;display:grid;gap:13px}
.vs li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.7;color:var(--text-dim)}
.vs li i{flex:0 0 auto;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;
  font-style:normal;font-size:11px;font-weight:900;margin-top:4px}
.vs .col.a li i{background:rgba(255,255,255,.07);color:var(--text-faint)}
.vs .col.b li i{background:rgba(232,194,90,.16);color:var(--gold)}
.vs .col.b li{color:var(--text)}

/* ============================================================
   דוגמה מהשטח, וטבלת נתונים קטנה
   ============================================================ */
.example{padding:calc(var(--u)*3.5);max-width:74ch;margin-inline:auto}
.example .lbl{font-size:11.5px;font-weight:900;letter-spacing:2px;color:var(--purple);
  margin-bottom:calc(var(--u)*2)}
.example p{color:var(--text-dim);font-size:16px;line-height:1.8;margin-top:calc(var(--u)*2)}
.example p:first-of-type{margin-top:0}
.example b{color:var(--text)}
.dtable{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:calc(var(--u)*3)}
.dtable th,.dtable td{padding:11px 14px;text-align:start;border-bottom:1px solid var(--line-2)}
.dtable th{font-size:12px;font-weight:900;letter-spacing:1.2px;color:var(--purple)}
.dtable td{color:var(--text-dim)}
.dtable td:first-child{color:var(--text);font-weight:700}
.srcline{font-size:12.5px;color:var(--text-faint);margin-top:calc(var(--u)*2);line-height:1.7}
.srcline a{color:var(--purple-lo);text-decoration:underline}
.svc .card{display:flex;flex-direction:column}
.svc .card p{flex:1}
.svc .card .more::after{content:'';display:inline-block;width:14px;height:1.5px;background:var(--gold);
  vertical-align:middle;margin-inline-start:8px;transition:width .35s var(--ease)}
.svc .card:hover .more::after{width:26px}

/* ============================================================
   רייל הצד. מחליף את התפריט העליון.
   ============================================================ */
:root{--rail:84px}
@media(max-width:899px){:root{--rail:0px}}
body{padding-inline-start:var(--rail)}

.rail{position:fixed;inset-block:0;inset-inline-start:0;width:var(--rail);z-index:60;
  display:none;flex-direction:column;align-items:center;justify-content:space-between;
  padding:14px 8px 16px;background:rgba(17,11,42,.82);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  border-inline-end:1px solid var(--line-2)}
@media(min-width:900px){.rail{display:flex}}
.rail__logo img{width:42px;height:auto;background:#fff;border-radius:11px;padding:6px;
  transition:transform .35s var(--ease)}
.rail__logo:hover img{transform:scale(1.07)}
.rail__nav{flex:1;display:flex;align-items:center;min-height:0}
.rail__nav ul{list-style:none;display:flex;flex-direction:column;gap:clamp(10px,2.2vh,24px);
  width:100%;max-height:100%;overflow:visible}
.rail__item{position:relative;transition:opacity .3s ease}
.rail__nav:hover .rail__item{opacity:.45}
.rail__nav .rail__item:hover{opacity:1}
.rail__item > a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:6px 2px;
  border-radius:12px;transition:background .3s ease}
.rail__item:hover > a{background:rgba(255,255,255,.06)}
.rail__ic{width:21px;height:21px;display:block;background-color:rgba(255,255,255,.62);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  transition:background-color .3s ease,transform .3s var(--ease)}
.rail__item:hover .rail__ic{transform:translateY(-2px)}
.rail__lb{font-size:10.5px;font-weight:700;line-height:1.28;text-align:center;
  color:var(--text-faint);transition:color .3s ease}
.rail__item:hover .rail__ic,.rail__item.is-active .rail__ic{background-color:var(--gold)}
.rail__item:hover .rail__lb,.rail__item.is-active .rail__lb{color:var(--text)}
.rail__item.is-active > a{background:rgba(232,194,90,.10)}

/* תפריט משנה שנפתח מהצד */
.rail__fly{position:absolute;inset-block-start:50%;inset-inline-start:100%;translate:0 -50%;
  padding-inline-start:10px;opacity:0;pointer-events:none;
  transition:opacity .28s ease,translate .28s var(--ease)}
.rail__item:hover .rail__fly,.rail__item:focus-within .rail__fly{opacity:1;pointer-events:auto}
.rail__flyin{display:block;min-width:212px;padding:9px;border-radius:16px;
  background:rgba(22,14,54,.96);border:1px solid rgba(255,255,255,.13);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  box-shadow:0 22px 52px rgba(4,1,18,.6)}
.rail__flyin a{display:block;padding:9px 13px;border-radius:10px;font-size:14px;
  font-weight:500;color:var(--text-dim);white-space:nowrap;transition:background .2s ease,color .2s ease}
.rail__flyin a:hover{background:rgba(255,255,255,.07);color:var(--text)}
.rail__flyin a.on{color:var(--gold)}
.rail__wa{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(140deg,#26d366,#12a150);color:#04250f;flex:0 0 auto;
  box-shadow:0 10px 24px rgba(38,211,102,.28);transition:transform .3s var(--ease)}
.rail__wa:hover{transform:scale(1.08)}
.rail__wa svg{width:22px;height:22px}

/* פס עליון במובייל */
/* הפס העליון בנייד. fixed ולא sticky, כי sticky יחד עם טשטוש רקע
   נשבר בספארי באייפון והפס נעלם בגלילה. הגובה קבוע ב---mbh,
   וה-body מקבל ריפוד בדיוק בגודל הזה כדי שהתוכן לא ייחתך. */
:root{--mbh:63px}
.mbar{position:fixed;top:0;inset-inline:0;z-index:60;display:flex;align-items:center;gap:12px;
  padding:10px var(--gutter);background:rgba(11,6,32,.94);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line-2)}
@media(max-width:899px){body{padding-top:var(--mbh)}}
@media(min-width:900px){.mbar{display:none}}
.mbar__logo img{height:34px;width:auto;background:#fff;border-radius:9px;padding:5px 8px}
.mbar__cta{margin-inline-start:auto;font-size:13.5px;font-weight:900;padding:9px 16px;
  border-radius:11px;background:linear-gradient(135deg,var(--gold),var(--gold-lo));color:#3a2b06}
.burger{width:42px;height:42px;border:1px solid var(--line);background:rgba(255,255,255,.05);
  border-radius:12px;display:grid;place-items:center;cursor:pointer;flex:0 0 auto}
.burger span{display:block;width:18px;height:2px;background:var(--text);position:relative;
  transition:background .2s ease}
.burger span::before,.burger span::after{content:'';position:absolute;inset-inline:0;height:2px;
  background:var(--text);transition:transform .3s var(--ease)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.mobmenu{position:fixed;top:var(--mbh);inset-inline:0;z-index:59;
  background:rgba(18,11,44,.99);border-bottom:1px solid var(--line-2);
  max-height:calc(100vh - var(--mbh));max-height:calc(100dvh - var(--mbh));
  overflow-y:auto;-webkit-overflow-scrolling:touch}
.mobmenu a{display:block;padding:14px var(--gutter);border-bottom:1px solid var(--line-2);
  font-weight:700}
.mobmenu a.sub{padding-inline-start:calc(var(--gutter) + 22px);font-weight:400;font-size:14.5px;
  color:var(--text-dim)}
.mobmenu a.on{color:var(--gold)}
/* שורת קטגוריה: השם מוביל לעמוד, החץ פותח את תת התפריט */
.mobmenu .mob__row{display:flex;align-items:stretch;border-bottom:1px solid var(--line-2)}
.mobmenu .mob__row > a{flex:1 1 auto;border-bottom:0}
.mob__tg{flex:0 0 58px;background:none;border:0;border-inline-start:1px solid var(--line-2);
  color:var(--text-dim);display:grid;place-items:center;cursor:pointer;padding:0}
.mob__tg svg{width:18px;height:18px;transition:transform .22s var(--ease)}
.mob__tg[aria-expanded="true"]{color:var(--gold)}
.mob__tg[aria-expanded="true"] svg{transform:rotate(180deg)}
.mob__tg:focus-visible{outline:2px solid var(--gold);outline-offset:-3px}
.mob__grp[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.mob__tg svg{transition:none}}

/* ============================================================
   פוטר ועץ האתר
   ============================================================ */
.foot{padding-block:calc(var(--u)*8) calc(var(--u)*4);position:relative;
  border-top:1px solid var(--line-2);background:rgba(8,4,24,.5)}
.foot__top{display:grid;gap:calc(var(--u)*5)}
@media(min-width:900px){.foot__top{grid-template-columns:minmax(260px,1fr) 1.5fr;gap:calc(var(--u)*7)}}
.foot__id img{height:46px;width:auto;background:#fff;border-radius:12px;padding:9px 14px}
.foot__line{color:var(--text-dim);font-size:15px;margin-top:calc(var(--u)*2);max-width:34ch}
.foot .det{color:var(--text-dim);font-size:14.5px;margin-top:calc(var(--u)*2);line-height:2}
.foot .det a:hover{color:var(--gold)}
.foot__id .btn{margin-top:calc(var(--u)*3)}
.map__ttl{display:block;font-size:11.5px;font-weight:900;letter-spacing:2.2px;
  color:var(--text-faint);margin-bottom:calc(var(--u)*3)}
.map__cols{display:grid;gap:calc(var(--u)*4);grid-template-columns:1fr}
@media(min-width:560px){.map__cols{grid-template-columns:repeat(3,1fr)}}
.map__col h4{font-size:14px;color:var(--text);margin-bottom:calc(var(--u)*1.75)}
.map__col a{display:block;font-size:14px;color:var(--text-faint);padding-block:5px;
  transition:color .2s ease}
.map__col a:hover{color:var(--gold)}
.map__col a.on{color:var(--purple)}
.foot .legal{border-top:1px solid var(--line-2);margin-top:calc(var(--u)*5);
  padding-top:calc(var(--u)*2.5);color:var(--text-faint);font-size:12.5px;
  display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center}

/* ============================================================
   מוטיב שמונה הזרועות. נגזר מהתמנון כמבנה ולא כאיור:
   שמונה קשתות שמתכנסות למרכז אחד, לא זרועות שמקיפות.
   שכבה אחת, קבועה במקומה, מתחת לכל התוכן.
   ============================================================ */
.arms{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict;
  display:grid;place-items:center;opacity:.38}
.arms svg{width:min(190vh,190vw);height:auto;overflow:visible}
.arms path{fill:none;stroke:url(#armg);stroke-width:1;stroke-linecap:round;
  opacity:.5;transform-origin:50% 50%}
.arms .core{fill:url(#coreg);stroke:none;opacity:.5}
@keyframes armDrift{0%,100%{transform:rotate(0deg) scale(1)}
                    50%{transform:rotate(6deg) scale(1.045)}}
.arms .spin{animation:armDrift 64s ease-in-out infinite;transform-origin:50% 50%}
@keyframes corePulse{0%,100%{opacity:.35}50%{opacity:.62}}
.arms .core{animation:corePulse 11s ease-in-out infinite}

/* שלוש הילות איטיות, נעות במסלול ארוך */
.orbs{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict;
  filter:blur(70px);opacity:.26}
.orbs i{position:absolute;display:block;border-radius:50%;will-change:transform}
.orbs i:nth-child(1){width:46vw;height:46vw;inset-block-start:-8%;inset-inline-end:-6%;
  background:radial-gradient(circle,rgba(139,106,224,.5),transparent 68%);
  animation:orbA 74s ease-in-out infinite}
.orbs i:nth-child(2){width:38vw;height:38vw;inset-block-start:44%;inset-inline-start:-10%;
  background:radial-gradient(circle,rgba(79,124,247,.34),transparent 68%);
  animation:orbB 92s ease-in-out infinite}
.orbs i:nth-child(3){width:34vw;height:34vw;inset-block-end:-10%;inset-inline-end:18%;
  background:radial-gradient(circle,rgba(61,42,143,.55),transparent 68%);
  animation:orbC 83s ease-in-out infinite}
@keyframes orbA{0%,100%{transform:translate3d(0,0,0)}33%{transform:translate3d(-7vw,6vh,0)}
                66%{transform:translate3d(4vw,-4vh,0)}}
@keyframes orbB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(8vw,-7vh,0)}}
@keyframes orbC{0%,100%{transform:translate3d(0,0,0)}40%{transform:translate3d(-5vw,-6vh,0)}
                75%{transform:translate3d(6vw,3vh,0)}}

/* ============================================================
   טבעת שנמשכת מאחורי ההירו
   ============================================================ */
@property --sweep{syntax:'<angle>';inherits:false;initial-value:0deg}
.hring{position:absolute;top:50%;left:auto;right:-9%;
  translate:0 -50%;width:min(76vw,760px);aspect-ratio:1;z-index:0;pointer-events:none;
  border-radius:50%;border:1.5px solid rgba(139,106,224,.70);
  box-shadow:0 0 70px rgba(139,106,224,.12) inset;
  -webkit-mask-image:conic-gradient(from 210deg,#000 var(--sweep),transparent 0);
          mask-image:conic-gradient(from 210deg,#000 var(--sweep),transparent 0);
  animation:ringDraw 1.9s cubic-bezier(.65,0,.35,1) .35s both}
.hring::after{content:'';position:absolute;inset:11%;border-radius:50%;
  border:1px solid rgba(232,194,90,.24)}
@keyframes ringDraw{from{--sweep:0deg}to{--sweep:360deg}}

/* ============================================================
   מילוי נוזלי מנקודת העכבר
   ============================================================ */
.liq{position:relative;isolation:isolate;overflow:hidden}
.liq::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:var(--liq,linear-gradient(140deg,rgba(139,106,224,.30),rgba(79,124,247,.16)));
  clip-path:circle(0 at var(--x,50%) var(--y,50%));
  transition:clip-path 1.15s cubic-bezier(.22,1,.36,1)}
.liq:hover::before{clip-path:circle(160% at var(--x,50%) var(--y,50%))}
.btn.liq::before{--liq:linear-gradient(135deg,#f6dd96,#e8c25a)}
.btn-ghost.liq:hover{color:#2a2008;border-color:transparent}

/* הילה רכה שעוקבת בתוך כרטיס זכוכית */
.glow{position:relative}
.glow::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  z-index:1;opacity:0;transition:opacity .4s ease;
  background:radial-gradient(240px circle at var(--x,50%) var(--y,50%),
             rgba(232,194,90,.13),transparent 62%)}
.glow:hover::before{opacity:1}

/* ============================================================
   טבעת הווידאו. גאומטריה: רדיוס = רוחב כרטיס חלקי 2*tan(pi/n)
   ============================================================ */
/* --gap שולט בצפיפות, --arc בקימור. ככל ש-arc גדול יותר, הקשת רחבה יותר. */
.vring{overflow-x:clip}
.vring{--cw:17vw;--gap:0.4vw;--arc:1.18;
  --ch:calc(var(--cw)*16/9);--rr:calc((var(--cw) + var(--gap))*2.56*var(--arc));
  --cw-px:0;--gap-px:0;--rr-px:0;
  position:relative;margin-top:calc(var(--u)*2)}
@media(max-width:899px){.vring{--cw:38vw;--arc:1.05}}
@media(max-width:559px){.vring{--cw:54vw;--arc:.95}}
.vring__stage{perspective:1300px;perspective-origin:50% 50%;
  height:calc(var(--ch) + 4vw);position:relative;display:flex;
  align-items:center;justify-content:center;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.vring__spin{position:absolute;inset-block-start:50%;inset-inline-start:50%;
  width:0;height:0;transform-style:preserve-3d;will-change:transform;
  transform:translateZ(calc(var(--rr) * -1));
  transition:transform 1.05s cubic-bezier(.33,1,.45,1)}
.vring__card{position:absolute;inset-block-start:calc(var(--ch)/-2);
  inset-inline-start:calc(var(--cw)/-2);width:var(--cw);height:var(--ch);
  border-radius:clamp(14px,1.5vw,22px);overflow:hidden;backface-visibility:hidden;
  border:1px solid rgba(255,255,255,.14);box-shadow:0 2vw 4vw rgba(4,1,18,.55);
  transition:opacity .5s ease,filter .5s ease}
.vring__card video,.vring__card img{width:100%;height:100%;object-fit:cover;display:block}
.vring__hit{position:absolute;inset:0;z-index:3;cursor:grab;touch-action:pan-y}
.vring__hit:active{cursor:grabbing}
.vring__nav{display:flex;gap:14px;justify-content:center;margin-top:calc(var(--u)*3)}
.vring__nav button{width:48px;height:48px;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--text);
  display:grid;place-items:center;transition:background .25s ease,transform .25s var(--ease),
  border-color .25s ease}
.vring__nav button:hover{background:rgba(255,255,255,.12);transform:translateY(-3px);
  border-color:rgba(139,106,224,.5)}
.vring__nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.vring__dots{margin-top:calc(var(--u)*3);display:flex;gap:7px;justify-content:center;margin-top:calc(var(--u)*2)}
.vring__dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.2);
  transition:background .3s ease,width .3s var(--ease)}
.vring__dots i.on{width:20px;border-radius:99px;background:var(--gold)}

/* ============================================================
   ציר השלבים על רקע כוכבים
   ============================================================ */
.space{position:relative;padding-block:clamp(60px,8vw,110px);overflow:hidden}
.space__stars{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.space::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(var(--ink) 0%,transparent 13%),
             linear-gradient(0deg,var(--ink) 0%,transparent 13%)}
.space > .wrap{position:relative;z-index:2}
.path{position:relative;margin-top:calc(var(--u)*6);padding-block:calc(var(--u)*2)}
.path::before{content:'';position:absolute;inset-block:0;inset-inline-start:50%;width:1px;
  translate:-50% 0;background:rgba(255,255,255,.12)}
.path__draw{position:absolute;inset-block-start:0;inset-inline-start:50%;width:1.5px;
  height:100%;translate:-50% 0;transform:scaleY(var(--draw,0));transform-origin:top;
  background:linear-gradient(var(--purple),var(--gold));border-radius:2px}
.path__halo{position:absolute;inset-block-start:50%;inset-inline-start:50%;
  width:min(62vw,620px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;
  border:1px solid rgba(255,255,255,.055);pointer-events:none}
.step{position:relative;display:grid;gap:calc(var(--u)*2);padding-block:calc(var(--u)*4.5)}
@media(min-width:820px){
  .step{grid-template-columns:1fr 84px 1fr;align-items:center;gap:0}
  .step .side{grid-column:1}
  .step:nth-child(even) .side{grid-column:3;text-align:start}
  .step:nth-child(odd) .side{text-align:end}
  .step .dot{grid-column:2;justify-self:center}
}
.step .dot{position:relative;z-index:2;width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;font-weight:900;font-size:15px;color:var(--text-faint);
  background:var(--ink-2);border:1px solid rgba(255,255,255,.16);
  transition:color .6s ease,border-color .6s ease,transform .6s var(--ease),box-shadow .6s ease}
.step.on .dot{color:#2a2008;border-color:transparent;transform:scale(1.14);
  background:linear-gradient(140deg,var(--gold),var(--gold-lo));
  box-shadow:0 0 0 5px rgba(232,194,90,.10),0 0 24px rgba(232,194,90,.42)}
.step .k{display:block;font-size:11.5px;font-weight:900;letter-spacing:2px;
  color:var(--purple);margin-bottom:8px}
.step h3{text-align:inherit;max-width:none;font-size:clamp(22px,3vw,32px);margin-bottom:9px}
.step p{color:var(--text-dim);font-size:15.5px;line-height:1.75;max-width:42ch}
@media(min-width:820px){.step:nth-child(odd) p{margin-inline-start:auto}}
@media(max-width:819px){
  .path::before,.path__draw{inset-inline-start:26px}
  .step{grid-template-columns:52px 1fr;column-gap:calc(var(--u)*2.5);align-items:start}
  .step .dot{grid-column:1}.step .side{grid-column:2;text-align:start}
  .step h3,.step p{text-align:start}
}

/* ============================================================
   טופס מהיר. שם, טלפון, שליחה. בראש ובתחתית כל עמוד.
   ============================================================ */
.qform{position:relative;overflow:hidden;padding:clamp(22px,3vw,34px);border-radius:var(--r-xl)}
.qform .in{display:grid;gap:calc(var(--u)*2.5);align-items:center}
@media(min-width:900px){.qform .in{grid-template-columns:minmax(230px,.85fr) auto;gap:calc(var(--u)*4)}}
.qform h3{text-align:start;max-width:none;font-size:clamp(21px,2.8vw,29px);margin-bottom:6px}
.qform p{color:var(--text-dim);font-size:14.5px}
.qform form{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:560px){.qform form{grid-template-columns:1fr 1fr}}
@media(min-width:1180px){.qform form{grid-template-columns:1fr 1fr 1fr auto}}
.qform input{width:100%;padding:13px 16px;border-radius:12px;font-family:inherit;font-size:15px;
  color:var(--text);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);
  transition:border-color .25s ease,background .25s ease}
.qform input::placeholder{color:var(--text-faint)}
.qform input:focus{outline:none;border-color:var(--purple);background:rgba(255,255,255,.1);
  box-shadow:0 0 0 4px rgba(139,106,224,.14)}
.qform input:user-invalid{border-color:#e07a7a}
.qform button{white-space:nowrap;padding:13px 26px;border-radius:12px;border:0;cursor:pointer;
  font-family:inherit;font-weight:900;font-size:15px;color:#3a2b06;
  background:linear-gradient(135deg,var(--gold),var(--gold-lo));
  transition:transform .22s var(--ease),box-shadow .22s ease}
.qform button:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(232,194,90,.3)}
.qform .ok{display:none;font-weight:900;color:var(--gold);font-size:16px}
.qform.sent form{display:none}
.qform.sent .ok{display:block}
.qform .micro{font-size:12px;color:var(--text-faint);margin-top:10px}
/* הודעת שגיאה בטופס. קודם הייתה רק מסגרת אדומה בלי הסבר,
   והגולש לא ידע מה לתקן ופשוט עזב. */
.qform .ferr,.lead .ferr{grid-column:1/-1;margin-top:2px;font-size:13.5px;
  font-weight:700;color:#f0a0a0}
.qform input[aria-invalid],.lead input[aria-invalid]{border-color:#e07a7a}
.qform .agree input[aria-invalid]::before{outline:2px solid #e07a7a;outline-offset:2px}
.qtop{margin-block:calc(var(--u)*4) 0}
.qbottom{margin-block:calc(var(--u)*2)}

/* ============================================================
   אישור תנאים. חובה בכל טופס שאוסף פרטים
   ============================================================ */
.agree{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  margin-top:calc(var(--u)*2);text-align:start}
.qform .agree{grid-column:1/-1;margin-top:2px}
@media(min-width:1180px){
  .qform .agree{grid-column:1/4;align-self:center;margin-top:0}
  .qform form>button{grid-column:4;grid-row:2}
}
.formcard .agree{margin-top:calc(var(--u)*2.5)}
/* תיבת ההסכמה לדיוור יושבת מתחת לאישור התנאים, עם נשימה ביניהן.
   בלי הרווח הזה שתי השורות נקראות כמשפט אחד, והגולש לא קולט שהשנייה
   היא בחירה שלו ולא תנאי לשליחה. שלוש הסלקטורים ולא אחד, כי
   .qform .agree מאופס במסכים רחבים וצריך לגבור עליו. */
.qform .agree.news,.formcard .agree.news,.agree.news{margin-top:calc(var(--u)*2)}
.agree input[type="checkbox"]{appearance:none;-webkit-appearance:none;
  width:22px;height:22px;flex:0 0 22px;margin:0;padding:0;cursor:pointer;
  position:relative;
  border:1.5px solid rgba(255,255,255,.34);border-radius:6px;
  background:rgba(255,255,255,.06);transition:.18s}
.agree input[type="checkbox"]:hover{border-color:var(--purple)}
.agree input[type="checkbox"]:checked{background:var(--gold);border-color:var(--gold)}
.agree input[type="checkbox"]:checked::after{content:"";display:block;
  width:6px;height:10px;margin:3px auto 0;border:solid #1a1040;
  border-width:0 2px 2px 0;transform:rotate(45deg)}
.agree input[type="checkbox"]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.agree input[type="checkbox"]:user-invalid{border-color:#e07189}
.agree label{font-size:12.5px;line-height:1.55;color:var(--text-dim);
  font-weight:400;margin:0;cursor:pointer}
.agree label a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.agree label a:hover{color:#fff}
.agree .err{grid-column:1/-1;display:none;color:#f0a0b1;font-size:12px;
  margin-top:2px;font-weight:500}
.agree input[type="checkbox"]:user-invalid ~ .err{display:block}
.agree input[type="checkbox"][aria-invalid] ~ .err{display:block}
html.a11y-big .agree label,html.a11y-huge .agree label{font-size:1em}

/* ============================================================
   וואטסאפ צף, בפינה השמאלית התחתונה
   ============================================================ */
.wafab{position:fixed;inset-block-end:22px;inset-inline-end:22px;z-index:70;
  width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(140deg,#26d366,#12a150);color:#04250f;
  box-shadow:0 12px 30px rgba(38,211,102,.34);
  transition:transform .3s var(--ease),box-shadow .3s ease}
.wafab:hover{transform:scale(1.08);box-shadow:0 18px 40px rgba(38,211,102,.46)}
.wafab svg{width:27px;height:27px}
.wafab::after{content:'';position:absolute;inset:0;border-radius:50%;
  border:2px solid rgba(38,211,102,.5);animation:waPulse 3s ease-out infinite}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}70%{transform:scale(1.45);opacity:0}
                   100%{transform:scale(1.45);opacity:0}}
@media(max-width:899px){.wafab{inset-block-end:16px;inset-inline-end:16px;width:50px;height:50px}}
/* פרלקס דרך משתנה, כדי לא לדרוס סיבוב או הטיה קיימים */
[data-par]{transform:translate3d(0,var(--par,0),0)}
.diag[data-par] .rails{transform:rotate(-4.5deg) translate3d(0,var(--par,0),0)}
.diag[data-par]{transform:none}

/* ============================================================
   תיק עבודות: ניווט מהיר דביק, רשת לוגואים ממורכזת
   ============================================================ */
.jump{position:fixed;inset-block-start:50%;inset-inline-end:calc(var(--rail) + 18px);
  translate:0 -50%;z-index:50;display:none;flex-direction:column;gap:9px}
@media(min-width:1100px){.jump{display:flex}}
.jump a{display:flex;align-items:center;gap:9px;padding:10px 15px;border-radius:999px;
  font-size:13.5px;font-weight:700;color:var(--text-dim);
  background:rgba(22,14,54,.78);border:1px solid var(--line-2);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  transition:color .25s ease,border-color .25s ease,transform .25s var(--ease)}
.jump a:hover{color:var(--text);border-color:rgba(139,106,224,.5);transform:translateX(-4px)}
.jump a.on{color:var(--gold);border-color:rgba(232,194,90,.4)}
.jump i{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}
/* גרסת מובייל: פס אופקי דביק מתחת לפס העליון */
.jumpbar{position:sticky;top:62px;z-index:48;display:flex;gap:8px;justify-content:center;
  padding:10px var(--gutter);background:rgba(11,6,32,.86);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-2)}
@media(min-width:1100px){.jumpbar{display:none}}
.jumpbar a{font-size:13px;font-weight:700;color:var(--text-dim);padding:7px 14px;
  border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line-2)}
.jumpbar a.on{color:var(--gold);border-color:rgba(232,194,90,.4)}

/* רשת לוגואים: שורה אחרונה ממורכזת */
.logoflex{display:flex;flex-wrap:wrap;gap:calc(var(--u)*1.75);justify-content:center}
.logoflex > div{flex:0 0 auto;width:calc((100% - var(--u)*1.75*2)/3);height:74px;
  display:grid;place-items:center;padding:12px;border-radius:14px;
  background:rgba(255,255,255,.04);border:1px solid var(--line-2);
  transition:background .35s ease,border-color .35s ease,transform .35s var(--ease)}
@media(min-width:680px){.logoflex > div{width:calc((100% - var(--u)*1.75*4)/5)}}
@media(min-width:1000px){.logoflex > div{width:calc((100% - var(--u)*1.75*6)/7)}}
.logoflex > div:hover{background:rgba(255,255,255,.08);border-color:rgba(139,106,224,.4);
  transform:translateY(-4px)}
.logoflex img{max-height:40px;width:auto;opacity:.9}

/* ארבע קרוסלות גרפיקה, לסירוגין */
.gwall{display:grid;gap:calc(var(--u)*2)}
.gwall .marq .track{gap:calc(var(--u)*2)}
.gwall .marq img{width:clamp(118px,13vw,168px);height:clamp(118px,13vw,168px);object-fit:cover;
  border-radius:var(--r);flex:0 0 auto;border:1px solid rgba(255,255,255,.1);
  box-shadow:0 12px 30px rgba(4,1,18,.42);
  transition:transform .35s var(--ease),box-shadow .35s ease,border-color .35s ease}
.gwall .marq img:hover{transform:scale(1.07) translateY(-5px);
  box-shadow:0 24px 50px rgba(4,1,18,.6);border-color:rgba(139,106,224,.6)}

/* ============================================================
   מסלולים. לוח זכוכית אחד שנשאר על המסך, אייקון המותג בולט ממנו,
   והטקסטים חיים מחוצה לו. המעבר בין מסלול למסלול הוא סיבוב של הלוח.
   ============================================================ */
.tracks{position:relative;padding-block:clamp(28px,4.4vw,56px);
  --acc:#7a5cd8;--acc-hi:#c3aeff;--acc-lo:#2c1c5c;--acc-soft:rgba(139,106,224,.5)}
.tracks[data-on="1"]{--acc:#3f6ae0;--acc-hi:#a8c2ff;--acc-lo:#17275c;--acc-soft:rgba(79,124,247,.5)}
.tracks[data-on="2"]{--acc:#c99e37;--acc-hi:#ffe3a0;--acc-lo:#513a0d;--acc-soft:rgba(232,194,90,.5)}

.tgrid{display:grid;grid-template-columns:1fr;gap:calc(var(--u)*2);align-items:start}

.stage{position:sticky;top:66px;z-index:2}
.stage__in{position:relative;display:grid;place-items:center;
  perspective:1200px;padding-block:calc(var(--u)*2)}
.stage__in::before{content:'';position:absolute;z-index:-1;pointer-events:none;
  inset:-90px calc(var(--gutter)*-1) -74px;
  background:linear-gradient(to bottom,var(--ink) calc(100% - 74px),rgba(13,8,34,0) 100%)}

.plate{position:relative;width:min(50vw,186px);aspect-ratio:1/1;
  border-radius:clamp(24px,4vw,40px);transform-style:preserve-3d;
  transition:transform .55s var(--ease),box-shadow .6s var(--ease);
  background:linear-gradient(158deg,rgba(255,255,255,.125),rgba(255,255,255,.016) 54%,rgba(255,255,255,.055));
  -webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);
  box-shadow:
    inset 0 2px 1px rgba(255,255,255,.44),
    inset 0 -3px 2px rgba(0,0,0,.52),
    inset 7px 0 16px -9px rgba(255,255,255,.24),
    inset -7px 0 16px -9px rgba(0,0,0,.44),
    inset 0 0 74px -12px var(--acc-soft),
    0 50px 110px -34px rgba(0,0,0,.85),
    0 0 0 1px rgba(255,255,255,.14);
}
/* עובי המסגרת: שתי טבעות פנימיות שיוצרות שפה משופעת */
.plate::before,.plate::after{content:'';position:absolute;border-radius:inherit;pointer-events:none}
.plate::before{inset:9px;border:1px solid rgba(255,255,255,.21);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.36),inset 0 -1px 0 rgba(0,0,0,.46),
             0 1px 0 rgba(255,255,255,.07)}
.plate::after{inset:20px;border:1px solid rgba(255,255,255,.075);
  background:radial-gradient(120% 90% at 26% 12%,rgba(255,255,255,.1),transparent 58%)}
.plate.is-turn{transform:rotateY(-17deg) rotateX(6deg) scale(.963)}

.boss{position:absolute;inset:0;margin:auto;width:43%;aspect-ratio:1/1;border-radius:50%;
  display:grid;place-items:center;transform:translateZ(48px);
  /* דיסקה כהה ולא כדור צבעוני: הסמל עצמו כחול וסגול, ועל רקע סגול
     הוא היה נבלע. צבע המסלול נשאר בהילה שמסביב ובטבעת. */
  background:radial-gradient(128% 128% at 34% 18%,#241a52,#120b31 52%,#0a0620 100%);
  transition:box-shadow .6s var(--ease);
  box-shadow:
    inset 0 4px 7px rgba(255,255,255,.52),
    inset 0 -11px 24px rgba(0,0,0,.5),
    0 22px 46px -10px rgba(0,0,0,.74),
    0 0 0 1px rgba(255,255,255,.2),
    0 0 76px -6px var(--acc-soft);
}
.boss__i{display:block;width:93%;height:93%;object-fit:contain;
  filter:drop-shadow(0 3px 10px rgba(0,0,0,.6));
  transition:opacity .38s var(--ease),transform .55s var(--ease)}
.plate.is-turn .boss__i{opacity:.35;transform:scale(.9)}

.plate__n{position:absolute;top:clamp(14px,2.6vw,24px);inset-inline-start:clamp(16px,3vw,28px);
  font-size:12px;font-weight:900;letter-spacing:2.2px;color:var(--text-faint);
  transform:translateZ(20px)}
.plate__nm{position:absolute;bottom:clamp(15px,2.8vw,26px);inset-inline:0;text-align:center;
  font-size:clamp(17px,2.2vw,24px);font-weight:900;letter-spacing:-.4px;
  transform:translateZ(22px)}

/* הטקסטים. חיים בלי קופסה, ומתעוררים כשהמסלול שלהם פעיל. */
.trk{padding-block:clamp(44px,8vh,92px);opacity:.3;transform:translateY(16px);
  transition:opacity .55s var(--ease),transform .55s var(--ease)}
.trk.on{opacity:1;transform:none}
.trk__tag{display:inline-block;font-size:12px;font-weight:900;letter-spacing:1.8px;
  color:var(--acc-hi);border:1px solid var(--acc);border-radius:999px;
  padding:5px 13px;background:color-mix(in srgb,var(--acc) 16%,transparent)}
.trk h3{text-align:start;max-width:none;font-size:clamp(27px,3.8vw,42px);margin:calc(var(--u)*1.5) 0 2px}
.trk__for{color:var(--acc-hi);font-weight:700;font-size:16px;margin-bottom:calc(var(--u)*2.75)}
.trk__pts{list-style:none;display:grid;gap:9px;margin-bottom:calc(var(--u)*4)}
.trk__pts li{position:relative;padding-inline-start:23px;color:var(--text-dim);font-size:15.5px}
.trk__pts li::before{content:'';position:absolute;inset-inline-start:0;top:.66em;
  width:9px;height:9px;border-radius:50%;background:var(--acc);
  box-shadow:0 0 13px var(--acc-soft)}
.trk__qa{display:grid;gap:calc(var(--u)*2.5);
  border-inline-start:1px solid var(--line);padding-inline-start:calc(var(--u)*2.75);
  margin-bottom:calc(var(--u)*3.5);position:relative}
.trk__qa::before{content:'';position:absolute;inset-inline-start:-1px;top:0;width:2px;height:38%;
  background:linear-gradient(to bottom,var(--acc),transparent);border-radius:2px}
.trk__qa h4{font-size:12.5px;font-weight:900;letter-spacing:1.5px;color:var(--acc-hi);
  text-align:start;margin-bottom:4px}
.trk__qa p{color:var(--text-dim);font-size:15.5px;line-height:1.72}

@media (min-width:920px){
  .tgrid{grid-template-columns:1fr minmax(320px,40%);gap:calc(var(--u)*7);align-items:stretch}
  .stage{position:relative;top:auto;order:2}
  .stage__in{position:sticky;top:0;height:100vh;padding-block:0;display:grid;place-items:center}
  .stage__in::before{display:none}
  .plate{width:min(30vw,340px)}
  .trk{padding-block:clamp(90px,18vh,190px)}
}
@media (prefers-reduced-motion:reduce){
  .trk{opacity:1;transform:none}
  .plate,.boss{transition:none}
}

/* ============================================================
   אודות. דיוקן גדול על רקע נקי, הטקסט לצידו, ומטרה/חזון/ערכים
   בלי קופסאות: קווים דקים וטיפוגרפיה גדולה.
   ============================================================ */
.folio{overflow:clip}
.fgrid{display:grid;grid-template-columns:1fr;gap:calc(var(--u)*4);align-items:center}
.ftxt .kicker,.ftxt h2,.ftxt .prose{text-align:start}
.ftxt h2{max-width:none;font-size:clamp(28px,4vw,46px)}
.ftxt .sig{margin-top:calc(var(--u)*3);font-weight:900}
.ftxt .sig span{display:block;color:var(--text-faint);font-weight:400;font-size:14px;margin-top:4px}

.fimg{position:relative;justify-self:center;width:min(86vw,440px)}
.fimg img{position:relative;z-index:2;width:100%;height:auto;
  filter:drop-shadow(0 42px 74px rgba(0,0,0,.62)) drop-shadow(0 0 44px rgba(139,106,224,.2))}
.fimg i{position:absolute;pointer-events:none;display:block}
.fimg .halo{z-index:0;inset:-10% -14% 8%;border-radius:50%;filter:blur(30px);
  background:radial-gradient(52% 52% at 50% 42%,rgba(139,106,224,.6),
             rgba(79,124,247,.22) 54%,transparent 76%)}
.fimg .ring{z-index:1;inset:auto 0 6% 0;margin-inline:auto;width:84%;aspect-ratio:1/1;
  border-radius:50%;border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 0 80px rgba(139,106,224,.22),0 0 40px -12px rgba(139,106,224,.4)}
.fimg .dust{z-index:3;inset:0;border-radius:50%;
  background:radial-gradient(60% 40% at 50% 100%,rgba(13,8,34,.92),transparent 70%)}

.creed{display:grid;grid-template-columns:1fr;gap:calc(var(--u)*5)}
.creed__it{position:relative;padding-inline-start:calc(var(--u)*3)}
.creed__it::before{content:'';position:absolute;inset-inline-start:0;top:5px;bottom:5px;width:2px;
  border-radius:2px;background:linear-gradient(to bottom,var(--purple),rgba(139,106,224,0))}
.creed__k{display:block;font-size:12px;font-weight:900;letter-spacing:2.2px;color:var(--gold)}
.creed__it p{font-size:clamp(19px,2.4vw,26px);line-height:1.5;font-weight:700;margin-top:10px}
.creed__it .sub{font-size:15.5px;font-weight:400;color:var(--text-dim);
  margin-top:12px;line-height:1.72}

.vals{display:grid;margin-top:calc(var(--u)*2)}
.vals > div{display:grid;grid-template-columns:auto 1fr;gap:calc(var(--u)*2.5);
  padding-block:calc(var(--u)*3);border-top:1px solid var(--line-2)}
.vals > div:last-child{border-bottom:1px solid var(--line-2)}
.vals b{font-size:13px;font-weight:900;letter-spacing:1.6px;color:var(--text-faint);padding-top:6px}
.vals h4{text-align:start;font-size:clamp(19px,2.3vw,25px);margin-bottom:5px}
.vals p{color:var(--text-dim);font-size:15.5px;line-height:1.72;max-width:78ch}

@media (min-width:860px){
  .fgrid{grid-template-columns:1.02fr .98fr;gap:calc(var(--u)*7)}
  .fimg{width:min(42vw,480px);justify-self:end}
  .creed{grid-template-columns:1fr 1fr;gap:calc(var(--u)*6)}
}

/* ============================================================
   מחשבון היתכנות, לוח נתונים, אזורי פלטפורמה ותועלות.
   ============================================================ */
.calc{display:grid;grid-template-columns:1fr;gap:calc(var(--u)*3.5);
  padding:clamp(18px,2.6vw,30px);border-radius:var(--r-xl)}
.calc h3{text-align:start;max-width:none;font-size:19px;margin-bottom:calc(var(--u)*2);
  padding-bottom:calc(var(--u)*1.25);border-bottom:1px solid var(--line-2)}
.calc label{display:block;margin-bottom:calc(var(--u)*1.5);font-size:13.5px;font-weight:700}
.calc label i{font-style:normal;font-weight:400;color:var(--text-faint);font-size:12px;
  margin-inline-start:5px}
.calc .hint{display:block;font-style:normal;font-weight:700;font-size:12px;
  color:var(--gold);margin-top:4px}
.calc input[type=number],.calc select{display:block;width:100%;margin-top:5px;padding:9px 12px;
  font:inherit;font-size:15.5px;font-weight:700;color:var(--text);
  background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;
  transition:border-color .2s,background .2s}
.calc input[type=number]:focus,.calc select:focus{outline:none;border-color:var(--purple);
  background:rgba(139,106,224,.1)}
.calc select{appearance:none;cursor:pointer;padding-inline-start:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none' stroke='%23b0a5d2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5 7 7.5 13 1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:left 13px center;background-size:13px 8px}
.calc select option{background:#1a1140;color:var(--text)}

/* סרגלי הגרירה */
.calc label.cs{margin-bottom:calc(var(--u)*2.25)}
.calc label.cs b{float:left;color:var(--gold);font-size:15px}
.calc input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:5px;
  margin-top:13px;border-radius:5px;cursor:pointer;
  background:linear-gradient(90deg,rgba(139,106,224,.85),rgba(232,194,90,.85))}
.calc input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;
  width:21px;height:21px;border-radius:50%;background:#fff;cursor:grab;
  border:2px solid var(--purple);box-shadow:0 3px 12px rgba(0,0,0,.55)}
.calc input[type=range]::-moz-range-thumb{width:21px;height:21px;border-radius:50%;
  background:#fff;border:2px solid var(--purple);box-shadow:0 3px 12px rgba(0,0,0,.55)}
.calc input[type=range]:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.calc__grid{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*1.25)}
.calc__grid > div.hi{grid-column:1 / -1}
/* לוח ריק: המספרים דהויים עד שממלאים, כדי שיהיה ברור שצריך למלא */
.calc.empty .calc__grid b{opacity:.42}
.calc.empty .calc__bar{opacity:.35}
.calc__grid > div{padding:calc(var(--u)*1.75);border-radius:12px;
  background:rgba(255,255,255,.035);border:1px solid var(--line-2)}
.calc__grid > div.hi{background:linear-gradient(140deg,rgba(232,194,90,.16),rgba(232,194,90,.04));
  border-color:rgba(232,194,90,.4)}
.calc.neg .calc__grid > div.hi{background:linear-gradient(140deg,rgba(255,92,92,.16),rgba(255,92,92,.04));
  border-color:rgba(255,122,122,.45)}
.calc__grid b{display:block;font-size:clamp(19px,2.6vw,25px);font-weight:900;letter-spacing:-.4px}
.calc__grid .hi b{color:var(--gold)}
.calc.neg .calc__grid .hi b{color:#ff9a9a}
.calc__grid span{display:block;color:var(--text-faint);font-size:12px;line-height:1.4;margin-top:4px}

.calc__bar{position:relative;height:7px;border-radius:7px;margin-top:calc(var(--u)*2);
  background:rgba(255,255,255,.07);overflow:hidden}
.calc__bar i{display:block;height:100%;border-radius:7px;width:30%;
  background:linear-gradient(90deg,var(--purple),var(--gold));
  transition:width .25s var(--ease),background .25s}
.calc__bar i.over{background:linear-gradient(90deg,#c0483f,#ff7a7a)}
.calc__verdict{margin-top:calc(var(--u)*2);font-weight:700;font-size:15px;line-height:1.6;
  padding-inline-start:calc(var(--u)*1.75);border-inline-start:2px solid var(--purple)}
.calc.neg .calc__verdict{border-inline-start-color:#ff7a7a}
.calc .micro{margin-top:calc(var(--u)*1.75);color:var(--text-faint);font-size:12px;line-height:1.55}

.rep{padding:0;overflow:hidden;border-radius:var(--r-xl)}
.rep__bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:14px clamp(16px,2.4vw,26px);border-bottom:1px solid var(--line-2);
  background:rgba(255,255,255,.04)}
.rep__ttl{font-size:13.5px;font-weight:900;letter-spacing:.4px}
.rep__pill{font-size:12px;font-weight:900;letter-spacing:1.2px;padding:5px 11px;border-radius:999px;
  color:var(--gold);background:rgba(232,194,90,.14);border:1px solid rgba(232,194,90,.42)}
.rep__chart{display:flex;align-items:flex-end;gap:2.2%;height:128px;
  padding:clamp(16px,2.4vw,26px) clamp(16px,2.4vw,26px) 0;
  border-bottom:1px solid var(--line-2);margin-bottom:clamp(14px,2vw,22px)}
.rep__chart span{flex:1;height:var(--h);border-radius:6px 6px 0 0;position:relative;
  background:linear-gradient(to top,rgba(139,106,224,.15),rgba(139,106,224,.55));
  transform-origin:bottom;animation:rep-rise .9s var(--ease) both}
.rep__chart span i{position:absolute;inset:auto 0 auto 0;top:-3px;height:3px;border-radius:3px;
  background:var(--gold);opacity:.75}
@keyframes rep-rise{from{transform:scaleY(.05)}to{transform:scaleY(1)}}
.rep__grid{display:grid;grid-template-columns:1fr;gap:1px;background:rgba(255,255,255,.07)}
.rep__t{padding:calc(var(--u)*2.25) clamp(16px,2.4vw,26px);background:var(--ink)}
.rep__t b{display:block;font-size:15px;font-weight:900}
.rep__t em{font-style:normal;color:var(--gold);font-weight:900;font-size:13px;margin-inline-start:6px}
.rep__t span{display:block;color:var(--text-dim);font-size:13.5px;line-height:1.6;margin-top:3px}
.rep .micro{padding:calc(var(--u)*2.25) clamp(16px,2.4vw,26px);color:var(--text-faint);
  font-size:12.5px;line-height:1.6;border-top:1px solid var(--line-2)}

.plat{position:relative;overflow:clip;--pc:#4f7cf7}
.plat::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;
  background:radial-gradient(76% 62% at 50% 0%,var(--pc),transparent 72%);
  transition:opacity 1.2s var(--ease)}
.plat.lit::before{opacity:.17}
.plat__flash{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;
  background:linear-gradient(to bottom,var(--pc),transparent 52%)}
.plat.lit .plat__flash{animation:plat-flash 1000ms var(--ease) 1}
@keyframes plat-flash{0%{opacity:0}16%{opacity:.46}100%{opacity:0}}
.plat__head{display:flex;align-items:flex-start;gap:calc(var(--u)*2.5);
  margin-bottom:calc(var(--u)*3.5)}
.plat__ic{flex:0 0 auto;width:62px;height:62px;border-radius:19px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--pc) 13%,transparent);
  border:1px solid color-mix(in srgb,var(--pc) 40%,transparent);
  box-shadow:0 0 38px -10px var(--pc)}
.plat__ic img{width:40px;height:40px;object-fit:contain;display:block}

/* ============================================================
   שכבת הרקע של מקטע הפלטפורמה. אותו אייקון חוזר, גדול ודהוי,
   ונע לאט. יושב מאחורי התוכן, לא לוכד לחיצות, ולא נקרא בקורא מסך.
   ============================================================ */
.drift{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:clip;
  -webkit-mask-image:radial-gradient(130% 96% at 50% 50%,#000 34%,transparent 82%);
          mask-image:radial-gradient(130% 96% at 50% 50%,#000 34%,transparent 82%)}
.drift__i{position:absolute;display:block;height:auto;opacity:.085;
  filter:saturate(.72) blur(.4px);will-change:transform}
.d0{animation:drift-a 27s ease-in-out infinite}
.d1{animation:drift-b 34s ease-in-out infinite}
.d2{animation:drift-c 31s ease-in-out infinite}
.d3{animation:drift-a 38s ease-in-out infinite reverse}
.d4{animation:drift-b 24s ease-in-out infinite reverse}
.d5{animation:drift-c 42s ease-in-out infinite}
@keyframes drift-a{
  0%,100%{transform:translate3d(0,0,0) rotate(-5deg)}
  50%{transform:translate3d(2.4vw,-3.2vh,0) rotate(6deg)}}
@keyframes drift-b{
  0%,100%{transform:translate3d(0,0,0) rotate(7deg)}
  50%{transform:translate3d(-3vw,2.6vh,0) rotate(-4deg)}}
@keyframes drift-c{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
  33%{transform:translate3d(-1.8vw,-2.4vh,0) rotate(9deg)}
  66%{transform:translate3d(2vw,2vh,0) rotate(-6deg)}}
/* במקטע עם טקסט צפוף השכבה נמוכה יותר, כדי שלא תתחרה בקריאה.
   בפתיח, שבו יש הרבה אוויר, היא נשארת חזקה יותר. */
.plat .drift__i{opacity:.05;filter:saturate(.55) blur(1.4px)}
.plat.lit .drift__i{opacity:.08;transition:opacity 1.2s var(--ease)}
@media(max-width:699px){.drift__i{opacity:.06}
  .plat .drift__i{opacity:.035}.plat.lit .drift__i{opacity:.055}}
/* עצירת תנועה מהתפריט עוצרת גם את זה */
html.a11y-still .drift__i{animation:none}
.plat__head h3{text-align:start;max-width:none;margin-bottom:5px}
.plat__head p{color:var(--text-dim);font-size:16px;line-height:1.7}
.plat__tips{list-style:none;display:grid;grid-template-columns:1fr;gap:calc(var(--u)*2.5)}
.plat__tips li{position:relative;padding-inline-start:calc(var(--u)*2.5);
  color:var(--text-dim);font-size:15.5px;line-height:1.72}
.plat__tips li::before{content:'';position:absolute;inset-inline-start:0;top:7px;bottom:7px;width:2px;
  border-radius:2px;background:linear-gradient(to bottom,var(--pc),transparent)}
.plat__tips b{display:block;color:var(--text);font-size:16px;margin-bottom:3px}
.plat__note{margin-top:calc(var(--u)*3);color:var(--text-faint);font-size:13px;line-height:1.65}

.ben{display:grid;grid-template-columns:1fr;gap:0}
.ben__it{padding-block:calc(var(--u)*3);border-top:1px solid var(--line-2);position:relative;
  padding-inline-start:calc(var(--u)*6)}
.ben__it:last-child{border-bottom:1px solid var(--line-2)}
.ben__n{position:absolute;inset-inline-start:0;top:calc(var(--u)*3);font-size:13px;font-weight:900;
  letter-spacing:1.4px;color:var(--gold)}
.ben__it h4{text-align:start;font-size:clamp(19px,2.3vw,24px);margin-bottom:5px}
.ben__it p{color:var(--text-dim);font-size:15.5px;line-height:1.72;max-width:76ch}

@media (min-width:760px){
  .calc{grid-template-columns:1fr 1fr;gap:calc(var(--u)*5)}
  .rep__grid{grid-template-columns:1fr 1fr}
  .plat__tips{grid-template-columns:1fr 1fr;gap:calc(var(--u)*3)}
  .ben{grid-template-columns:1fr 1fr;column-gap:calc(var(--u)*6)}
  .ben__it:nth-child(2){border-top:1px solid var(--line-2)}
}
@media (min-width:1040px){.rep__grid{grid-template-columns:1fr 1fr 1fr}}

/* ============================================================
   תרשים האזור הבטוח בווידאו אנכי. מראה מה הממשק מכסה בפועל.
   ============================================================ */
.safe{display:grid;grid-template-columns:1fr;gap:calc(var(--u)*4);align-items:center}
.safe__ph{position:relative;width:min(74vw,286px);aspect-ratio:9/16;justify-self:center;
  border-radius:26px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 40px 80px -30px rgba(0,0,0,.85),inset 0 0 0 1px rgba(255,255,255,.06)}
.safe__ph > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.6) brightness(.85)}
.safe .z{position:absolute;display:block;
  background:repeating-linear-gradient(135deg,rgba(18,8,32,.72) 0 6px,rgba(255,92,92,.3) 6px 12px);
  border:1px dashed rgba(255,132,132,.7)}
.safe .z.t{inset:0 0 auto 0;height:16%}
.safe .z.b{inset:auto 0 0 0;height:22%}
.safe .z.s{inset:16% 0 22% auto;width:22%}
.safe .z.ok{inset:16% 22% 22% 0;
  background:linear-gradient(to bottom,rgba(90,224,150,.1),rgba(90,224,150,.03));
  border:1px dashed rgba(120,235,180,.7)}
.safe .z i{position:absolute;top:7px;inset-inline-start:7px;width:21px;height:21px;border-radius:50%;
  display:grid;place-items:center;font-size:11.5px;font-weight:900;font-style:normal;
  background:var(--ink);color:var(--text);border:1px solid var(--line)}
.safe .z.ok em{position:absolute;inset-inline:6px;bottom:9px;text-align:center;font-style:normal;
  font-size:11px;font-weight:900;letter-spacing:.8px;color:#9df0c4}
.safe .cap{position:absolute;inset-inline:26%;bottom:31%;text-align:center;
  font-size:12px;font-weight:900;color:#fff;padding:5px 8px;border-radius:7px;
  background:rgba(0,0,0,.6);text-shadow:0 1px 2px rgba(0,0,0,.9)}
.safe__ls{list-style:none;counter-reset:s;display:grid;gap:calc(var(--u)*2.5)}
.safe__ls li{position:relative;padding-inline-start:calc(var(--u)*4.5);
  color:var(--text-dim);font-size:15.5px;line-height:1.72}
.safe__ls li::before{counter-increment:s;content:counter(s);
  position:absolute;inset-inline-start:0;top:1px;width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;font-size:12.5px;font-weight:900;color:var(--text);
  background:rgba(255,255,255,.06);border:1px solid var(--line)}
.safe__ls b{display:block;color:var(--text);font-size:16px;margin-bottom:3px}

.mediawall{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(var(--u)*1.5)}
.mediawall .tile{margin:0}
.mediawall .fr{display:block;position:relative;border-radius:var(--r);overflow:hidden;
  background:rgba(255,255,255,.04);border:1px solid var(--line-2)}
.mediawall video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

@media (min-width:860px){
  .safe{grid-template-columns:auto 1fr;gap:calc(var(--u)*7)}
  .safe__ph{width:300px}
}

/* כוכבים גם מחוץ למקטע הציר. אותו קנבס, אותה התנהגות. */
.phero,.stand,.tracks,.plat{position:relative}
.phero > .space__stars,.stand > .space__stars,
.tracks > .space__stars,.sec > .space__stars{
  position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;
  -webkit-mask-image:radial-gradient(120% 100% at 50% 40%,#000 38%,transparent 86%);
  mask-image:radial-gradient(120% 100% at 50% 40%,#000 38%,transparent 86%)}
.phero > .wrap,.stand > .wrap,.tracks > .wrap,.sec > .wrap{position:relative;z-index:1}
.hero{position:relative;overflow-x:clip}
.hero > .space__stars{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;
  -webkit-mask-image:radial-gradient(120% 100% at 50% 45%,#000 30%,transparent 84%);
  mask-image:radial-gradient(120% 100% at 50% 45%,#000 30%,transparent 84%)}
.hero > .wrap{position:relative;z-index:1}

/* שורת הסינון מתחת לכותרת הראשית. הסטירה שאחרי הנשיקה. */
.qual{max-width:56ch;margin:calc(var(--u)*2.25) auto 0;text-align:center;
  color:var(--text-dim);font-size:15.5px;line-height:1.7;
  padding-top:calc(var(--u)*2.25);position:relative}
.qual::before{content:'';position:absolute;top:0;inset-inline:50%;width:52px;height:1px;
  transform:translateX(50%);
  background:linear-gradient(90deg,transparent,rgba(232,194,90,.7),transparent)}
@media (min-width:760px){.qual{font-size:16.5px}}

/* בולטים בתוך שלב בציר */
.step__ls{list-style:none;display:grid;gap:8px;margin-top:calc(var(--u)*1.25)}
.step__ls li{position:relative;padding-inline-start:20px;color:var(--text-dim);
  font-size:15.5px;line-height:1.6}
.step__ls li::before{content:'';position:absolute;inset-inline-start:0;top:.6em;
  width:7px;height:7px;border-radius:50%;background:var(--gold);opacity:.8;
  box-shadow:0 0 10px rgba(232,194,90,.5)}
.step.on .step__ls li::before{opacity:1}

/* כפתור הקול בקרוסלה. לחיצה על הסרטון עושה את אותו הדבר. */
.vring__hit{cursor:pointer}
.vring__snd{position:absolute;z-index:6;bottom:12px;inset-inline-start:12px;
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  color:var(--text);background:rgba(13,8,34,.72);border:1px solid var(--line);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:background .2s,border-color .2s,transform .2s}
.vring__snd:hover{background:rgba(139,106,224,.3);transform:translateY(-2px)}
.vring__snd:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.vring__snd svg{width:21px;height:21px}
.vring__snd .on1,.vring__snd .on2{opacity:0}
.vring.sound .vring__snd{border-color:rgba(232,194,90,.6);color:var(--gold)}
.vring.sound .vring__snd .on1,.vring.sound .vring__snd .on2{opacity:1}
.vring.sound .vring__snd .off{opacity:0}

/* ============================================================
   נגישות. כפתור, לוח התאמות, ומצבי ההתאמה עצמם.
   לפי ת"י 5568, שמאמץ את WCAG 2.0 ברמה AA.
   ============================================================ */
.skip{position:fixed;top:-100px;inset-inline-start:12px;z-index:200;
  padding:12px 18px;border-radius:0 0 12px 12px;font-weight:900;
  background:var(--gold);color:#2a1f05;transition:top .18s var(--ease)}
.skip:focus{top:0}

.a11ybtn{position:fixed;z-index:120;top:16px;inset-inline-end:auto;left:16px;
  width:50px;height:50px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  color:#fff;background:linear-gradient(140deg,#2f6bd8,#1d4ea8);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 10px 26px -8px rgba(0,0,0,.7);
  transition:transform .2s var(--ease),box-shadow .2s}
.a11ybtn:hover{transform:scale(1.07)}
.a11ybtn svg{width:26px;height:26px}
.a11ybtn:focus-visible,.a11y button:focus-visible,.a11y a:focus-visible{
  outline:3px solid var(--gold);outline-offset:3px}

.a11y{position:fixed;z-index:121;top:76px;left:16px;width:min(88vw,272px);
  padding:14px;border-radius:18px;
  background:#140d33;border:1px solid var(--line);
  box-shadow:0 26px 60px -18px rgba(0,0,0,.85)}
.a11y[hidden]{display:none}
.a11y__top{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--line-2)}
.a11y__top strong{font-size:15px}
.a11y__top button{width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:20px;
  line-height:1;color:var(--text);background:rgba(255,255,255,.06);border:1px solid var(--line)}
.a11y__ops{display:grid;gap:6px}
.a11y__ops button{display:flex;align-items:center;gap:9px;width:100%;
  padding:9px 11px;border-radius:10px;cursor:pointer;text-align:start;
  font:inherit;font-size:14px;font-weight:700;color:var(--text);
  background:rgba(255,255,255,.045);border:1px solid var(--line-2)}
.a11y__ops button:hover{background:rgba(255,255,255,.1)}
.a11y__ops button[aria-pressed="true"]{background:rgba(47,107,216,.26);
  border-color:rgba(120,170,255,.6)}
.a11y__ops .tick{flex:0 0 auto;width:15px;height:15px;border-radius:4px;
  border:1px solid var(--line);position:relative}
.a11y__ops button[aria-pressed="true"] .tick{background:#4d8bf0;border-color:#4d8bf0}
.a11y__ops button[aria-pressed="true"] .tick::after{content:'';position:absolute;
  inset-inline-start:4px;top:1px;width:4px;height:8px;border:2px solid #fff;
  border-top:0;border-inline-start:0;transform:rotate(42deg)}
.a11y__reset{width:100%;margin-top:10px;padding:9px;border-radius:10px;cursor:pointer;
  font:inherit;font-size:13.5px;font-weight:900;color:var(--text);
  background:rgba(255,255,255,.06);border:1px solid var(--line)}
.a11y__link{display:block;text-align:center;margin-top:9px;font-size:12.5px;
  color:var(--purple);text-decoration:underline}

/* מצבי ההתאמה */
html.a11y-big{font-size:118%}
html.a11y-huge{font-size:136%}
html.a11y-space body{line-height:2.05;letter-spacing:.4px;word-spacing:3px}
html.a11y-read body,html.a11y-read .script,html.a11y-read h1,html.a11y-read h2,
html.a11y-read h3,html.a11y-read h4{font-family:Arial,'Heebo',sans-serif !important;
  font-style:normal !important}
html.a11y-links a{text-decoration:underline !important;text-underline-offset:3px}
html.a11y-gray body{filter:grayscale(1)}
html.a11y-contrast body{background:#000}
html.a11y-contrast body::before,html.a11y-contrast body::after,
html.a11y-contrast .arms,html.a11y-contrast .orbs,html.a11y-contrast .space__stars,
html.a11y-contrast .hring,html.a11y-contrast .plate,html.a11y-contrast .fimg i{display:none}
html.a11y-contrast .glass,html.a11y-contrast .calc,html.a11y-contrast .rep,
html.a11y-contrast .card,html.a11y-contrast .plan{background:#000 !important;
  border-color:#fff !important;box-shadow:none !important}
html.a11y-contrast,html.a11y-contrast p,html.a11y-contrast li,html.a11y-contrast h1,
html.a11y-contrast h2,html.a11y-contrast h3,html.a11y-contrast h4,html.a11y-contrast span,
html.a11y-contrast div,html.a11y-contrast b,html.a11y-contrast strong{color:#fff !important}
html.a11y-contrast a,html.a11y-contrast .kicker,html.a11y-contrast .script{color:#ffe66b !important}
html.a11y-still *,html.a11y-still *::before,html.a11y-still *::after{
  animation:none !important;transition:none !important;scroll-behavior:auto !important}
html.a11y-still video{display:none}
html.a11y-still .tile .fr,html.a11y-still .vring__card{background-size:cover}

/* מיקוד גלוי בכל האתר, לניווט במקלדת */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--gold);outline-offset:3px;
  border-radius:4px}

@media (max-width:900px){
  .a11ybtn{top:auto;bottom:88px;left:16px;width:46px;height:46px}
  .a11y{top:auto;bottom:146px}
}

/* עמודים משפטיים */
.lgl__date{text-align:center;color:var(--text-faint);font-size:13px;
  margin-bottom:calc(var(--u)*5)}
.lgl{display:grid;gap:calc(var(--u)*4);max-width:760px;margin-inline:auto}
.lgl__it h2{text-align:start;max-width:none;font-size:clamp(19px,2.3vw,24px);
  display:flex;align-items:baseline;gap:12px;margin-bottom:calc(var(--u)*1.5)}
.lgl__it h2 span{flex:0 0 auto;font-size:13px;font-weight:900;color:var(--gold);
  letter-spacing:1px}
.lgl__it p{color:var(--text-dim);font-size:16px;line-height:1.8;margin-bottom:12px}
.lgl__it p:last-child{margin-bottom:0}
.lgl__it a{color:var(--purple);text-decoration:underline;text-underline-offset:3px}
.lgl__ls{list-style:none;display:grid;gap:9px;margin:0 0 12px}
.lgl__ls li{position:relative;padding-inline-start:20px;color:var(--text-dim);
  font-size:16px;line-height:1.75}
.lgl__ls li::before{content:'';position:absolute;inset-inline-start:0;top:.7em;
  width:7px;height:7px;border-radius:50%;background:var(--purple)}
.lgl .flag{display:inline-block;font-size:12.5px;font-weight:900;letter-spacing:.8px;
  padding:3px 9px;border-radius:999px;margin-inline-end:7px;
  color:var(--gold);background:rgba(232,194,90,.14);border:1px solid rgba(232,194,90,.4)}
.lgl__note{max-width:760px;margin:calc(var(--u)*5) auto 0;padding:calc(var(--u)*2.5);
  border-radius:var(--r);color:var(--text-faint);font-size:13.5px;line-height:1.7;
  background:rgba(255,255,255,.035);border:1px solid var(--line-2)}

html.a11y-contrast .rail,html.a11y-contrast .mbar,html.a11y-contrast .mobmenu{
  background:#000 !important;border-color:#fff !important}
html.a11y-contrast .rail__ic{background:#fff !important}

/* ילדי גריד לא ייאלצו להתרחב בגלל תוכן ארוך */
.offer > .wrap > *,.cgrid > *,.fgrid > *,.tgrid > *{min-width:0}

/* ============================================================
   רצועת קוקיז. דקה, בתחתית, בלי לחסום את הדף.
   אין בחירה מסומנת מראש, וסירוב באותה נגישות כמו אישור.
   ============================================================ */
.ckbar{position:fixed;inset-inline-start:var(--rail);inset-inline-end:0;inset-block-end:0;z-index:130;
  background:rgba(14,8,38,.93);border-top:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 -14px 40px rgba(4,1,18,.5);
  transform:translateY(105%);transition:transform .45s var(--ease)}
.ckbar.on{transform:none}
.ckbar[hidden]{display:none}
.ckbar__in{max-width:var(--wrap);margin:0 auto;
  padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom,0px));
  display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.ckbar p{flex:1 1 320px;font-size:13px;line-height:1.6;color:var(--text-dim);margin:0}
.ckbar p a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.ckbar p a:hover{color:#fff}
.ckbar__btns{display:flex;gap:9px;flex:0 0 auto;margin-inline-start:auto}
.ckbar button{font-family:inherit;font-size:13.5px;font-weight:700;padding:9px 18px;
  border-radius:10px;cursor:pointer;white-space:nowrap;
  transition:transform .2s var(--ease),background .2s ease,border-color .2s ease}
.ckbar button:hover{transform:translateY(-2px)}
.ckbar__ok{border:0;background:linear-gradient(135deg,var(--gold),var(--gold-lo));color:#3a2b06}
.ckbar__ghost{border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.05);color:var(--text)}
.ckbar__ghost:hover{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.1)}
.ckbar button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* הכפתור הצף מתרומם כל עוד הרצועה פתוחה, כדי שלא יוסתר */
html.ck-open .wafab{inset-block-end:calc(22px + var(--ckh,78px));
  transition:inset-block-end .45s var(--ease)}
@media(max-width:559px){
  .ckbar__in{padding-inline:var(--gutter)}
  .ckbar p{flex:1 1 100%;font-size:12.5px}
  .ckbar__btns{width:100%;margin-inline-start:0}
  .ckbar__btns button{flex:1}
}
html.a11y-still .ckbar{transition:none}

/* ============================================================
   דיוקן החלקיקים בהירו. התמונה נדגמת לנקודות, והסמן דוחף אותן.
   ============================================================ */
/* הטקסט נשאר ממורכז ברוחב המלא. הדמות יוצאת מהזרימה ונצמדת לקצה
   השמאלי של המסך, כדי שהיא לא תדחוף את הכותרת ולא תצר אותה. */
.face{position:relative;width:100%;max-width:300px;margin:calc(var(--u)*3) auto 0;
  aspect-ratio:4/5;isolation:isolate}
@media(min-width:1100px){
  .hero{padding-block:calc(var(--u)*16) calc(var(--u)*6)}
  .face{position:absolute;top:50%;left:0;right:auto;translate:0 -50%;
    margin:0;max-width:none;z-index:1;width:min(25vw,310px)}
}
/* ככל שהמסך מתרחב, הדמות גדלה. במסך צר יותר היא נשארת קטנה
   כדי לא להיכנס לשורת הכותרת הממורכזת. */
@media(min-width:1400px){.face{width:min(27vw,390px)}}
@media(min-width:1700px){.face{width:min(26vw,440px);left:calc(var(--u)*4)}}
.face__c,.face__fb{position:absolute;inset:0;width:100%;height:100%;display:block}
.face__c{opacity:0;transition:opacity .9s var(--ease);touch-action:pan-y}
.face__fb{object-fit:contain;object-position:center;
  -webkit-mask-image:radial-gradient(78% 78% at 50% 44%,#000 58%,transparent 96%);
          mask-image:radial-gradient(78% 78% at 50% 44%,#000 58%,transparent 96%)}
.face.is-on .face__c{opacity:1}
.face.is-on .face__fb{opacity:0;pointer-events:none}
.face__cap{position:absolute;inset-block-end:2%;inset-inline:0;text-align:center;z-index:2;
  font-size:11.5px;font-weight:900;letter-spacing:2.2px;color:var(--text-faint);
  pointer-events:none}
/* החשכה רכה מאחורי הדיוקן. הילה בהירה הייתה מורידה את הניגודיות
   של הנקודות ומטשטשת את הפנים, ולכן הרקע כאן מתכהה ולא מתבהר. */
.face::before{content:'';position:absolute;inset:-10%;z-index:-1;pointer-events:none;
  border-radius:50%;
  background:radial-gradient(circle,rgba(8,4,26,.55),rgba(8,4,26,0) 70%)}
/* במסך צר אין עכבר, ולכן הדיוקן קטן ומשמש כתמונה ולא כמשחק */
@media(max-width:999px){
  .face{max-width:320px;margin-top:calc(var(--u)*1.5)}
  .face__cap{font-size:10.5px}
}
@media(max-width:559px){.face{max-width:250px}}

/* כותרת פתיח שהיא משפט שלם ולא סלוגן. גודל קטן יותר, שורות צפופות יותר. */
.phero--tight h1{font-size:clamp(26px,3.5vw,42px);letter-spacing:-.6px;line-height:1.2;
  max-width:26ch;margin-inline:auto}

/* ============================================================
   התאמות מגע ומסכים קטנים. נוסף בסוף בכוונה, כדי לא לגעת בקיים.
   ============================================================ */

/* יעד מגע: תיבת אישור התנאים מקבלת שטח לחיצה של 44 פיקסל,
   בלי לשנות את גודל הריבוע שנראה על המסך. */
.agree input[type="checkbox"]::before{content:"";position:absolute;
  inset:50% auto auto 50%;translate:-50% -50%;width:44px;height:44px}

/* קישורי הפוטר ועץ האתר: שורה נמוכה מדי לאצבע */
@media(hover:none),(max-width:699px){
  .map__col a{padding-block:9px}
  .foot .legal{gap:10px 20px;line-height:1.9}
  .foot .det{line-height:2.3}
  .a11y__link,.ckbar a{display:inline-block;padding-block:7px}
}

/* סרגלי המחשבון: רצועה עבה יותר לאצבע, הראש נשאר באותו גודל */
@media(hover:none){
  .calc input[type=range]{height:10px;margin-top:16px}
  .calc input[type=range]::-webkit-slider-thumb{width:26px;height:26px}
  .calc input[type=range]::-moz-range-thumb{width:26px;height:26px}
}

/* הרמז "העבר עכבר לגלילה" חסר משמעות במכשיר בלי עכבר */
@media(hover:none){ .site .hint{display:none} }

/* מסך צר מאוד: מונע מהכרטיסים והטפסים להידחס */
@media(max-width:359px){
  :root{--gutter:14px}
  .calc__grid{grid-template-columns:1fr}
  .vs,.steps{gap:calc(var(--u)*1.5)}
}

/* חיסכון בסוללה ובמעבד במכשירים ניידים:
   שכבות הרקע הדקורטיביות נשארות, התנועה האיטית שלהן נעצרת. */
@media(hover:none) and (max-width:899px){
  .arms .spin,.arms .core,.orbs i,.drift__i{animation:none}
  .orbs{opacity:.18}
}

/* יעד מגע: קישורי פירורי הלחם וקישורי הקשר */
@media(hover:none),(max-width:699px){
  .crumb a{display:inline-block;padding-block:7px}
  .foot .det a{display:inline-block;padding-block:6px}
  .cway{padding-block:calc(var(--u)*2.75)}
}

/* יעד מגע: קישורים בתוך טקסט קצר */
@media(hover:none),(max-width:699px){
  .agree label a{display:inline-block;padding-block:7px}
  .lgl a[href^="tel:"],.lgl a[href^="mailto:"],
  .lgl p > a,.lgl li > a{display:inline-block;padding-block:7px}
}

/* יעד מגע: קישורי "לקריאה נוספת" בתוך פסקה */
@media(hover:none),(max-width:699px){
  .note a,.sig a,.about .body a{display:inline-block;padding-block:8px}
}

/* שורת הגיבוי בטופס. מופיעה רק אם השליחה ליעד נפלה. */
.lead-fb{margin:14px 0 0;font-size:14px;line-height:1.7;font-weight:700;
  color:#b23b3b;background:rgba(178,59,59,.08);border:1px solid rgba(178,59,59,.28);
  border-radius:12px;padding:12px 14px}
.lead-fb a{color:#b23b3b;text-decoration:underline;display:inline-block;padding-block:4px}

/* יעד מגע: קישורי המקורות בתוך פסקאות התוכן. */
@media(hover:none),(max-width:699px){
  .srcline a,.prose a,.body a,.step a,.faq .a a{display:inline-block;padding-block:8px}
  .srcline{line-height:2.2}
}

/* ============================================================
   עמוד התודה, thank-you.html. עמוד אמיתי עם כתובת משלו, כדי שאפשר
   להשתמש בו כיעד המרה בקמפיינים. אין כאן שום הנפשת שקיפות, כי
   אנימציה שמתחילה משקיפות אפס נתקעת על הפריים הראשון בטאב שלא
   מצייר, והעמוד היה נשאר ריק.
   ============================================================ */
.typ{position:relative;min-height:calc(100vh - 120px);display:grid;place-items:center;
     padding:calc(var(--u)*10) var(--gutter) calc(var(--u)*8);text-align:center}
.typ .wrap{position:relative;z-index:2;width:min(100%,560px)}

.typ__tick{width:84px;height:84px;border-radius:50%;margin:0 auto calc(var(--u)*3);
           display:grid;place-items:center;
           background:linear-gradient(135deg,var(--gold),var(--gold-lo));
           box-shadow:0 16px 42px rgba(232,194,90,.34)}
.typ__tick svg{width:40px;height:40px;stroke:#3a2b06;stroke-width:3;fill:none;
               stroke-linecap:round;stroke-linejoin:round;
               stroke-dasharray:30;stroke-dashoffset:0;
               animation:typtick .5s var(--ease) .15s}
@keyframes typtick{from{stroke-dashoffset:30}to{stroke-dashoffset:0}}

.typ h1{font-size:clamp(28px,6.4vw,44px);font-weight:900;line-height:1.18;letter-spacing:-.6px}
.typ__lead{color:var(--gold);font-weight:900;font-size:clamp(16px,2.6vw,19px);margin-top:10px}
.typ__sub{color:var(--text-dim);font-size:15px;line-height:1.75;margin-top:12px}

.typ__steps{list-style:none;text-align:start;margin:calc(var(--u)*4) 0 0;
            display:grid;gap:12px;padding:calc(var(--u)*2.5);
            background:rgba(255,255,255,.04);border:1px solid var(--line);
            border-radius:var(--r-lg);
            -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.typ__steps li{display:flex;gap:11px;align-items:flex-start;
               font-size:14.5px;line-height:1.65;color:var(--text-dim)}
.typ__steps b{flex:0 0 auto;width:24px;height:24px;border-radius:50%;margin-top:1px;
              display:grid;place-items:center;font-size:12.5px;font-weight:900;
              color:var(--gold);background:rgba(232,194,90,.12);
              border:1px solid rgba(232,194,90,.3)}

.typ__now{margin-top:calc(var(--u)*4);font-size:14px;color:var(--text-faint)}
.typ__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
           margin-top:calc(var(--u)*2)}
.typ__back{display:inline-block;margin-top:calc(var(--u)*4);font-size:14px;font-weight:700;
           color:var(--text-faint);text-decoration:underline;text-underline-offset:3px}
.typ__back:hover{color:var(--text)}

@media(max-width:560px){
  .typ{padding-block:calc(var(--u)*8) calc(var(--u)*6);min-height:auto}
  .typ__btns .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){ .typ__tick svg{animation:none} }
html.a11y-still .typ__tick svg{animation:none}
