/* ============================================================
   taltool.com: תוספות לאתר המלא, על בסיס דף הנחיתה (site.css)
   ============================================================ */

/* ---------- תפריט ראשי ---------- */
.main-nav{display:flex;align-items:center;gap:6px;order:1;margin-inline-start:clamp(20px,3vw,48px)}
.nav-link{font:inherit;font-weight:700;font-size:.98rem;color:var(--ink);background:none;border:0;cursor:pointer;
  padding:10px 14px;border-radius:999px;display:inline-flex;white-space:nowrap;align-items:center;gap:6px;transition:background .25s,color .25s}
.nav-link:hover,.nav-link[aria-current="page"],.nav-group.open .nav-drop-btn{background:var(--cloud-2);color:var(--brand)}
.nav-drop-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.nav-group{position:relative}
.nav-group.open .nav-drop-btn svg{transform:rotate(180deg)}
.nav-drop{position:absolute;inset-inline-start:0;top:calc(100% + 10px);min-width:300px;padding:10px;border-radius:20px;
  background:var(--paper,#fff);border:1px solid var(--line);box-shadow:0 24px 60px rgba(10,10,30,.25);
  display:grid;gap:4px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s,transform .25s,visibility .25s;z-index:60}
.nav-group.open .nav-drop{opacity:1;visibility:visible;transform:none}
.nav-drop a{display:grid;gap:2px;padding:12px 14px;border-radius:14px;transition:background .2s}
.nav-drop a:hover,.nav-drop a[aria-current="page"]{background:var(--cloud-2)}
.nav-drop b{font-weight:800;color:var(--ink)}
.nav-drop span{font-size:.88rem;color:var(--muted)}
:root[data-theme="dark"] .nav-drop{background:#171927}
.nav-burger{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--cloud-2);cursor:pointer;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;order:4;margin-inline-start:12px}
.nav-burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--ink);transition:transform .3s,opacity .3s}
.nav-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-open .nav-burger span:nth-child(2){opacity:0}
.nav-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1280px){
  .topbar .tagline{display:none}
  .topbar .nav-cta span{display:none}
  .topbar .nav-cta{width:44px;height:44px;padding:0;justify-content:center;flex-shrink:0}
}
@media(max-width:900px){
  .nav-burger{display:flex}
  .main-nav{position:fixed;inset:72px 0 auto 0;flex-direction:column;align-items:stretch;gap:2px;margin:0;padding:16px 20px 24px;
    background:var(--paper,#fff);border-block-end:1px solid var(--line);box-shadow:0 30px 60px rgba(10,10,30,.25);
    opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .25s,transform .25s,visibility .25s;max-height:calc(100dvh - 72px);overflow:auto}
  :root[data-theme="dark"] .main-nav{background:#11131d}
  .nav-open .main-nav{opacity:1;visibility:visible;transform:none}
  .nav-link{font-size:1.15rem;padding:14px 12px;justify-content:space-between;width:100%}
  .nav-drop{position:static;min-width:0;box-shadow:none;border:0;padding:0 8px;background:none;display:none;opacity:1;visibility:visible;transform:none}
  .nav-group.open .nav-drop{display:grid}
  :root[data-theme="dark"] .nav-drop{background:none}
}

/* ---------- פוטר ---------- */
.fnav{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:center;font-weight:700;font-size:.95rem}
.fnav a{color:var(--ink-soft)}
.fnav a:hover{color:var(--brand)}

/* ---------- הירו לעמודים פנימיים ---------- */
.page-hero{position:relative;overflow:hidden;padding-block:clamp(150px,20vh,210px) clamp(50px,8vh,90px)}
.page-hero .wrap{position:relative;z-index:2}
.page-hero .sec-tag{display:inline-block;margin-block-end:14px}
.page-hero h1{font-size:clamp(2.6rem,6.6vw,6.6rem);font-weight:800;line-height:1.02;letter-spacing:-.035em;max-width:16ch;text-wrap:balance}
.page-hero h1 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero p.lead{font-size:clamp(1.1rem,1.7vw,1.4rem);color:var(--ink-soft);max-width:52ch;margin-block:24px 34px}
.page-hero::after{content:"";position:absolute;width:640px;height:640px;inset-block-start:-180px;inset-inline-end:-160px;border-radius:50%;
  background:radial-gradient(circle,rgba(123,47,247,.32),rgba(0,194,203,.14) 45%,transparent 70%);filter:blur(30px);z-index:0;pointer-events:none}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;font-size:.86rem;font-weight:700;
  background:var(--cloud-2);color:var(--ink-soft);border:1px solid var(--line)}

/* ---------- "במה אני יכול לעזור" ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
@media(max-width:760px){.svc-grid{grid-template-columns:1fr}}
.svc{position:relative;display:flex;flex-direction:column;gap:14px;padding:clamp(26px,3vw,40px);border-radius:28px;overflow:hidden;
  background:var(--paper,#fff);border:1px solid var(--line);transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s,border-color .45s;min-height:300px}
:root[data-theme="dark"] .svc{background:rgba(255,255,255,.035)}
.svc:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(10,10,40,.28);border-color:rgba(123,47,247,.45)}
.svc::before{content:"";position:absolute;width:360px;height:360px;inset-block-end:-200px;inset-inline-start:-120px;border-radius:50%;
  background:radial-gradient(circle,rgba(123,47,247,.28),transparent 65%);opacity:0;transition:opacity .45s}
.svc:hover::before{opacity:1}
.svc .svc-q{font-weight:800;font-size:.95rem;color:var(--brand)}
.svc h3{font-size:clamp(1.7rem,2.6vw,2.4rem);font-weight:800;letter-spacing:-.02em;line-height:1.1}
.svc p{color:var(--ink-soft);font-size:1.05rem;max-width:40ch}
.svc .svc-go{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--ink)}
.svc .svc-go svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;transition:transform .35s}
.svc:hover .svc-go svg{transform:translateX(-6px)}
.svc .svc-num{position:absolute;inset-block-start:22px;inset-inline-end:26px;font-weight:800;font-size:4.5rem;line-height:1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.18}

/* ---------- פלייסהולדר אחיד ---------- */
.ph-box{position:relative;display:grid;place-items:center;text-align:center;overflow:hidden;border-radius:20px;
  background:linear-gradient(135deg,rgba(0,194,203,.16),rgba(123,47,247,.2));border:1px dashed rgba(157,78,221,.45);color:var(--ink-soft)}
.ph-box .ph-in{display:grid;gap:6px;padding:14px;font-weight:700;font-size:.9rem}
.ph-box .ph-in b{font-size:1.05rem;color:var(--ink)}
.ph-box .ph-in small{font-weight:600;opacity:.75}

/* ---------- קיר לוגואים ---------- */
.logo-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:clamp(10px,1.4vw,18px)}
.logo-tile{position:relative;aspect-ratio:1;border-radius:22px;overflow:hidden;cursor:pointer;border:1px solid var(--line);
  background:var(--paper,#fff);display:grid;place-items:center;transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s}
:root[data-theme="dark"] .logo-tile{background:rgba(255,255,255,.04)}
.logo-tile .lt-mark{font-weight:800;font-size:clamp(1.05rem,1.5vw,1.35rem);letter-spacing:.02em;color:var(--ink);text-align:center;padding:12px}
.logo-tile img{width:70%;height:70%;object-fit:contain}
.logo-tile .lt-info{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:16px;
  background:linear-gradient(to top,rgba(14,10,40,.92),rgba(14,10,40,.25) 70%,transparent);color:#fff;opacity:0;transition:opacity .35s}
.logo-tile .lt-info b{font-size:1rem}
.logo-tile .lt-info span{font-size:.8rem;opacity:.85;line-height:1.35}
.logo-tile:hover,.logo-tile:focus-visible{transform:translateY(-4px) rotate(-1deg);box-shadow:0 20px 50px rgba(10,10,40,.3)}
.logo-tile:hover .lt-info,.logo-tile:focus-visible .lt-info{opacity:1}
.logo-tile.is-ph{background:linear-gradient(135deg,rgba(0,194,203,.1),rgba(123,47,247,.14))}

/* ---------- חבילת מיתוג ---------- */
.brand-pack{margin-block-start:clamp(50px,7vw,90px)}
.bp-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 30px;margin-block-end:24px}
.bp-head h3{font-size:clamp(1.9rem,3.6vw,3.2rem);font-weight:800;letter-spacing:-.025em;line-height:1.05}
.bp-head .bp-sub{color:var(--muted);font-weight:700;margin-block-start:6px}
.bp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(130px,13vw,210px);gap:clamp(10px,1.3vw,18px)}
.bp-grid .ph-box{height:100%}
.bp-grid .bp-logo{grid-column:span 2;grid-row:span 2}
.bp-grid .bp-wide{grid-column:span 2}
.bp-grid .bp-tall{grid-row:span 2}
.bp-logo .ph-in b{font-size:clamp(1.6rem,3vw,2.6rem);letter-spacing:.04em}
@media(max-width:760px){.bp-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:150px}}
.bp-quote{margin-block-start:18px;padding:22px 26px;border-radius:20px;background:var(--cloud-2);font-size:1.08rem;color:var(--ink-soft)}
.bp-quote b{display:block;margin-block-start:8px;font-size:.92rem;color:var(--ink)}

/* ---------- מערכות מותאמות ---------- */
.stuck-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
@media(max-width:860px){.stuck-list{grid-template-columns:1fr}}
.stuck{padding:clamp(24px,2.6vw,34px);border-radius:24px;border:1px solid var(--line);background:var(--paper,#fff)}
:root[data-theme="dark"] .stuck{background:rgba(255,255,255,.035)}
.stuck .q{font-size:1.25rem;font-weight:800;line-height:1.3}
.stuck .q::before{content:"״";display:block;font-size:3rem;line-height:.6;color:var(--brand);margin-block-end:8px}
.stuck .a{margin-block-start:14px;padding-block-start:14px;border-top:1px dashed var(--line);color:var(--ink-soft);font-weight:600}
.stuck .a b{color:var(--brand)}
.stuck .a a{color:inherit;text-decoration:none;transition:opacity .2s}
.stuck .a a:hover{opacity:.75}

.case-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,60px);align-items:center;margin-block-end:clamp(50px,7vw,100px)}
.case-row:nth-child(even){direction:ltr}
.case-row:nth-child(even)>*{direction:rtl}
@media(max-width:860px){.case-row,.case-row:nth-child(even){grid-template-columns:1fr;direction:rtl}}
.case-row .ph-box{aspect-ratio:16/11}
.case-row h3{font-size:clamp(1.8rem,3.2vw,2.8rem);font-weight:800;letter-spacing:-.02em;line-height:1.08;margin-block:12px}
.case-row p{color:var(--ink-soft);font-size:1.08rem;max-width:46ch}
.case-row .case-meta{display:grid;gap:10px;margin-block-start:18px}
.case-row .case-meta div{display:flex;gap:10px;align-items:baseline}
.case-row .case-meta b{min-width:84px;color:var(--brand);font-size:.9rem}

/* ---------- רווח לסקשנים חדשים ---------- */
.block{padding-block:clamp(60px,9vw,130px)}
.block-tight{padding-block:clamp(40px,6vw,80px)}
.center-cta{text-align:center;margin-block-start:clamp(30px,4vw,50px)}
.btn-ghost{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:999px;font-weight:800;
  border:1.5px solid var(--line);color:var(--ink);transition:border-color .3s,background .3s}
.btn-ghost:hover{border-color:var(--brand);background:var(--cloud-2)}

/* ---------- דף הבית: פרקים שממשיכים זה את זה ---------- */
.chapter{position:relative;padding-block:clamp(30px,5vw,70px) clamp(60px,8vw,110px)}
.ch-line{display:block;width:100%;height:auto;overflow:visible;margin-block-end:clamp(4px,1vw,14px)}
.ch-line.flip{transform:scaleX(-1)}
.ch-line path{fill:none;stroke:url(#chGrad);stroke-linecap:round}
.ch-line .c1{stroke-width:3;opacity:.85}
.ch-line .c2{stroke-width:1.4;opacity:.45;transform:translate(0,9px)}
html.has-motion .ch-line path{visibility:hidden}
.ch-head{display:flex;align-items:flex-start;gap:clamp(14px,2.4vw,36px)}
.ch-head .sec-head{margin-block-end:clamp(30px,4vh,50px)}
.ch-num{flex:none;font-weight:800;font-size:clamp(4rem,10vw,9.5rem);line-height:.8;letter-spacing:-.05em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.9;padding-block-start:6px}
@media(max-width:640px){.ch-head{flex-direction:column;gap:6px}.ch-num{font-size:4.2rem}}
.chapter.portfolio{background:none}
.logo-wall-mini{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:760px){.logo-wall-mini{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* UX/UI */
.ux-cards{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:auto auto;gap:clamp(14px,1.8vw,24px)}
.ux-card{display:flex;flex-direction:column;border-radius:26px;overflow:hidden;border:1px solid var(--line);background:var(--paper,#fff);
  transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s}
:root[data-theme="dark"] .ux-card{background:rgba(255,255,255,.035)}
.ux-card:first-child{grid-row:span 2}
.ux-card:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(10,10,40,.28)}
.ux-img{display:block;overflow:hidden;background:#eef1f7;flex:1;min-height:180px}
.ux-img img{width:100%;height:100%;object-fit:cover;object-position:top right;transition:transform .6s}
.ux-card:hover .ux-img img{transform:scale(1.04)}
.ux-txt{display:grid;gap:6px;padding:20px 24px 24px}
.ux-txt b{font-size:1.5rem;font-weight:800;letter-spacing:-.01em}
.ux-txt span:last-child{color:var(--ink-soft)}
.ux-co{font-size:.85rem;font-weight:800;color:var(--brand)}
@media(max-width:860px){.ux-cards{grid-template-columns:1fr}.ux-card:first-child{grid-row:auto}}

/* מערכות מותאמות */
.tool-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,24px);margin-block-start:clamp(24px,3vw,40px)}
@media(max-width:860px){.tool-cards{grid-template-columns:1fr;row-gap:clamp(40px,10vw,56px)}}
.tool-card{display:grid;gap:8px}
.tool-card .ph-box{aspect-ratio:4/3;margin-block-end:8px}
.tool-card .tc-img{display:block;aspect-ratio:4/3;margin-block-end:8px;border-radius:20px;overflow:hidden}
.tool-card .tc-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tool-card .tc-img:hover img{transform:scale(1.04)}
.tool-card b{font-size:1.35rem;font-weight:800}
.tool-card p{color:var(--ink-soft)}

/* וידאו */
.vid-row,.vid-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.vid-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
@media(max-width:860px){.vid-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.vid{display:grid;gap:10px}
.vid-img{position:relative;display:block;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#111}
.vid-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s,filter .5s;filter:saturate(.9)}
.vid:hover .vid-img img{transform:scale(1.06);filter:saturate(1.1)}
.vid-play{position:absolute;inset:0;margin:auto;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.92);box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .35s}
.vid-play svg{width:24px;height:24px;fill:#7b2ff7;margin-inline-start:-3px}
.vid:hover .vid-play{transform:scale(1.12)}
.vid-t{font-weight:700;color:var(--ink)}

/* ---------- עבודות: סינון ורשת ---------- */
.wfilter{display:flex;flex-wrap:wrap;gap:10px;margin-block-end:clamp(24px,3vw,40px)}
.wf{font:inherit;font-weight:800;font-size:.98rem;padding:11px 20px;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:all .25s}
.wf i{font-style:normal;font-size:.8rem;opacity:.6;margin-inline-start:4px}
.wf:hover{border-color:var(--brand)}
/* origin על כל הקופסה, אחרת הגרדיאנט חוזר מתחת לגבול השקוף ויוצר פס בקצה */
.wf.on{background:var(--grad) border-box;border-color:transparent;color:#fff;box-shadow:0 6px 18px -8px rgba(123,47,247,.55)}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
@media(max-width:980px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.pgrid{grid-template-columns:1fr}}
.pcard{display:flex;flex-direction:column;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:var(--paper,#fff);
  transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s,opacity .35s}
:root[data-theme="dark"] .pcard{background:rgba(255,255,255,.035)}
.pcard:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(10,10,40,.28)}
.pcard.is-hidden{display:none}
.pcard-img{display:block;aspect-ratio:16/11;overflow:hidden;background:#e9ecf3}
.pcard-img img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .6s}
.pcard:hover .pcard-img img{transform:scale(1.05)}
.pcard-img .ph-box{height:100%;border-radius:0;border:0}
.pcard-txt{display:grid;gap:8px;padding:18px 20px 22px}
.pcard-txt b{font-size:1.3rem;font-weight:800}
.pcard-txt>span:last-child{color:var(--muted);font-size:.95rem}
.pcard .chip{padding:4px 10px;font-size:.76rem}

/* ---------- עמוד פרויקט ---------- */
.pj-hero h1{font-size:clamp(2.4rem,6vw,5.6rem);margin-block:14px 0}
.pj-back{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--muted);margin-block-end:18px}
.pj-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.pj-back:hover{color:var(--brand)}
.pj-meta{display:flex;flex-wrap:wrap;gap:12px 40px;margin-block:0 28px}
.pj-meta dt{font-size:.82rem;font-weight:800;color:var(--brand)}
.pj-meta dd{margin:2px 0 0;font-weight:700}
.pj-cover{border-radius:28px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9;background:#e9ecf3}
.pj-cover video{display:block}
.pj-cover img,.pj-cover video{width:100%;height:100%;object-fit:cover;object-position:top}
.pj-cover .ph-box{height:100%;border-radius:0}
.pj-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.4vw,18px);margin-block-start:clamp(10px,1.4vw,18px)}
.pj-gallery .ph-box{aspect-ratio:4/3}
@media(max-width:700px){.pj-gallery{grid-template-columns:1fr 1fr}}
.pj-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,70px);margin-block:clamp(40px,6vw,80px)}
@media(max-width:800px){.pj-cols{grid-template-columns:1fr}}
.pj-cols h2{font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:800;margin-block-end:14px}
.pj-cols p{font-size:1.1rem;color:var(--ink-soft)}
.pj-did{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.pj-did li{position:relative;padding-inline-start:28px;font-size:1.05rem;color:var(--ink-soft)}
.pj-did li::before{content:"";position:absolute;inset-inline-start:0;top:.55em;width:12px;height:12px;border-radius:4px;background:var(--grad)}
.pj-quote{margin:0 0 clamp(40px,6vw,70px);padding:clamp(26px,3vw,40px);border-radius:26px;background:var(--cloud-2);font-size:clamp(1.15rem,1.8vw,1.5rem);font-weight:700;line-height:1.5}
.pj-quote cite{display:block;margin-block-start:14px;font-style:normal;font-size:.95rem;color:var(--brand);font-weight:800}
/* ניווט בין פרויקטים: שני כרטיסים עם תמונה קטנה */
.pj-nav{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,24px);margin-top:clamp(40px,6vw,72px)}
.pj-nb{display:flex;flex-direction:column;border-radius:20px;border:1px solid var(--line);overflow:hidden;background:var(--cloud-2);transition:border-color .3s,transform .3s}
.pj-nb:hover{border-color:var(--brand);transform:translateY(-3px)}
.pj-nb-img{display:block;aspect-ratio:16/10;overflow:hidden;background:#111}
.pj-nb-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.pj-nb:hover .pj-nb-img img{transform:scale(1.05)}
.pj-nb-img .ph-box{height:100%}
.pj-nb-txt{display:flex;flex-direction:column;gap:4px;padding:14px 16px 16px}
.pj-nb small{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:.82rem;font-weight:700}
.pj-nb.next small{justify-content:flex-end}
.pj-nb.next .pj-nb-txt{text-align:end}
.pj-nb small svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pj-nb.prev small svg{order:-1}
.pj-nb b{font-size:clamp(1rem,1.6vw,1.25rem);font-weight:800;line-height:1.3}

/* ---------- UX ומערכות: שורות פרויקט ---------- */
.case-img{display:block;border-radius:26px;overflow:hidden;background:transparent;aspect-ratio:16/10}
.case-img img{width:100%;height:100%;object-fit:cover;object-position:top right;transition:transform .7s}
.case-img:hover img{transform:scale(1.04)}
.case-img .ph-box{height:100%;border-radius:0;aspect-ratio:auto}
.case-row .btn-ghost{margin-block-start:20px}
.stuck-list.plain .q::before{display:none}

/* ---------- אודות וצור קשר ---------- */
.about-page-top{height:40px}
.contact-hero{min-height:70vh}
.contact-ways{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-block:10px 24px}
.contact-ways .btn-wa{font-size:1.15rem;padding:20px 36px}
.cw{display:grid;gap:2px;padding:14px 22px;border-radius:18px;border:1px solid var(--line);transition:border-color .3s}
.cw:hover{border-color:var(--brand)}
.cw span{font-size:.82rem;font-weight:800;color:var(--brand)}
.cw b{font-size:1.1rem}
.contact-note{color:var(--muted);font-weight:600}
.btn-ghost{white-space:nowrap}
.btn-ghost svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* ---------- גלריית פרויקט ---------- */
.pj-gallery.has-img{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,22px);margin-block-start:clamp(12px,1.6vw,22px)}
.pj-shot{position:relative;margin:0;border-radius:22px;overflow:hidden;border:1px solid var(--line);background:#e9ecf3}
.pj-shot.wide{grid-column:1/-1}
.pj-shot img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:3/2}
.pj-shot.wide img{aspect-ratio:auto}
.pj-shot figcaption{position:absolute;inset-block-end:12px;inset-inline-start:12px;padding:6px 12px;border-radius:999px;font-size:.82rem;font-weight:800;
  background:rgba(12,10,30,.72);color:#fff;backdrop-filter:blur(6px)}
@media(max-width:640px){.pj-gallery.has-img{grid-template-columns:1fr}}
.logo-tile.has-logo{background:#fff}
:root[data-theme="dark"] .logo-tile.has-logo{background:#f4f5fb}
.logo-tile.has-logo img{width:72%;height:62%;object-fit:contain}
.logo-tile.has-mock img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.logo-tile.has-mock:hover img{transform:scale(1.06)}
.bp-shot{position:relative;margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:#e9ecf3;height:100%}
.bp-shot img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
.bp-shot:hover img{transform:scale(1.04)}
.bp-shot figcaption{position:absolute;inset-block-end:10px;inset-inline-start:10px;padding:5px 11px;border-radius:999px;font-size:.78rem;font-weight:800;background:rgba(12,10,30,.72);color:#fff}
.bp-logo-white{background:#fff;display:grid;place-items:center}
.bp-logo-white img{width:70%;height:70%;object-fit:contain}
.bp-grid .bp-shot.bp-wide{grid-column:span 2}

/* כותרת לקוראי מסך ולגוגל בלבד */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* חמש הזרועות של פתרונות AI */
.ai-arms{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(12px,1.4vw,20px)}
.ai-arm{padding:clamp(22px,2.2vw,30px);border-radius:var(--radius);border:1px solid var(--line);background:var(--paper,#fff);
  transition:transform .45s cubic-bezier(.22,1,.36,1),border-color .45s,box-shadow .45s}
:root[data-theme="dark"] .ai-arm{background:rgba(255,255,255,.035)}
.ai-arm:hover{transform:translateY(-4px);border-color:var(--brand-2);box-shadow:var(--shadow)}
.ai-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--grad-soft);margin-block-end:16px}
:root[data-theme="dark"] .ai-ic{background:rgba(0,194,203,.1)}
.ai-ic svg{width:24px;height:24px;fill:none;stroke:var(--brand-2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ai-arm b{display:block;font-size:1.15rem;font-weight:800}
.ai-arm p{margin-block-start:8px;color:var(--muted);line-height:1.6;font-size:.98rem}
.ai-arms.compact{margin-block-end:clamp(24px,3vw,40px)}
.ai-arms.compact .ai-arm{text-align:center;padding:22px 14px}
.ai-arms.compact .ai-ic{margin-inline:auto;margin-block-end:12px}
@media(max-width:1100px){.ai-arms{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.ai-arms{grid-template-columns:1fr 1fr}.ai-arms .ai-arm:last-child{grid-column:1/-1}}

/* סליידר הווידאו בבית: אותו כרטיס כמו האתרים, עם כפתור ניגון */
.vwork .thumb{background:#111}
.vwork .thumb-link:hover .vid-play{transform:scale(1.1)}
/* עמוד הווידאו: אותם כרטיסים ברשת */
.portfolio.vid-page{background:none}
.vwork-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,2.6vw,40px);padding-block:20px}
@media(max-width:980px){.vwork-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.vwork-grid{grid-template-columns:1fr}}

/* ---------- מובייל: אייקונים עגולים באותו גובה, בלי וואטסאפ למעלה, תפריט על כל המסך ---------- */
.nav-wa{display:none}
@media(max-width:900px){
  .topbar .nav-cta{display:none}
  .topbar .wrap{align-items:center}
  .topbar .theme-toggle,.nav-burger{width:44px;height:44px;flex:0 0 44px;margin:0;top:0;align-self:center;border-radius:50%;align-items:center;justify-content:center}
  .topbar .theme-toggle{order:2;margin-inline-start:auto}
  .nav-burger{order:3;margin-inline-start:10px;flex-direction:column;gap:5px}
  .nav-burger span{width:18px;margin:0}
  .nav-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  /* כשהתפריט פתוח, הכותרת מפסיקה להיות מסגרת לתפריט כדי שיכסה את כל המסך */
  body.nav-open{overflow:hidden}
  .nav-open .topbar{backdrop-filter:none;-webkit-backdrop-filter:none;background:transparent;box-shadow:none;border-color:transparent}
  .main-nav{position:fixed;inset:0;z-index:-1;height:100dvh;max-height:none;margin:0;padding:110px 28px 40px;
    display:flex;flex-direction:column;align-items:stretch;gap:4px;overflow-y:auto;border:0;box-shadow:none;
    background:radial-gradient(60% 40% at 15% 10%,rgba(123,47,247,.16),transparent 70%),radial-gradient(50% 35% at 90% 95%,rgba(0,194,203,.14),transparent 70%),var(--paper,#fff);
    opacity:1;visibility:hidden;transform:none;
    clip-path:circle(0 at 44px 38px);transition:clip-path .6s cubic-bezier(.77,0,.18,1),visibility 0s .6s}
  :root[data-theme="dark"] .main-nav{background:radial-gradient(60% 40% at 15% 10%,rgba(123,47,247,.28),transparent 70%),radial-gradient(50% 35% at 90% 95%,rgba(0,194,203,.18),transparent 70%),#0d0e16}
  .nav-open .main-nav{visibility:visible;clip-path:circle(150% at 44px 38px);transition:clip-path .7s cubic-bezier(.77,0,.18,1),visibility 0s}

  .main-nav>*{opacity:0;transform:translateY(24px);transition:opacity .3s,transform .3s}
  .nav-open .main-nav>*{opacity:1;transform:none;transition:opacity .5s,transform .6s cubic-bezier(.22,1,.36,1)}
  .nav-open .main-nav>*:nth-child(1){transition-delay:.25s}
  .nav-open .main-nav>*:nth-child(2){transition-delay:.32s}
  .nav-open .main-nav>*:nth-child(3){transition-delay:.39s}
  .nav-open .main-nav>*:nth-child(4){transition-delay:.46s}
  .nav-open .main-nav>*:nth-child(5){transition-delay:.56s}

  .nav-link{font-size:clamp(1.7rem,8vw,2.2rem);font-weight:800;padding:14px 4px;border-radius:0;justify-content:space-between;width:100%;
    border-block-end:1px solid var(--line);background:none!important}
  :root[data-theme="dark"] .nav-link{border-color:rgba(255,255,255,.08)}
  .nav-link[aria-current="page"],.nav-group.open .nav-drop-btn{color:var(--brand)}
  .nav-drop-btn svg{width:26px;height:26px}
  .nav-drop{position:static;min-width:0;box-shadow:none;border:0;padding:6px 0 10px;background:none!important;
    display:grid;opacity:1;visibility:visible;transform:none;max-height:0;overflow:hidden;padding-block:0;transition:max-height .45s cubic-bezier(.22,1,.36,1),padding .45s}
  .nav-group.open .nav-drop{max-height:520px;padding-block:8px 12px}
  .nav-drop a{padding:10px 4px}
  .nav-drop b{font-size:1.1rem}

  .nav-wa{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:auto;padding:18px 24px;border-radius:999px;
    background:var(--whatsapp);color:#fff;font-weight:800;font-size:1.1rem;box-shadow:0 14px 34px rgba(37,211,102,.35)}
  .nav-wa svg{width:22px;height:22px;fill:#fff}
}
@media(max-width:900px) and (prefers-reduced-motion:reduce){
  .main-nav,.main-nav>*{transition:none!important}
}
/* כשהתפריט פתוח, הכפתורים הצפים מתחבאים כדי לא לכסות אותו */
.sticky-cta,.wa-float{transition:opacity .3s,visibility .3s}
.nav-open .sticky-cta,.nav-open .wa-float,.nav-open #enable-toolbar-trigger{opacity:0!important;visibility:hidden!important;pointer-events:none}

/* פוטר במובייל: הכול ממורכז, הלוגו ראשון */
@media (max-width:900px){
  footer .wrap{flex-direction:column;justify-content:center;text-align:center}
  footer .brand-mark{margin-inline:auto}
  footer .fnav,footer .fcontact,footer .legal-links{justify-content:center}
}
/* במובייל הכותרת נשארת בדיוק כמו בראש הדף גם בזמן גלילה */
@media (max-width:900px){
  .topbar.scrolled{box-shadow:none;border-block-end-color:transparent}
  :root[data-theme="dark"] .topbar.scrolled{background:rgba(15,16,24,.85)}
}

/* ===== איורי רקע לראש עמודי השירות: מראים את התחום, בעדינות ===== */
.has-art{isolation:isolate}
.hero-art{position:absolute;z-index:1;pointer-events:none;width:min(560px,44vw);height:auto;
  inset-block-start:50%;inset-inline-end:clamp(-40px,2vw,60px);translate:0 -46%;opacity:.42;
  -webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent);mask-image:radial-gradient(closest-side,#000 62%,transparent)}
:root[data-theme="dark"] .hero-art{opacity:.5}
.hero-art *{transform-box:fill-box}
.hero.has-art .hero-art{display:none}
@media(max-width:900px){
  .hero-art{width:118vw;max-width:560px;inset-block-start:64px;inset-inline-end:-34vw;translate:0 0;opacity:.26}
  :root[data-theme="dark"] .hero-art{opacity:.34}
}
@media(max-width:640px){.hero.has-art .hero-art{display:block}}

@keyframes artFloat{50%{translate:0 -12px}}
.hero-art .fl{animation:artFloat 9s ease-in-out infinite}
.hero-art .f2{animation-duration:11s;animation-delay:-3s}
.hero-art .f3{animation-duration:13s;animation-delay:-6s}

/* אתרים: הבלוקים נבנים אחד אחרי השני, וסמן העכבר מסתובב ביניהם */
@keyframes artBuild{0%,6%{opacity:0;scale:.6 1}16%,82%{opacity:1;scale:1}94%,100%{opacity:0;scale:1}}
.art-web .bld{transform-origin:right center;animation:artBuild 9s cubic-bezier(.22,1,.36,1) infinite}
.art-web .b2{animation-delay:.25s}.art-web .b3{animation-delay:.5s}.art-web .b4{animation-delay:.75s}
.art-web .b5{animation-delay:1s}.art-web .b6{animation-delay:1.25s}.art-web .b7{animation-delay:1.5s}.art-web .b8{animation-delay:1.75s}
@keyframes artCursor{0%,100%{translate:300px 220px}25%{translate:110px 220px}50%{translate:300px 480px}75%{translate:480px 430px}}
.art-web .cur{animation:artCursor 12s ease-in-out infinite}

/* מיתוג: הגריד מסתובב לאט, והעקומה מצטיירת */
@keyframes artSpin{to{rotate:360deg}}
.art-brand .spin{transform-origin:center;animation:artSpin 80s linear infinite}
.art-brand .spin.rev{animation-duration:120s;animation-direction:reverse}
@keyframes artDraw{0%{stroke-dashoffset:100}45%,75%{stroke-dashoffset:0}100%{stroke-dashoffset:-100}}
.art-brand .draw{stroke-dasharray:100;animation:artDraw 10s ease-in-out infinite}
@keyframes artPulse{50%{opacity:.35}}
.art-brand .pulse{animation:artPulse 6s ease-in-out infinite}.art-brand .p2{animation-delay:-3s}
.art-brand .hnd{animation:artPulse 10s ease-in-out infinite}

/* UX: לחיצה על כפתור, והזרימה רצה למסך הבא */
@keyframes artTap{0%{scale:.3;opacity:.9}70%,100%{scale:2.2;opacity:0}}
.art-ux .tap{transform-origin:center;animation:artTap 2.4s ease-out infinite}
@keyframes artFlow{to{stroke-dashoffset:-48}}
.art-ux .flow{stroke-dasharray:6 10;animation:artFlow 2s linear infinite}

/* AI: פולסים עוברים ברשת, והצמתים נדלקים */
@keyframes artSig{0%{stroke-dashoffset:110}100%{stroke-dashoffset:-10}}
.art-ai .sig path{stroke-dasharray:10 110;animation:artSig 4s cubic-bezier(.5,0,.5,1) infinite}
.art-ai .s2{animation-delay:-1.4s}.art-ai .s3{animation-delay:-2.7s}
.art-ai .nodes circle{animation:artPulse 3s ease-in-out infinite}
.art-ai .n2{animation-delay:-1s}.art-ai .n3{animation-delay:-2s}
.art-ai .spark{transform-origin:center;animation:artSpin 18s linear infinite}

/* וידאו: סמן הניגון רץ על הטיימליין, והגל זז */
@keyframes artHead{0%{translate:50px 0}100%{translate:540px 0}}
.art-video .playhead{animation:artHead 8s linear infinite}
@keyframes artWave{50%{scale:1 .45}}
.art-video .wave{transform-origin:bottom;animation:artWave 1.6s ease-in-out infinite}

@media(prefers-reduced-motion:reduce){.hero-art,.hero-art *{animation:none!important}}

/* במגע אין ריחוף: בלי זה, החלקה בסליידר "מדליקה" hover והכרטיס מתיישר, עולה והכפתור גדל, וזה נראה כמו קפיצה */
@media (hover:none){
  .portfolio .work:hover{transform:none;box-shadow:var(--shadow-sm)}
  .portfolio .work:nth-child(odd):hover{rotate:-2deg}
  .portfolio .work:nth-child(even):hover{rotate:1.8deg}
  .work a.thumb-link:hover img,.vwork .thumb-link:hover .vid-play,.vid:hover .vid-play{transform:none}
}

/* אודות: שלושה עקרונות, אייקון + כותרת קצרה + שורה אחת */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,22px)}
.pillar{position:relative;display:flex;align-items:center;gap:16px;padding:20px 22px;border-radius:20px;border:1px solid var(--line);background:var(--paper,#fff);overflow:hidden}
:root[data-theme="dark"] .pillar{background:rgba(255,255,255,.035)}
.pillar-ic{flex:0 0 52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--grad);box-shadow:0 8px 20px -10px rgba(123,47,247,.6)}
.pillar-ic svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pillar>div{padding-inline-end:18px}
.pillar b{display:block;font-size:1.08rem;font-weight:800;line-height:1.3}
.pillar p{margin:4px 0 0;color:var(--ink-soft);font-size:.95rem;line-height:1.5}
.pillar-n{position:absolute;inset-block-start:8px;inset-inline-end:14px;font-weight:800;font-size:.8rem;color:var(--muted);opacity:.6}
@media(max-width:860px){.pillars{grid-template-columns:1fr}}

/* עמוד פתרונות AI: כל תחום כרטיס מלא, והכרטיסים נערמים זה על זה בגלילה */
.ai-arms.stacked{display:flex;flex-direction:column;gap:clamp(18px,5vh,48px);max-width:900px;margin-inline:auto}
.ai-arms.stacked .ai-arm{position:sticky;top:calc(96px + var(--i,0) * 16px);display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(16px,3vw,36px);min-height:clamp(200px,28vh,260px);padding:clamp(26px,4vw,48px);border-radius:28px;
  background:#fff;box-shadow:0 -1px 0 rgba(0,0,0,.03),0 24px 50px -30px rgba(30,20,60,.35)}
:root[data-theme="dark"] .ai-arms.stacked .ai-arm{background:#171826;box-shadow:0 -1px 0 rgba(255,255,255,.04),0 24px 50px -24px rgba(0,0,0,.7)}
.ai-arms.stacked .ai-arm:nth-child(even){background:linear-gradient(135deg,#f6f0ff,#eafcfc)}
:root[data-theme="dark"] .ai-arms.stacked .ai-arm:nth-child(even){background:linear-gradient(135deg,#1d1730,#122428)}
.ai-arms.stacked .ai-arm:hover{transform:none}
.ai-arms.stacked .ai-ic{width:72px;height:72px;border-radius:22px;margin:0;order:3}
.ai-arms.stacked .ai-ic svg{width:34px;height:34px}
.ai-arms.stacked .ai-n{font-size:clamp(3.2rem,2rem + 4vw,6rem);font-weight:800;line-height:.8;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ai-arms.stacked h3{font-size:clamp(1.6rem,1.2rem + 1.8vw,2.6rem);font-weight:800;line-height:1.15;margin:0 0 .3em}
.ai-arms.stacked p{margin:0;color:var(--ink-soft);font-size:clamp(1rem,.95rem + .3vw,1.15rem);line-height:1.6;max-width:44ch}
@media(max-width:700px){
  .ai-arms.stacked .ai-arm{grid-template-columns:1fr;gap:12px;top:calc(86px + var(--i,0) * 12px);min-height:0;padding:26px 24px 28px}
  .ai-arms.stacked .ai-ic{position:absolute;inset-block-start:22px;inset-inline-end:22px;width:56px;height:56px;border-radius:18px}
  .ai-arms.stacked .ai-ic svg{width:26px;height:26px}
}

/* צור קשר: כרטיסי טלפון ומייל עם אייקון. במובייל כל כפתור בשורה שלמה */
.cw{display:flex;align-items:center;gap:14px}
.cw-t{display:grid;gap:2px}
.cw-ic{flex:0 0 44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--grad-soft)}
:root[data-theme="dark"] .cw-ic{background:rgba(123,47,247,.16)}
.cw-ic svg{width:20px;height:20px;fill:none;stroke:var(--brand);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){
  .contact-ways{flex-direction:column;align-items:stretch;gap:12px;margin-block:8px 28px}
  .contact-ways .btn-wa{justify-content:center;margin-block-end:12px}
  .cw{padding:14px 18px}
}

/* תהליכים בשלבים במובייל: הכרטיסים נערמים זה על זה בגלילה, כמו בעמוד פתרונות AI */
@media(max-width:760px){
  .steps-flow{overflow:clip}
  .flow,.stuck-list.plain{display:flex;flex-direction:column;align-items:stretch;gap:22px}
  .flow-step,.stuck-list.plain .stuck{position:sticky;top:calc(92px + var(--i,0) * 12px);max-width:none;min-height:170px;
    box-shadow:0 -1px 0 rgba(0,0,0,.03),0 22px 44px -26px rgba(30,20,60,.4)}
  .stuck-list.plain .stuck{background:#fff}
  :root[data-theme="dark"] .stuck-list.plain .stuck{background:#171826;box-shadow:0 -1px 0 rgba(255,255,255,.04),0 22px 44px -22px rgba(0,0,0,.7)}
  :root[data-theme="dark"] .flow-step{box-shadow:0 -1px 0 rgba(255,255,255,.04),0 22px 44px -22px rgba(0,0,0,.7)}
  .flow-step:nth-child(2),.stuck-list.plain .stuck:nth-child(2){--i:1}
  .flow-step:nth-child(3),.stuck-list.plain .stuck:nth-child(3){--i:2}
  .flow-step:nth-child(4){--i:3}
}

/* הקלדת הכותרת בעמודים הפנימיים */
.tw-on .tw-ch{visibility:hidden}
.tw-on .tw-ch.tw-in{visibility:visible}
.tw-caret{display:inline-block;width:0;position:relative;vertical-align:baseline}
.tw-caret::after{content:"";position:absolute;inset-inline-start:.06em;bottom:-.08em;height:.92em;width:.07em;min-width:3px;border-radius:2px;background:var(--grad);animation:twBlink 1s steps(1) infinite}
.tw-caret.tw-done{opacity:0;transition:opacity .5s}
@keyframes twBlink{50%{opacity:0}}

/* כרטיסי וידאו: הקישור ממלא את כל התמונה מההתחלה.
   בלי זה הוא מתכווץ ל-7px עד שהתמונה נטענת, וכפתור הפליי קופץ כשגוללים */
.vwork a.thumb-link{position:absolute;inset:0;height:auto}
.vwork .thumb img{position:absolute;inset:0}

/* כפתור פליי: זכוכית לבנה, משולש מעוגל בגרדיאנט, וטבעת שנושמת */
.vid-play{width:64px;height:64px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 12px 30px -8px rgba(123,47,247,.55),inset 0 0 0 1px rgba(255,255,255,.7);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.vid-play::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid rgba(255,255,255,.6);animation:playRing 2.8s ease-out infinite}
@keyframes playRing{0%{transform:scale(.88);opacity:.9}70%,100%{transform:scale(1.22);opacity:0}}
/* המשולש ממורכז אופטית בתוך ה-viewBox עצמו, אז בלי הזזות ב-CSS */
.vid-play svg{width:36px;height:36px;margin:0;fill:url(#playGrad);overflow:visible}
@media(hover:hover){.vwork .thumb-link:hover .vid-play,.vid:hover .vid-play{transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.vid-play::before{animation:none;opacity:0}}

/* כפתור התפריט: שלושה קווים בגרדיאנט באורכים שונים, שמדי פעם עוברים בהם גל.
   בפתיחה העיגול מתמלא בגרדיאנט, הכפתור מסתובב והקווים הופכים ל-X לבן */
#navBurger{position:relative;overflow:hidden;isolation:isolate;align-items:flex-start;justify-content:center;gap:4.5px;padding:0 12px;
  transition:rotate .6s cubic-bezier(.34,1.56,.64,1),border-color .3s}
#navBurger::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--grad);transform:scale(0);transition:transform .5s cubic-bezier(.77,0,.18,1);z-index:-1}
#navBurger span{width:var(--w);height:2.5px;border-radius:3px;margin:0;background:var(--grad);
  transition:width .45s cubic-bezier(.68,-.6,.32,1.6),transform .5s cubic-bezier(.77,0,.18,1),opacity .3s,background .3s;
  animation:burgerWave 6s ease-in-out infinite}
#navBurger span:nth-child(1){--w:20px}
#navBurger span:nth-child(2){--w:13px;animation-delay:.12s}
#navBurger span:nth-child(3){--w:7px;animation-delay:.24s}
@keyframes burgerWave{0%,78%,100%{width:var(--w)}86%{width:20px}}
@media(hover:hover){#navBurger:hover span{width:20px}}
.nav-open #navBurger{rotate:180deg;border-color:transparent}
.nav-open #navBurger::before{transform:scale(1)}
.nav-open #navBurger span{width:20px;background:#fff;animation:none}
.nav-open #navBurger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-open #navBurger span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-open #navBurger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(prefers-reduced-motion:reduce){#navBurger span{animation:none}}

/* =====================================================================
   פחות AI (22/10/2026)
   בלי תוויות קטנות מעל כותרות, בלי מסגרות דקות וצללים על דברים שלא זזים,
   כפתורים בצבע אחד, כותרות בצבע אחד, בלי קישוטים. הגרדיאנט נשאר בלוגו,
   בחבילה המומלצת, בכפתור הפליי ובתפריט הפתוח בלבד.
   ===================================================================== */
:root,:root[data-theme="dark"]{--line:transparent;--shadow-sm:none;--shadow:none;--shadow-lg:none}
:root{--grad-soft:#f1edfc;--card:#eceef5}
:root[data-theme="dark"]{--grad-soft:#1d1a30;--card:#1b1d2c}

/* תוויות מעל כותרות: יורדות. בראש העמוד ובפרקים של דף הבית הן נשארות, כטקסט רגיל ולא כתווית */
.sec-head .sec-tag,.final-eyebrow{display:none}
.page-hero .sec-tag,.hero .hero-tag,.ch-head .sec-head .sec-tag{display:block;font-size:1.05rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--brand)!important;margin-block-end:12px}
.hero-trust{border:0}

/* כפתורי הוואטסאפ: טקסט כהה, כי לבן על ירוק בהיר לא קריא */
.btn-wa,.btn-wa:hover,.topbar .nav-cta,.sticky-cta .btn-wa,.nav-wa{box-shadow:none;color:#05290f}
.btn-wa svg,.topbar .nav-cta svg,.nav-wa svg{fill:#05290f}
.plan:not(.featured) .btn-wa,:root[data-theme="dark"] .plan:not(.featured) .btn-wa{background:var(--ink);color:var(--paper);box-shadow:none}
.plan:not(.featured) .btn-wa svg{fill:var(--paper)}

/* כרטיסים: משטח בגוון אחד מהרקע, בלי מסגרת, בלי צל ובלי זכוכית */
.acc,.gcard,.plan,.flow-step,.svc,.pcard,.logo-tile,.stuck,.pillar,.cw,.ai-arm,.pj-nb,.work,.vcard,.suited-card,.safety-card,
:root[data-theme="dark"] :is(.acc,.gcard,.plan,.flow-step,.svc,.pcard,.logo-tile,.stuck,.pillar,.cw,.ai-arm,.pj-nb,.work,.vcard,.suited-card,.safety-card){
  border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.acc,.gcard,.plan,.flow-step,.svc,.pcard,.stuck,.pillar,.cw,.work,.vcard,
:root[data-theme="dark"] :is(.acc,.gcard,.plan,.flow-step,.svc,.pcard,.stuck,.pillar,.cw,.work,.vcard){background:var(--card)}
.portfolio .work:hover,.work:hover{box-shadow:none}
.stuck .a{border-top:0}
.vid-play{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff}

/* מספור דקורטיבי */
.ch-num,.pillar-n,.ai-n{display:none}
.ai-arms.stacked .ai-arm{grid-template-columns:1fr auto}
.ch-head{gap:0}

/* קישוטים: נשאר המטוס בראש העמוד ובסיום, והפס הרץ עם היהלומים. כל השאר יורד */
.squig,.ch-line,.final-badge{display:none}
.steps-flow::before,.steps-flow::after,.pricing::before,.pricing::after,.page-hero::after{display:none}

/* טקסט קטן מדי */
.brand-mark .tagline span{font-size:.82rem}
.brand-mark .tagline b{font-size:.9rem}

/* כותרות שנשברו ל-3 ו-4 שורות בטלפון */
@media(max-width:480px){
  .hero h1{font-size:2.3rem;line-height:1.12}
  .page-hero h1{font-size:2.35rem}
  .sec-head h2{font-size:2.05rem;max-width:none}
}

/* למי זה מתאים: רשימה אחת בכתב גדול */
.suited-words{font-size:clamp(1.9rem,1.2rem + 3.2vw,4rem);font-weight:800;line-height:1.12;letter-spacing:-.03em;color:var(--ink);
  max-width:24ch;margin:clamp(8px,2vw,24px) auto 0;text-align:center;text-wrap:balance}

/* מה סגור לפני שמתחילים: כותרת בצד, רשימה בכתב גדול */
.promise{background:var(--cloud)}
.promise-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.promise-head{position:sticky;top:120px}
.promise-head h2{font-size:clamp(2.2rem,4.4vw,4rem);font-weight:800;line-height:1.04;letter-spacing:-.03em;margin:0 0 18px;text-wrap:balance}
.promise-head p{font-size:clamp(1.05rem,1.3vw,1.2rem);color:var(--ink-soft);max-width:36ch;margin:0}
.promise-list{list-style:none;margin:0;padding:0;display:grid;gap:clamp(22px,3vw,36px)}
.promise-list li{font-size:clamp(1.15rem,1rem + .7vw,1.5rem);line-height:1.45;color:var(--ink-soft)}
.promise-list b{color:var(--ink);font-weight:800}
@media(max-width:860px){.promise-grid{grid-template-columns:1fr}.promise-head{position:static}}

/* הכרטיסים הנערמים בטלפון באמת צפים זה מעל זה, אז שם הצל נשאר */
@media(max-width:760px){
  .flow .flow-step,.stuck-list.plain .stuck{box-shadow:0 22px 44px -26px rgba(30,20,60,.4)}
  :root[data-theme="dark"] .flow .flow-step,:root[data-theme="dark"] .stuck-list.plain .stuck{box-shadow:0 22px 44px -22px rgba(0,0,0,.7)}
}
/* עיגולים וריבועים של אייקונים: צבע אחד במקום גרדיאנט */
.pillar-ic,.flow-step .n{background:var(--brand);box-shadow:none}
.suited-words{list-style:none;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.15em .55em;font-size:clamp(1.5rem,1rem + 1.9vw,2.6rem);max-width:30ch}
.suited-words li:not(:last-child)::after{content:"·";margin-inline-start:.55em;color:var(--brand)}
.work .meta .tag{font-size:.9rem}
.ribbon{box-shadow:none;font-size:.85rem}
.work .visit{-webkit-backdrop-filter:none;backdrop-filter:none}
.final{background-image:none!important}
footer{border-block-start:0}
.plan .ribbon,.plan.featured .ribbon{box-shadow:none}
.final::after{display:none}
/* הכפתור הראשי בגרדיאנט של המותג גם במצב כהה (בקשת טל) */
.btn-primary,:root[data-theme="dark"] .btn-primary{background:var(--grad);color:#fff}
.vid-play{box-shadow:0 0 0 1px rgba(0,0,0,.04)}
.ph-box{background:var(--grad-soft)!important}
.ai-arms.stacked .ai-arm:nth-child(even),:root[data-theme="dark"] .ai-arms.stacked .ai-arm:nth-child(even){background:var(--card)}
.ap-glow{display:none}
footer,:root[data-theme="dark"] footer{border:0!important}

/* ביקורת בעמוד פרויקט: תמונת הממליץ ליד הציטוט, כמו באתר הקודם */
.pj-quote{display:flex;align-items:flex-start;gap:clamp(16px,2.4vw,28px);background:var(--card)}
.pj-quote p{margin:0}
.pj-quote-img{flex:0 0 auto;width:clamp(64px,7vw,88px);height:auto;aspect-ratio:1;border-radius:50%;object-fit:cover}
@media(max-width:560px){.pj-quote{flex-direction:column;gap:14px}}

/* גלריית פרויקט: מזוניירי, בלי מסגרות, והכיתוב כטקסט רגיל מתחת לתמונה */
.pj-cover{border:0;background:none;border-radius:16px}
.pj-gallery.has-img{display:block;columns:2;column-gap:clamp(14px,2vw,28px)}
.pj-shot{border:0;background:none;border-radius:0;overflow:visible;break-inside:avoid;margin:0 0 clamp(18px,2.4vw,32px)}
.pj-shot.wide{column-span:all}
.pj-shot img,.pj-shot.wide img{height:auto;aspect-ratio:auto;object-fit:contain;border-radius:14px}
.pj-shot figcaption{position:static;padding:10px 2px 0;border-radius:0;background:none;color:var(--muted);font-size:.95rem;font-weight:600;-webkit-backdrop-filter:none;backdrop-filter:none}
@media(max-width:640px){.pj-gallery.has-img{columns:1}}

/* מספרים נספרים: ספרות ברוחב קבוע כדי שהשורה לא תקפוץ בזמן הספירה */
.hero-trust .t b,.gscore .rate{font-variant-numeric:tabular-nums}
/* התמונה הראשית של פרויקט נכפתה ל-16:9 ונחתכה. עכשיו היא מוצגת ביחס המקורי שלה */
.pj-cover{aspect-ratio:auto}
.pj-cover img,.pj-cover video{height:auto;object-fit:contain}
.pj-cover:has(.ph-box){aspect-ratio:16/9}

/* ממליץ בלי תמונה: האות הראשונה של השם, באותו עיגול */
.pj-quote-ini{display:grid;place-items:center;background:var(--brand);color:#fff;font-weight:800;font-size:clamp(1.6rem,2.6vw,2.2rem)}

/* חבילות המיתוג בעמוד המיתוג: אותה גלריה כמו בעמודי הפרויקטים */
.bp-grid{display:block;columns:3;column-gap:clamp(14px,1.8vw,24px)}
.bp-grid .bp-shot,.bp-grid .bp-shot.bp-wide{height:auto;border:0;background:none;border-radius:0;overflow:visible;break-inside:avoid;margin:0 0 clamp(16px,2vw,26px)}
.bp-shot img{height:auto;object-fit:contain;border-radius:14px}
.bp-shot:hover img{transform:none}
.bp-shot figcaption{position:static;padding:10px 2px 0;border-radius:0;background:none;color:var(--muted);font-size:.95rem;font-weight:600}
.bp-grid .bp-logo-white{display:grid;place-items:center;aspect-ratio:4/3;background:#fff;border-radius:14px}
.bp-grid .bp-logo-white img{width:70%;height:70%;border-radius:0}
@media(max-width:760px){.bp-grid{columns:2}}
@media(max-width:480px){.bp-grid{columns:1}}
.bp-quote{display:flex;align-items:flex-start;gap:clamp(16px,2.4vw,26px);background:var(--card)}
.bp-quote p{margin:0}

/* כפתור הנגישות (תוסף חיצוני) ישב על פס הוואטסאפ הדביק. בטלפון הוא עולה מעליו */
@media(max-width:880px){#enable-toolbar-trigger{translate:0 -84px!important}}

/* איורי רקע נוספים: עבודות, צור קשר ודף הבית */
@keyframes artLit{0%,8%,100%{stroke-width:1.5;opacity:.55}3%{stroke-width:3.2;opacity:1}}
.art-work .fr{animation:artLit 9s ease-in-out infinite}
.art-work .fr1{animation-delay:1s}.art-work .fr2{animation-delay:2s}.art-work .fr3{animation-delay:3s}.art-work .fr4{animation-delay:4s}
.art-work .fr5{animation-delay:5s}.art-work .fr6{animation-delay:6s}.art-work .fr7{animation-delay:7s}.art-work .fr8{animation-delay:8s}
@keyframes artDot{0%,60%,100%{translate:0 0;opacity:.5}30%{translate:0 -12px;opacity:1}}
.art-contact .dot{animation:artDot 1.4s ease-in-out infinite}.art-contact .d2{animation-delay:.18s}.art-contact .d3{animation-delay:.36s}
.art-contact .route{animation:artFlow 3s linear infinite}
@keyframes artFly{0%{offset-distance:0%;opacity:0}8%,88%{opacity:1}100%{offset-distance:100%;opacity:0}}
.art-contact .plane{offset-path:path('M60 520C160 470 220 560 320 500S470 430 560 470');offset-rotate:auto;animation:artFly 6s ease-in-out infinite}
.art-home .bld{transform-origin:right center;animation:artBuild 9s cubic-bezier(.22,1,.36,1) infinite}
.art-home .b3{animation-delay:.3s}.art-home .b5{animation-delay:.6s}.art-home .b7{animation-delay:.9s}
.art-home .draw{stroke-dasharray:100;animation:artDraw 10s ease-in-out infinite}
.art-home .tap{transform-origin:center;animation:artTap 2.4s ease-out infinite}
.art-home .sig{stroke-dasharray:10 110;animation:artSig 4s cubic-bezier(.5,0,.5,1) infinite}.art-home .s2{animation-delay:-2s}

/* הספרות שהספירה עוטפת ב-span קיבלו בטעות את העיצוב של הכיתוב הקטן מתחת למספר */
.hero-trust .t b span{font-size:inherit;color:inherit;font-weight:inherit;margin:0}
.hero-trust .t b{font-size:clamp(2rem,1.6rem + 1.2vw,2.6rem);letter-spacing:-.02em}
.hero-trust{gap:clamp(22px,4vw,44px)}

/* רקע ל"ככה זה עובד": מהשיחה הראשונה, לאורך הדרך, ועד אתר באוויר */
.steps-flow .wrap{position:relative;z-index:1}
.steps-art{position:absolute;z-index:0;pointer-events:none;inset-block:clamp(40px,6vw,90px);inset-inline-end:clamp(-60px,-2vw,0px);width:min(380px,40vw);height:calc(100% - clamp(80px,12vw,180px));opacity:.32}
:root[data-theme="dark"] .steps-art{opacity:.4}
.steps-art *{transform-box:fill-box}
.steps-art .fl{animation:artFloat 9s ease-in-out infinite}.steps-art .f2{animation-duration:11s;animation-delay:-4s}
.steps-art .dot{animation:artDot 1.4s ease-in-out infinite}.steps-art .d2{animation-delay:.18s}.steps-art .d3{animation-delay:.36s}
.steps-art .route{animation:artFlow 3s linear infinite}
.steps-art .runner{offset-path:path('M200 240C60 330 340 430 200 520S60 700 200 790');animation:artFly 7s ease-in-out infinite}
.steps-art .draw{stroke-dasharray:100;animation:artDraw 7s ease-in-out infinite}
@media(max-width:760px){.steps-art{width:78vw;inset-inline-end:-30vw;opacity:.28}}
@media(prefers-reduced-motion:reduce){.steps-art *{animation:none!important}}

/* החבילות בטלפון: גלילה למטה מזיזה אותן הצידה, כך שכל אחת עוברת מול העיניים */
@media(max-width:820px){
  .pricing.h-pin .plans{display:flex;flex-wrap:nowrap;max-width:none;width:max-content;gap:16px;padding-inline:calc((100vw - min(82vw,360px))/2);margin:0}
  .pricing.h-pin .plan{flex:0 0 min(82vw,360px)}
  .plans-dots{display:flex;justify-content:center;gap:8px;margin-block-start:18px}
  .plans-dots i{width:8px;height:8px;border-radius:50%;background:var(--muted);opacity:.4;transition:width .3s,opacity .3s,background .3s}
  .plans-dots i.on{width:24px;border-radius:4px;background:var(--brand);opacity:1}
}
.plans-dots{display:none}
.pricing.h-pin .plans-dots{display:flex}

/* דף מקרה: פרטי התפקיד, מספרים, ואז פרקים קצרים של טקסט ותמונות */
.cs-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,3vw,40px);margin:clamp(36px,5vw,64px) 0 0}
.cs-meta dt{color:var(--muted);font-weight:700;font-size:.95rem;margin-block-end:6px}
.cs-meta dd{margin:0;font-size:1.05rem;line-height:1.55;color:var(--ink-soft)}
.cs-stats{margin-block:clamp(30px,4vw,52px) 0;padding:clamp(22px,3vw,34px) 0 0}
.cs-sec{margin-block-start:clamp(56px,8vw,110px)}
.cs-txt{max-width:62ch}
.cs-txt h2{font-size:clamp(1.7rem,1.2rem + 1.8vw,2.7rem);font-weight:800;line-height:1.12;letter-spacing:-.025em;margin:0 0 14px;text-wrap:balance}
.cs-txt p{font-size:clamp(1.05rem,1rem + .3vw,1.2rem);line-height:1.65;color:var(--ink-soft);margin:0}
.cs-points{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.cs-points li{font-size:1.15rem;font-weight:700;color:var(--ink);padding-inline-start:22px;position:relative}
.cs-points li::before{content:"";position:absolute;inset-inline-start:0;top:.5em;width:10px;height:10px;border-radius:3px;background:var(--brand)}
.cs-qa{margin:24px 0 0;display:grid;gap:20px}
.cs-qa dt{font-weight:800;font-size:1.15rem;color:var(--ink);margin-block-end:4px}
.cs-qa dd{margin:0;color:var(--ink-soft);line-height:1.6}
.cs-imgs{margin-block-start:clamp(22px,3vw,36px)}
.cs-imgs.one{columns:1}
@media(max-width:760px){.cs-meta{grid-template-columns:1fr;gap:18px}}
/* רווח אחרי הכרטיסים הנערמים, לפני מה שבא אחריהם */
.ai-arms.stacked{margin-block-end:clamp(56px,10vw,110px)}
.pj-links{display:flex;flex-wrap:wrap;gap:12px}
/* חבילות המחירים ישרות, בלי ההטיה */
.plan,.plan:nth-child(odd),.plan:nth-child(even),.plan:hover{rotate:0deg}

/* סרט הלוגואים: כל לוגו בכרטיס משלו, ובמרכז המסך הוא מתכווץ לפינה ומגלה את המוקאפ שמאחוריו */
.logo-reel{position:relative;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:clamp(28px,4vw,48px);--lr-in:calc(max(0px,(100% - var(--maxw)) / 2) + clamp(20px,5vw,40px));scroll-padding-inline:var(--lr-in)}
.logo-reel::-webkit-scrollbar{display:none}
.lr-track{display:flex;gap:clamp(16px,2.4vw,32px);width:max-content;padding-inline-start:var(--lr-in);padding-inline-end:calc(100vw - var(--lr-in) - var(--lr-w));--lr-w:min(46vw,640px)}
.lr-slide{flex:none;width:var(--lr-w);display:block;color:inherit;text-decoration:none;scroll-snap-align:start}
.lr-card{position:relative;display:block;aspect-ratio:3/2;border-radius:22px;overflow:hidden;background:var(--card)}
.lr-mock{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lr-logo{position:absolute;inset:0;display:grid;place-items:center;background:#fff;border-radius:22px;transform-origin:100% 100%;transform:translate(-14px,-14px) scale(.32);will-change:transform}
.lr-logo img{width:62%;height:56%;object-fit:contain}
.lr-slide:hover .lr-mock{scale:1.04}
.lr-mock{transition:scale .6s cubic-bezier(.2,.7,.2,1)}
.lr-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:16px 4px 0}
.lr-cap b{font-size:clamp(1.1rem,1.6vw,1.35rem)}
.lr-cap span{color:var(--muted)}
.lr-cap small{flex-basis:100%;color:var(--muted);font-size:.92rem}
.lr-nav{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2vw,24px);margin-block-start:clamp(24px,3vw,36px)}
.lr-bar{height:3px;border-radius:3px;background:var(--card);overflow:hidden;width:min(240px,40vw)}
.lr-bar i{display:block;height:100%;background:var(--brand);transform:scaleX(0);transform-origin:100% 50%}
@media (max-width:820px){.lr-track{--lr-w:80vw}.lr-card,.lr-logo{border-radius:16px}.lr-logo{transform:translate(-10px,-10px) scale(.34)}}
#ch-brand .center-cta{margin-top:clamp(28px,4vw,44px)}

/* כפתור הסגירה בחלונות המדיניות נשאר גלוי גם כשגוללים את הטקסט */
.modal-close{position:sticky;inset-block-start:0;float:left;margin:-14px -10px 0 0;z-index:2;background:var(--cloud-2)}

/* מסכי טלפון בדף מקרה (פינק פארק): שורה של מכשירים במקום צילומי מסך ענקיים. בטלפון מחליקים לצדדים */
.cs-phones{display:flex;gap:clamp(18px,3vw,40px);justify-content:safe center;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:clamp(22px,3vw,36px) 4px 12px;margin-block-start:clamp(8px,1.4vw,18px)}
.cs-phones::-webkit-scrollbar{display:none}
.cs-phone{flex:none;width:clamp(190px,19vw,250px);margin:0;scroll-snap-align:center;text-align:center}
.cs-phone img{display:block;width:100%;height:auto;border:7px solid #0e0e14;border-radius:34px;box-shadow:0 22px 48px rgba(20,10,40,.28);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.cs-phone:hover img{transform:translateY(-6px)}
.cs-phone figcaption{padding-top:14px;color:var(--muted);font-size:.95rem;font-weight:600}
@media(max-width:640px){.cs-phone{width:62vw}}
@media(prefers-reduced-motion:reduce){.cs-phone img{transition:none}.cs-phone:hover img{transform:none}}

/* בעמוד פרויקט: צבע הדגשה מהמיתוג של הלקוח (accent ב-projects.json) במקום הסגול של הסטודיו */
[style*="--pj"] .pj-meta dt{color:var(--pj)}
[style*="--pj"] .cs-stats .t b{background:none;color:var(--pj);-webkit-text-fill-color:var(--pj)}
[style*="--pj"] .cs-points li::before{background:var(--pj)}
[style*="--pj"] .pj-did li::before{background:var(--pj)}

/* סליידר מסכים רחבים בדף מקרה (ספארק): כל מסך כמעט ברוחב מלא, החלקה או חצים */
.cs-slider{margin-block-start:clamp(22px,3vw,36px)}
.cs-track{display:flex;gap:clamp(14px,2vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-block-end:6px}
.cs-track::-webkit-scrollbar{display:none}
.cs-slide{flex:none;width:min(86%,900px);margin:0;scroll-snap-align:start}
.cs-slide img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 18px 44px rgba(20,10,40,.22)}
.cs-slide figcaption{padding-top:12px;color:var(--muted);font-size:.95rem;font-weight:600}
.cs-nav{display:flex;justify-content:center;gap:16px;margin-block-start:clamp(16px,2vw,24px)}
.cs-nav .snav:disabled{opacity:.35;cursor:default;transform:none}
@media(max-width:640px){.cs-slide{width:88%}}

/* קודם רואים: טופס לבקשת דמו בעמוד בניית אתרים (Netlify Forms) */
.demo-grid{display:grid;grid-template-columns:1fr minmax(0,460px);gap:clamp(28px,5vw,72px);align-items:start}
.demo-copy h2{font-size:clamp(2rem,1.3rem + 2.6vw,3.3rem);line-height:1.1;margin:0 0 18px}
.demo-copy h2 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.demo-steps{list-style:none;counter-reset:d;padding:0;margin:clamp(24px,3vw,36px) 0 0;display:grid;gap:18px}
.demo-steps li{counter-increment:d;display:grid;grid-template-columns:44px 1fr;column-gap:16px;align-items:start}
.demo-steps li::before{content:counter(d);grid-row:span 2;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;background:var(--grad)}
.demo-steps b{font-size:1.15rem}
.demo-steps span{color:var(--muted)}
.demo-form{display:grid;gap:14px;padding:clamp(22px,3vw,34px);border-radius:24px;background:var(--cloud);border:1px solid var(--cloud-2)}
:root[data-theme="dark"] .demo-form{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.df{display:grid;gap:6px}
.df span{font-weight:700;font-size:.95rem}
.df small{font-weight:500;color:var(--muted)}
.df input,.df select{font:inherit;font-size:1rem;padding:13px 16px;border-radius:14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);width:100%}
:root[data-theme="dark"] .df input,:root[data-theme="dark"] .df select{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#fff}
.df input[dir="ltr"]{text-align:right}
.df input:focus,.df select:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:transparent}
.df-check{display:flex;align-items:center;gap:10px;font-size:.95rem;color:var(--muted);margin-top:-4px;cursor:pointer}
.df-check input{width:18px;height:18px;accent-color:var(--brand)}
.demo-submit{width:100%;margin-top:6px}
.demo-submit[disabled]{opacity:.6;cursor:wait}
.demo-note{text-align:center;color:var(--muted);font-size:.92rem;margin:0}
.demo-ok{text-align:center;display:grid;gap:16px;justify-items:center}
.demo-ok p{margin:0;font-size:1.1rem;line-height:1.5}
.demo-ok b{color:var(--brand)}
.demo-wa{width:100%;justify-content:center}
.demo-legal{font-size:.8rem;color:var(--muted);margin:0;text-align:center}
.demo-legal a{color:inherit;text-decoration:underline}
.demo-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media(max-width:900px){.demo-grid{grid-template-columns:1fr}}
.demo-form [hidden]{display:none!important}
/* תחום העסק: בלי החץ של הדפדפן, אלא חץ באותו קו של שאר האייקונים באתר. האפשרויות בצבעי האתר גם במצב כהה */
.df select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-inline-end:16px;padding-inline-start:46px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237b2ff7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-size:20px;background-position:left 16px center}
:root[data-theme="dark"] .df select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b48cff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:20px;background-position:left 16px center}
.df select option{background:#fff;color:#141420}
:root[data-theme="dark"] .df select option{background:#1d1a30;color:#fff}
.df select:invalid,.df select option[value=""]{color:var(--muted)}

/* מה סגור לפני שמתחילים: רשימת בדיקה לפני יציאה. כל גלילה מסמנת עוד סעיף, והמונה מתמלא עד "מתחילים" */
.promise-list li{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start}
.pr-check{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;border:2px solid var(--brand);background:var(--brand);margin-top:2px;transition:background .35s,border-color .35s,transform .5s cubic-bezier(.3,1.6,.5,1)}
.pr-check svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:0;transition:stroke-dashoffset .45s .1s ease-out}
.pr-meter{margin-top:clamp(28px,4vw,48px)}
.pr-count{display:flex;align-items:baseline;gap:6px;font-weight:800}
.pr-count b{font-size:clamp(3.4rem,6vw,5.4rem);line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.pr-count span{font-size:1.2rem;color:var(--muted)}
.pr-bar{height:6px;border-radius:6px;background:var(--cloud-2);overflow:hidden;max-width:320px;margin-top:14px}
:root[data-theme="dark"] .pr-bar{background:rgba(255,255,255,.08)}
.pr-bar i{display:block;height:100%;width:100%;background:var(--grad);transform-origin:100% 50%;transform:scaleX(1);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.pr-go{margin:16px 0 0;font-weight:800;font-size:1.25rem;color:var(--brand)}
/* מצב התנועה: לפני הגלילה הסעיפים כהים והתיבות ריקות */
html.has-motion .promise.pr-live .promise-list li{opacity:.2;transform:translateY(18px) scale(.97);transform-origin:100% 50%;transition:opacity .4s,transform .6s cubic-bezier(.3,1.5,.5,1)}
html.has-motion .promise.pr-live .promise-list li.on{opacity:1;transform:none}
html.has-motion .promise.pr-live .promise-list li:not(.on) .pr-check{background:transparent;border-color:var(--line);transform:scale(.85)}
:root[data-theme="dark"] .promise.pr-live .promise-list li:not(.on) .pr-check{border-color:rgba(255,255,255,.2)}
html.has-motion .promise.pr-live .promise-list li:not(.on) .pr-check svg{stroke-dashoffset:24}
html.has-motion .promise.pr-live .promise-list li.now b{color:var(--brand)}
html.has-motion .promise.pr-live .pr-go{opacity:0;transform:translateY(10px);transition:opacity .4s,transform .5s cubic-bezier(.3,1.5,.5,1)}
html.has-motion .promise.pr-live.pr-all .pr-go{opacity:1;transform:none}
/* בנעיצה הסקשן ממלא את כל המסך, כדי שלא ייראה מאחוריו העמוד שממשיך לגלול */
@media(min-width:861px){.promise.pr-pin .promise-head{position:static}.promise.pr-pin{min-height:100vh;box-sizing:border-box;display:flex;align-items:center;padding-top:calc(73px + clamp(24px,4vh,48px));padding-bottom:clamp(24px,4vh,48px)}.promise.pr-pin>.wrap{width:100%}}

/* כפתור "לאתר החי" בעמוד פרויקט: מסגרת בצבע המותג של הלקוח, ובמעבר עכבר מתמלא בו */
[style*="--pj"] .pj-links .btn-ghost{border:2px solid var(--pj);color:var(--ink);transition:background .25s,color .25s,transform .25s}
[style*="--pj"] .pj-links .btn-ghost svg{color:var(--pj);transition:color .25s}
[style*="--pj"] .pj-links .btn-ghost:hover{background:var(--pj);border-color:var(--pj);color:#fff}
[style*="--pj"] .pj-links .btn-ghost:hover svg{color:#fff}
.cs-slider .cs-phones{justify-content:flex-start}

/* נגן הסרטונים בתוך האתר */
.vlb{position:fixed;inset:0;z-index:1000;display:none;place-items:center;padding:clamp(12px,4vw,48px);background:rgba(8,8,14,.88);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.vlb.show{display:grid;animation:vlbIn .3s ease-out}
.vlb-in{position:relative;width:min(1100px,100%)}
.vlb-frame{aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.vlb-frame iframe{width:100%;height:100%;border:0;display:block}
.vlb-x{position:absolute;inset-block-end:calc(100% + 12px);inset-inline-start:0;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .2s,transform .2s}
.vlb-x:hover{background:rgba(255,255,255,.18);transform:rotate(90deg)}
.vlb-x svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
@keyframes vlbIn{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.vlb.show{animation:none}.vlb-x:hover{transform:none}}

/* מיתוג לאירועים: רשת הפריטים שמעצבים לאירוע */
.ev-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.ev-item{margin:0;border-radius:20px;overflow:hidden;background:var(--card);display:flex;flex-direction:column}
.ev-item img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ev-item:hover img{transform:scale(1.04)}
.ev-item figcaption{padding:18px 20px 22px;display:grid;gap:6px}
.ev-item b{font-size:1.15rem;font-weight:800;color:var(--ink)}
.ev-item span{color:var(--ink-soft);font-size:.98rem;line-height:1.5}
.bp-head h3 a{color:inherit;text-decoration:none}
.bp-head h3 a:hover{color:var(--pj,var(--brand))}
@media(max-width:860px){.ev-items{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.ev-items{grid-template-columns:1fr}}
/* סליידר תמונות לאירועים, באותו מבנה כמו סליידר האתרים */
.ev-slider{margin-inline:calc(50% - 50vw)}
.ev-track{gap:clamp(14px,1.6vw,24px);padding:10px clamp(20px,5vw,80px) 20px;scroll-padding-inline:clamp(20px,5vw,80px)}
.ev-slide{flex:0 0 clamp(420px,42vw,720px);margin:0;scroll-snap-align:center}
.ev-slide img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius,20px);border:1px solid var(--line)}
.ev-slide figcaption{padding:12px 4px 0;color:var(--muted);font-weight:600;font-size:.98rem}
@media(max-width:760px){.ev-slide{flex-basis:85vw}}
/* כיתוב מתחת לתמונה הראשית בעמוד פרויקט, כמו בגלריה */
.pj-cover-cap{margin:0;padding:10px 2px 0;color:var(--muted);font-size:.95rem;font-weight:600}
/* תמונות האירועים מובילות לעמוד הפרויקט */
.ev-link{display:block;border-radius:var(--radius,20px);overflow:hidden}
.ev-link img{transition:transform .5s}
.ev-link:hover img{transform:scale(1.03)}
.ev-item .ev-link{border-radius:0}
/* שקופית לוגו בסליידר: הלוגו שלם על רקע לבן */
.ev-logo img{object-fit:contain;background:#fff;padding:8%;box-sizing:border-box}
.g-all{text-align:center;margin-block-start:14px;font-size:.92rem}
.g-all a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.g-all a:hover{color:var(--ink)}
/* פרק 04 בדף הבית: כל כרטיס הוא בעיה, ומתחתיה הפתרון שבניתי לה */
.pf-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,24px);margin-block-start:clamp(28px,3.4vw,48px)}
@media(max-width:860px){.pf-cards{grid-template-columns:1fr;gap:22px}}
.pf-card{display:flex;flex-direction:column;padding:12px;border-radius:28px;border:1px solid var(--line);background:var(--card,#fff);color:inherit;text-decoration:none;transition:transform .35s,box-shadow .35s}
.pf-card:hover{transform:translateY(-4px);box-shadow:0 26px 50px -28px rgba(80,40,160,.45)}
.pf-card:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.pf-lbl{display:block;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:var(--brand);margin-block-end:8px}
.pf-q{position:relative;display:block;padding:20px 22px 22px;border-radius:20px;background:color-mix(in srgb,var(--brand) 10%,transparent);min-height:7.4em}
.pf-q::after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:34px;border:11px solid transparent;border-block-start-color:color-mix(in srgb,var(--brand) 10%,transparent)}
.pf-qt{display:block;font-size:1.18rem;font-weight:800;line-height:1.35}
.pf-qt::before{content:"״"}.pf-qt::after{content:"״"}
.pf-img{position:relative;display:block;aspect-ratio:4/3;margin-block-start:22px;border-radius:18px;overflow:hidden}
.pf-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.pf-card:hover .pf-img img{transform:scale(1.04)}
.pf-fix{position:absolute;inset-block-start:12px;inset-inline-start:12px;padding:6px 14px;border-radius:99px;background:var(--brand);color:#fff;font-size:.82rem;font-weight:700}
.pf-body{display:grid;gap:6px;padding:18px 10px 10px}
.pf-body b{font-size:1.35rem;font-weight:800}
.pf-d{color:var(--ink-soft)}
.pf-go{display:inline-flex;align-items:center;gap:6px;margin-block-start:6px;color:var(--brand);font-weight:700}
.pf-go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.pf-card:hover .pf-go svg{transform:translateX(-4px)}
@media(prefers-reduced-motion:reduce){.pf-card,.pf-img img,.pf-go svg{transition:none}.pf-card:hover{transform:none}}
/* הגדלת תמונות בעמודי הפרויקט (דסקטופ) */
img.lbox-zoom{cursor:zoom-in}
.lbox{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:72px 1fr 72px;align-items:center;background:rgba(8,8,16,.92);backdrop-filter:blur(6px)}
.lbox[hidden]{display:none}
html.lbox-open{overflow:hidden}
.lbox-fig{margin:0;display:grid;justify-items:center;gap:14px;min-width:0}
.lbox-fig img{max-width:min(100%,1800px);max-height:84vh;width:auto;height:auto;border-radius:12px;box-shadow:0 30px 80px -30px rgba(0,0,0,.8);background:#fff}
.lbox-fig figcaption{display:flex;gap:16px;color:#e8e8f0;font-size:.95rem}
.lbox-count{color:#9a9ab0;direction:ltr}
.lbox-nav,.lbox-x{width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;display:grid;place-items:center;justify-self:center;transition:background .2s,transform .2s}
.lbox-nav:hover,.lbox-x:hover{background:rgba(255,255,255,.18);transform:scale(1.06)}
.lbox svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lbox-x{position:absolute;inset-block-start:20px;inset-inline-end:20px}
.lbox.single .lbox-nav{visibility:hidden}
@media(prefers-reduced-motion:reduce){.lbox-nav,.lbox-x{transition:none}}