/* dt-elements v4 (10.11.2026): ספריית ה-UI של אופיר (ui-elements/) על אתר digi-transform, בצבעי המותג.
   נטען אחרון (middleware, אחרי dt-strips). מחליף עיצוב בלבד: וואטסאפ צף, באנר עוגיות, שאלות ותשובות. מוסיף: חזרה למעלה.
   לוגיקה לא נוגעים: #cb/data-a, .qa/details, schema. גופן: Heebo בלבד. */
:root{--dte-navy:#002145;--dte-ink:#0a1228;--dte-card:#101a38;--dte-or:#ff7a1a;--dte-ye:#ffce26;--dte-line:rgba(143,176,255,.22)}
.dt-wa,.dt-wa *,.dt-up,#cb.cb,#cb.cb *,.qa,.qa *{font-family:Heebo,Arial,sans-serif}

/* ===== 1 · וואטסאפ צף: כדור פועם שנפתח לכפתור ===== */
html body a.wa.dt-wa{background:linear-gradient(135deg,#2fe27a,#0e9f6e)!important;border:0!important;box-shadow:0 10px 26px rgba(14,159,110,.5)!important;
  height:58px!important;width:58px!important;border-radius:999px!important;font-size:0!important;color:#fff!important;overflow:visible;
  justify-content:flex-start!important;padding:0!important;transition:width .5s cubic-bezier(.5,0,.2,1),transform .2s!important}
html body a.wa.dt-wa .dt-wa-i{flex:none;width:58px;height:58px;display:grid;place-items:center}
html body a.wa.dt-wa .dt-wa-i svg{width:30px;height:30px;fill:#fff;animation:dtwig 3.6s ease-in-out infinite}
html body a.wa.dt-wa .dt-wa-l{font-size:16px;font-weight:800;white-space:nowrap;opacity:0;transform:translateX(-10px);transition:.3s;padding-inline-end:22px}
html body a.wa.dt-wa::before,html body a.wa.dt-wa::after{content:"";position:absolute;inset:0;border-radius:999px;border:2px solid #25d366;animation:dtring 2.6s ease-out infinite;pointer-events:none}
html body a.wa.dt-wa::after{animation-delay:1.3s}
html body a.wa.dt-wa:hover,html body a.wa.dt-wa:focus-visible{width:206px!important}
html body a.wa.dt-wa:hover .dt-wa-l,html body a.wa.dt-wa:focus-visible .dt-wa-l{opacity:1;transform:none;transition-delay:.15s}
html body a.wa.dt-wa:hover::before,html body a.wa.dt-wa:hover::after{animation:none;opacity:0}
html body a.wa.dt-wa:active{transform:scale(.96)}
@keyframes dtring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7,1.5);opacity:0}}
@keyframes dtwig{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-14deg)}92%{transform:rotate(12deg)}95%{transform:rotate(-8deg)}98%{transform:rotate(4deg)}}

/* ===== 2 · באנר עוגיות: כרטיס צף נקי ===== */
html body #cb.cb{background:rgba(10,18,40,.94)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--dte-line)!important;border-radius:22px!important;
  box-shadow:0 24px 60px rgba(0,0,0,.6)!important;color:#fff;display:grid;gap:14px!important;padding:20px 20px 18px!important;
  max-width:560px!important;justify-content:stretch!important;grid-template-columns:1fr!important;align-items:stretch!important}
html body #cb.cb[hidden]{display:none!important}
html body #cb.cb:not([hidden]){animation:dtcb .6s cubic-bezier(.2,1.1,.3,1)}
@keyframes dtcb{from{opacity:0;transform:translateY(40px) scale(.96)}}
html body #cb.cb .cbt b{display:block!important;font-size:17px;font-weight:800;margin-bottom:4px}
html body #cb.cb .cbt p{display:block!important;-webkit-line-clamp:unset!important;font-size:14.5px!important;line-height:1.55!important;margin:0!important;opacity:.85;overflow:visible!important}
html body #cb.cb .cbt p a{color:var(--dte-ye);text-decoration:underline;text-underline-offset:3px}
html body #cb.cb .cbo{display:grid;gap:8px;margin-top:12px;font-size:14.5px}
html body #cb.cb .cbo[hidden]{display:none}
html body #cb.cb .cbo label{display:flex;gap:10px;align-items:center;padding:9px 12px;border:1px solid var(--dte-line);border-radius:12px;cursor:pointer}
html body #cb.cb .cba{display:flex!important;gap:8px;flex-wrap:wrap!important;width:100%}
html body #cb.cb .cba button{min-height:46px!important;border-radius:14px!important;font-weight:800!important;font-size:15px!important;cursor:pointer;transition:transform .15s,background .2s,box-shadow .2s;flex:1 1 auto!important;padding:8px 14px!important}
html body #cb.cb .cba [data-a=all]{background:var(--dte-or)!important;color:var(--dte-navy)!important;border:0!important;box-shadow:0 8px 20px rgba(255,122,26,.35)}
html body #cb.cb .cba [data-a=none]{background:transparent!important;color:#fff!important;border:1.5px solid rgba(255,255,255,.4)!important}
html body #cb.cb .cba .lk{background:transparent!important;color:#bcd0ff!important;border:0!important;text-decoration:underline;text-underline-offset:3px;flex:1 0 100%!important;min-height:36px!important}
html body #cb.cb .cba button:hover{transform:translateY(-2px)}
@media(max-width:900px){html body #cb.cb{left:10px!important;right:10px!important;bottom:76px!important;max-width:none!important;width:auto!important;padding:16px!important}
  html body #cb.cb .cbt p{font-size:14px!important}}

/* ===== 3 · שאלות ותשובות: אקורדיון עם איקס מסתובב ופתיחה חלקה ===== */
html body main .qa.qa{background:var(--dte-card)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:18px!important;margin-bottom:10px!important;overflow:hidden;
  transition:border-color .3s,background .3s,transform .3s,box-shadow .3s;interpolate-size:allow-keywords}
html body main .qa.qa:hover{border-color:rgba(255,122,26,.45)!important;transform:translateY(-2px)}
html body main .qa.qa[open]{border-color:var(--dte-or)!important;background:#12204a!important;box-shadow:0 14px 34px rgba(0,0,0,.35)}
html body main .qa.qa summary{padding:18px 22px 18px 66px!important;font-size:clamp(16px,1.6vw,18.5px)!important;font-weight:800;line-height:1.5;color:#fff;transition:color .3s}
html body main .qa.qa[open] summary{color:var(--dte-ye)}
html body main .qa.qa summary::after{content:""!important;left:18px!important;width:32px!important;height:32px!important;border-radius:50%!important;
  background:linear-gradient(#fff,#fff) center/14px 2px no-repeat,linear-gradient(#fff,#fff) center/2px 14px no-repeat,rgba(255,255,255,.1)!important;
  transition:transform .45s cubic-bezier(.3,1.3,.5,1),background-color .3s!important}
html body main .qa.qa[open] summary::after{content:""!important;transform:translateY(-50%) rotate(135deg)!important;
  background:linear-gradient(#fff,#fff) center/14px 2px no-repeat,linear-gradient(#fff,#fff) center/2px 14px no-repeat,var(--dte-or)!important}
html body main .qa.qa>div{padding:0 22px 6px}
html body main .qa.qa p{opacity:.88}
html body main .qa.qa::details-content{block-size:0;overflow:hidden;transition:block-size .45s cubic-bezier(.5,0,.2,1),content-visibility .45s allow-discrete}
html body main .qa.qa[open]::details-content{block-size:auto}

/* ===== 4 · חזרה למעלה עם טבעת התקדמות (חדש) ===== */
.dt-up{position:fixed;right:16px;bottom:72px;z-index:65;width:54px;height:54px;border-radius:50%;border:0;padding:0;cursor:pointer;color:#fff;background:var(--dte-navy);
  box-shadow:0 8px 22px rgba(0,0,0,.45);display:grid;place-items:center;opacity:0;transform:translateY(20px) scale(.8);pointer-events:none;
  transition:opacity .35s,transform .4s cubic-bezier(.3,1.4,.5,1),bottom .4s}
.dt-up.on{opacity:1;transform:none;pointer-events:auto}.dt-up:hover{transform:translateY(-3px)}
.dt-up svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.dt-up circle{fill:none;stroke-width:3.5}.dt-up .bg{stroke:rgba(255,255,255,.18)}.dt-up .fg{stroke:var(--dte-or);stroke-linecap:round;stroke-dasharray:151;stroke-dashoffset:151}
.dt-up b{position:relative;font-size:20px;line-height:1}
.dt-up:focus-visible{outline:3px solid var(--dte-ye);outline-offset:4px}

@media(max-width:900px){.dt-up{right:12px;bottom:84px;width:48px;height:48px}body:has(#cb:not([hidden])) .dt-up{opacity:0;pointer-events:none}}
@media (prefers-reduced-motion:reduce){
  html body a.wa.dt-wa::before,html body a.wa.dt-wa::after,html body a.wa.dt-wa .dt-wa-i svg{animation:none!important}
  html body #cb.cb:not([hidden]){animation:none}html body main .qa,html body main .qa.qa::details-content,.dt-up{transition-duration:.01ms!important}}
html.a11y-motion body a.wa.dt-wa::before,html.a11y-motion body a.wa.dt-wa::after,html.a11y-motion body a.wa.dt-wa .dt-wa-i svg{animation:none!important}

/* ===== v2: 5 · פס התקדמות גלילה (חדש) ===== */
.dt-prog{position:fixed;top:0;left:0;right:0;height:3px;z-index:210;pointer-events:none;background:transparent}
.dt-prog i{display:block;height:100%;width:100%;transform-origin:right center;transform:scaleX(0);background:linear-gradient(90deg,var(--dte-or),var(--dte-ye));box-shadow:0 0 10px rgba(255,122,26,.6)}

/* ===== v2: 6 · פס פעולה תחתון בנייד: כרטיס צף שמתחבא בגלילה למטה ===== */
html body .mbar{left:10px!important;right:10px!important;bottom:10px!important;width:auto;border:1px solid var(--dte-line)!important;border-radius:22px!important;padding:8px!important;
  background:rgba(10,18,40,.9)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 16px 40px rgba(0,0,0,.55);
  transition:transform .5s cubic-bezier(.3,1.2,.5,1)}
html body .mbar.dt-hide{transform:translateY(140%)}
html body .mbar a{border-radius:16px!important;transition:transform .15s}
html body .mbar a:active{transform:scale(.95)}
html body .mbar .m1{background:var(--dte-or)!important;color:var(--dte-navy)!important;box-shadow:0 8px 18px rgba(255,122,26,.35)}
html body .mbar .m2{background:#119a62!important;color:#fff!important}html body .mbar .m2 svg{stroke:#fff}
@media(max-width:900px){.dt-up{bottom:92px}html body #cb.cb{bottom:86px!important}}

/* ===== v2: 7 · שדות טופס חיים: זוהר בפוקוס ואימות חזותי ===== */
html body form.lead input:not([type=checkbox]):not([type=hidden]),html body form.lead textarea{border-radius:14px;transition:border-color .2s,box-shadow .2s,background .2s}
html body form.lead input:focus:not([type=checkbox]),html body form.lead textarea:focus{border-color:var(--dte-or)!important;box-shadow:0 0 0 5px rgba(255,122,26,.2)}
html body form.lead input:not([type=checkbox]):not(:placeholder-shown):user-valid,html body form.lead textarea:not(:placeholder-shown):user-valid{border-color:#2fb87a!important}
html body form.lead input:user-invalid,html body form.lead textarea:user-invalid{border-color:#ff6b6b!important;animation:dtshk .35s}
@keyframes dtshk{25%{transform:translateX(5px)}75%{transform:translateX(-5px)}}
html body form.lead button[type=submit]:active{transform:scale(.97)}
@media (prefers-reduced-motion:reduce){.dt-prog i,html body .mbar{transition:none!important}html body form.lead input:user-invalid{animation:none}}

/* ===== v3: 8 · פופאפ תוכן: כרטיס זכוכית עם כניסה קפיצית ===== */
html body .dtp-bd{background:rgba(4,9,22,.7)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:dtfade .35s}
html body .dtpop{background:linear-gradient(160deg,#12204a,#0a1228 70%)!important;border:1px solid var(--dte-line)!important;border-radius:26px!important;
  box-shadow:0 40px 100px rgba(0,0,0,.65)!important;color:#fff;position:relative;overflow:hidden}
html body .dtpop::before{content:"";position:absolute;top:0;inset-inline:0;height:4px;background:linear-gradient(90deg,var(--dte-or),var(--dte-ye))}
html body .dtp-dlg .dtpop{animation:dtpop .55s cubic-bezier(.2,1.15,.3,1)}
html body .dtp-sl .dtpop{animation:dtpup .5s cubic-bezier(.2,1.15,.3,1)}
html body .dtp-x{transition:transform .35s,background .2s!important}html body .dtp-x:hover{transform:rotate(90deg)}
html body .dtp-t{font-weight:900;letter-spacing:-.01em}
html body .dtp-go{background:var(--dte-or)!important;color:var(--dte-navy)!important;border-radius:14px!important;font-weight:800;box-shadow:0 10px 24px rgba(255,122,26,.4)!important}
html body .dtpop input:not([type=checkbox]){border-radius:14px;transition:border-color .2s,box-shadow .2s}
html body .dtpop input:not([type=checkbox]):focus{border-color:var(--dte-or)!important;box-shadow:0 0 0 5px rgba(255,122,26,.2)}
@keyframes dtfade{from{opacity:0}}
@keyframes dtpop{from{opacity:0;transform:translateY(40px) scale(.93)}}
@keyframes dtpup{from{opacity:0;transform:translateY(60px)}}

/* ===== v3: 9 · כפתורי CTA כתומים: ברק עדין ===== */
html body .pill.or{position:relative;overflow:hidden;isolation:isolate}
html body .pill.or::after{content:"";position:absolute;top:0;bottom:0;width:38%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);pointer-events:none;z-index:-1;animation:dtshine 5s 2s infinite}
html body .pill.or:hover::after{animation:none;left:130%;transition:left .7s ease}
@keyframes dtshine{0%{left:-60%}22%,100%{left:130%}}

/* ===== v3: 10 · תפריט נייד: כניסה מדורגת ===== */
html body .mm[open] .mmp{animation:dtmm .4s cubic-bezier(.2,1,.3,1);transform-origin:top left}
html body .mm[open] .mmq a{animation:dtmi .5s backwards cubic-bezier(.2,1,.3,1)}
html body .mm[open] .mmq a:nth-child(2){animation-delay:.05s}html body .mm[open] .mmq a:nth-child(3){animation-delay:.1s}html body .mm[open] .mmq a:nth-child(4){animation-delay:.15s}
html body .mm[open] .mmg,html body .mm[open] .mmcta{animation:dtmi .5s .2s backwards cubic-bezier(.2,1,.3,1)}
@keyframes dtmm{from{opacity:0;transform:translateY(-10px) scale(.96)}}
@keyframes dtmi{from{opacity:0;transform:translateY(12px)}}
@media (prefers-reduced-motion:reduce){html body .dtpop,html body .dtp-bd,html body .mm[open] .mmp,html body .mm[open] .mmq a,html body .mm[open] .mmg,html body .mm[open] .mmcta,html body .pill.or::after{animation:none!important}}
html.a11y-motion body .pill.or::after,html.a11y-motion body .dtpop{animation:none!important}

/* ===== v4: תיקונים לפי משוב (10.11.2026) ===== */
/* וואטסאפ: כדור עגול פועם בלבד (בלי הרחבה שמכסה את הצ'אט), התווית כבועה מעל */
html body a.wa.dt-wa:hover,html body a.wa.dt-wa:focus-visible{width:58px!important}
html body a.wa.dt-wa .dt-wa-l{position:absolute;bottom:calc(100% + 10px);left:0;padding:8px 14px;background:var(--dte-ink);border:1px solid var(--dte-line);border-radius:12px;font-size:14px;transform:translateY(6px);pointer-events:none;box-shadow:0 10px 24px rgba(0,0,0,.45)}
html body a.wa.dt-wa:hover .dt-wa-l,html body a.wa.dt-wa:focus-visible .dt-wa-l{opacity:1;transform:none;transition-delay:0s}
/* חזרה למעלה: לא בנייד */
@media(max-width:900px){html body .dt-up{display:none!important}}
/* באנר עוגיות: צר וקצר, לא מסתיר את העמוד */
html body #cb.cb{max-width:380px!important;padding:11px 14px 12px!important;gap:8px!important;border-radius:16px!important;bottom:12px!important}
html body #cb.cb .cbt b{display:none!important}
html body #cb.cb .cbt p{font-size:13px!important;line-height:1.45!important}
html body #cb.cb .cba{gap:6px}
html body #cb.cb .cba button{min-height:38px!important;font-size:14px!important;border-radius:11px!important;padding:4px 10px!important}
html body #cb.cb .cba .lk{min-height:24px!important;font-size:12.5px!important;flex:1 0 100%!important}
html body #cb.cb .cbo{margin-top:8px;font-size:13px}
html body #cb.cb .cbo label{padding:6px 10px}
@media(max-width:900px){html body #cb.cb{padding:10px 12px!important;max-width:none!important}}
/* סטריפ ראשי בבית (תהליך הלידים): קטן יותר */
html body .dtf{font-size:clamp(14px,2.5cqw,18px)!important;gap:.7em!important}
html body .dtf-w{max-width:min(540px,100%)!important}
/* עקיפת width של dt-wide (selector חזק יותר) */
html body:has(#cb:not([hidden])) #cb.cb{width:min(380px,calc(100vw - 20px))!important;max-width:380px!important}
@media(max-width:900px){html body:has(#cb:not([hidden])) #cb.cb{width:auto!important;max-width:none!important}}

/* ===== v5 (10.11.2026): ציר תהליך מתעורר בגלילה + שדרוג עדין לשדות הטופס. עיצוב בלבד ===== */
/* ציר "איך זה עובד": רק כשה-JS סימן .dt-tl; בלי JS הכול נראה כרגיל */
html body main .s26-flow.dt-tl .s26-step{opacity:.42;transition:opacity .5s,transform .35s,border-color .5s}
html body main .s26-flow.dt-tl .s26-step.dt-on{opacity:1;border-color:rgba(255,122,26,.45)}
html body main .s26-flow.dt-tl .s26-step.dt-on .s26-num{animation:dtpop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes dtpop{from{transform:scale(.6)}}
/* טופס: תווית נצבעת בפוקוס, שדה מלא מקבל קו כתום, תיבת הסכמה בצבעי המותג */
html body form.lead div:has(>input:focus,>textarea:focus)>label{color:var(--dte-or,#ff7a1a);transition:color .2s}
html body form.lead input:not([type=checkbox]):not([type=hidden]):not(:placeholder-shown):not(:user-invalid),html body form.lead textarea:not(:placeholder-shown):not(:user-invalid){background-image:linear-gradient(270deg,#ff7a1a,#ffce26);background-repeat:no-repeat;background-size:3px 100%;background-position:right 0 top 0}
html body form.lead textarea{resize:vertical;min-height:84px}
html body form.lead .consent input[type=checkbox]{accent-color:#ff7a1a}
@media (prefers-reduced-motion:reduce){html body main .s26-flow.dt-tl .s26-step{transition:none}html body main .s26-flow.dt-tl .s26-step.dt-on .s26-num{animation:none}}
html.a11y-motion body main .s26-flow.dt-tl .s26-step.dt-on .s26-num{animation:none}