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

@font-face{font-family:Ploni;src:url(assets/ploni-light-aaa.otf);font-weight:300}
@font-face{font-family:Ploni;src:url(assets/ploni-regular-aaa.otf);font-weight:400}
@font-face{font-family:Ploni;src:url(assets/ploni-demibold-aaa.otf);font-weight:600}
@font-face{font-family:Ploni;src:url(assets/ploni-ultrabold-aaa.otf);font-weight:800}

:root{--paper:#f4f3f6;--char:#221E22;--blue:#2403FA;--red:#FF3D3D;--pink:#FFD8D8;--white:#fff}
*{box-sizing:border-box;margin:0}
html,body{height:100%;background:var(--paper);color:var(--char);font-family:Ploni,sans-serif;overscroll-behavior:none}
body{overflow:hidden}
a{color:inherit;text-decoration:none}
i{font-style:normal}

/* ── הגלילה: כל שקף מסך מלא ── */
#deck{height:100svh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth;scrollbar-width:none}
#deck::-webkit-scrollbar{display:none}
.slide{position:relative;height:100svh;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;background:var(--paper);color:var(--char);container-type:size}
.slide.on{z-index:1}

/* ── אנימציות ── */
@keyframes rise{from{opacity:0;transform:translateY(6%)}to{opacity:1;transform:none}}
@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.2)}100%{transform:scale(1)}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes spin{to{rotate:360deg}}
/* אנימציות רצות רק בשקף הפעיל */
.slide:not(.on) .a{animation:none!important;opacity:0}
.a.rise{animation:rise .8s var(--d,.2s) cubic-bezier(.2,.8,.2,1) both}
.a.pop{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both}
.a.fade{animation:fade .8s var(--d,1s) both}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ── פרטי עיתון משותפים ── */
.meta{position:absolute;left:5cqw;top:6cqh;font:800 2.6cqh/1.15 Ploni;letter-spacing:.02em;text-align:left;direction:ltr;z-index:7}
.s-cover .meta.a,.s-cover .foot.a{--d:.6s}
.meta b{display:block;color:var(--blue)}
.foot{position:absolute;right:5cqw;bottom:6cqh;font:600 2.4cqh/1.3 Ploni;z-index:7}
.foot b{color:var(--red)}
.catmeta{position:absolute;right:5cqw;top:6cqh;z-index:7;display:flex;gap:1cqw;align-items:center;font:600 2.4cqh/1 Ploni}
.catmeta i{display:inline-block;width:2.4cqh;height:2.4cqh;border-radius:50%;background:var(--blue)}
.catmeta.c2 i{background:var(--red)}.catmeta.c3 i{background:var(--char)}
.kicker{font:600 3cqh/1 Ploni;color:var(--blue);letter-spacing:.02em}

/* ── צורות בתוך המילים ── */
.sh{display:inline-block;vertical-align:baseline}
.pill{width:.2em;height:.64em;border-radius:.1em;background:var(--blue);vertical-align:-.02em;margin:0 .02em}
.pill.red{background:var(--red)}.pill.pink{background:var(--pink)}
.dotp{width:.3em;height:.3em;border-radius:50%;background:var(--pink);vertical-align:-.02em;margin:0 .04em}
.dotr{width:.34em;height:.34em;border-radius:50%;background:var(--red);vertical-align:0;margin:0 .04em}
.tri{width:.44em;height:.44em;background:var(--blue);clip-path:polygon(100% 0,0 50%,100% 100%);vertical-align:.02em;margin:0 -.02em}
.flower{width:.44em;height:.44em;vertical-align:.08em;margin:0 .1em 0 -.03em}
.flower svg{width:100%;height:100%;fill:var(--blue)}
.flower.red svg{fill:var(--red)}

/* מלבן מעוגל עם חץ, בין "של" ל"עריכת" */
.arrowpill{width:.95em;height:.36em;vertical-align:.1em;margin:0 .04em}
.arrowpill svg{width:100%;height:100%;overflow:visible}
.arrowpill svg rect{fill:var(--red)}
.arrowpill svg .ar path{fill:none;stroke:#fff;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.slide.on .arrowpill.a{animation:pop .55s var(--d,1.3s) cubic-bezier(.2,.8,.2,1.4) both}
.slide.on .arrowpill.a .ar{animation:arslide 2.4s calc(var(--d,1.3s) + 1s) ease-in-out infinite}
@keyframes arslide{0%,100%{translate:0 0}50%{translate:-12px 0}}

/* ── קווים דקים ביד ── */
.ink{position:absolute;z-index:5;pointer-events:none;overflow:visible}
.ink path{fill:none;stroke:var(--char);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600)}
/* ל-SVG עם viewBox יש יחס מובנה, לכן חייבים רוחב וגובה מפורשים, אחרת right/bottom לא נלקחים בחשבון */
.ring{left:-.22em;width:calc(100% + .42em);top:-.045em;height:1.02em}
.ring .thick{stroke-width:3.8}
.scrib{left:.02em;width:calc(100% - .04em);bottom:-.04em;height:.3em}
/* קרניים במברשת מתחדדת, יוצאות מפינת המילה */
.rays2 path{stroke-linecap:round}
.arrow path:first-child{stroke-width:2.6}
.rays{position:absolute;z-index:5;overflow:visible;pointer-events:none}
.rays path{fill:var(--char);transform-box:view-box;transform-origin:100px 100px;transform:scale(0)}
.slide.on .rays path{animation:rayout .45s var(--d,3.3s) cubic-bezier(.2,.8,.2,1.25) both,raypulse 3s calc(var(--d,3.3s) + 1s) ease-in-out infinite}
@keyframes rayout{from{transform:scale(0)}to{transform:none}}
@keyframes raypulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}

/* ── מדבקות של סוגי סרטונים ── */
.lb{position:absolute;z-index:6;display:flex;align-items:center;gap:.35em;font:600 .105em/1 Ploni;letter-spacing:0;word-spacing:normal;padding:.55em .9em .45em;border-radius:99px;white-space:nowrap;rotate:var(--r,0deg);box-shadow:0 .2em .6em rgba(34,30,34,.1)}
.lb.tape{border-radius:0;clip-path:polygon(1.5% 0,98.5% 6%,100% 100%,0 94%);box-shadow:none}
.lb.dark{background:var(--char);color:#fff}
.lb.line{border:.14em solid var(--char);color:var(--char);background:var(--paper);box-shadow:none}
.lb.pink{background:var(--pink);color:var(--char)}
.lb.red{background:var(--red);color:#fff}
.lb.blue{background:var(--blue);color:#fff}
.lb svg{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}

/* ── כתמי צבע בפינות ── */
.blob{position:absolute;z-index:1}
.b-star{right:-5cqw;top:-10cqh;width:14cqw;height:25cqh;background:var(--blue);clip-path:polygon(50% 0,62% 22%,88% 10%,80% 36%,100% 50%,78% 60%,86% 86%,60% 76%,50% 100%,40% 76%,14% 86%,22% 60%,0 50%,20% 36%,12% 10%,38% 22%)}
.slide.on .b-star.a{animation:fade 1s .1s both,spin 18s linear infinite}
.b-drop{right:2cqw;top:16cqh;width:9cqw;height:22cqh;background:var(--pink);border-radius:50% 50% 50% 50%/40% 40% 60% 60%;rotate:20deg}
.b-moon{right:14cqw;top:-6cqh;width:12cqw;height:20cqh;background:var(--pink);opacity:.7;border-radius:50%}

/* ── גלולת קריאה ── */
.cta{position:absolute;z-index:6;background:var(--blue);color:#fff;font:600 4.2cqh/1 Ploni;padding:1.4cqh 2.6cqh 1.1cqh;border-radius:99px;white-space:nowrap;display:flex;align-items:center;gap:1.4cqw;rotate:-2deg}
.cta svg{width:4cqh;height:4cqh;fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.cta{cursor:pointer;transition:scale .25s cubic-bezier(.2,.8,.2,1.4),background .25s,box-shadow .25s;box-shadow:0 .6cqh 2cqh rgba(36,3,250,.18)}
.cta:hover{scale:1.06;background:var(--red);box-shadow:0 1.4cqh 3.6cqh rgba(255,61,61,.3)}
.cta:hover svg{animation-duration:.6s}
.cta:active{scale:.96}

/* ── מדבקת "חסר" (נעלמת ב-T) ── */
.todo{position:absolute;left:5cqw;bottom:5cqh;z-index:8;font:600 2.1cqh/1.2 Ploni;color:var(--char);background:#FFD400;padding:.45em .8em;rotate:2deg;max-width:36cqw}
.todo::before{content:'חסר: ';font-weight:800}
body.clean .todo{display:none}
/* פתק של שושי: נשאר גם במצב הצגה */
.note{position:absolute;left:5cqw;bottom:5cqh;z-index:8;font:600 2.4cqh/1.25 Ploni;padding:.6em 1em .5em;rotate:-2deg;max-width:30cqw;box-shadow:0 .6cqh 1.6cqh rgba(34,30,34,.12)}
.note.yellow{background:#FFD400;color:var(--char)}
.note.pink{background:var(--pink);color:var(--char)}
.note.blue{background:var(--blue);color:#fff}
.note.red{background:var(--red);color:#fff}
.note.dark{background:var(--char);color:#fff}
.note.white{background:#fff;color:var(--char)}

/* ════════ שער ════════ */
.s-cover h1{position:absolute;right:6cqw;left:6cqw;top:50%;transform:translateY(-58%);text-align:center;font:800 15cqh/1 Ploni;letter-spacing:-.025em}
.s-cover h1 .ln{display:block;word-spacing:-.08em}
.s-cover h1 .wd{display:inline-block;position:relative}
.s-cover h1 .wd.light{font-weight:300;letter-spacing:0}
/* הדגשה ורודה מאחורי מילה, כמו מרקר */
.s-cover h1 .mark{position:absolute;z-index:-1;left:-.04em;right:-.04em;top:.14em;bottom:.08em;background:var(--pink);border-radius:.06em;rotate:-1.5deg;transform-origin:left center}
.slide.on.s-cover h1 .mark.a{animation:markin .5s var(--d,1.3s) cubic-bezier(.2,.8,.2,1) both}
@keyframes markin{from{opacity:0;transform:scaleX(0)}to{opacity:1;transform:none}}
.s-cover .cta{left:9cqw;bottom:12cqh}

/* כדור שקופץ בקשת מעל ה-ו, הלוך ושוב, בלי סוף */
.s-cover h1 .vv{position:relative;display:inline-block}
.s-cover h1 .hop{position:absolute;left:50%;top:0;width:0;height:0;z-index:3}
.s-cover h1 .vv .pill{position:relative;z-index:1}
.s-cover h1 .hop .ball{position:absolute;left:-.075em;top:.02em;width:.15em;height:.15em;border-radius:50%;background:var(--red);box-shadow:0 .03em .08em rgba(34,30,34,.18)}
.s-cover h1 .hop.blue .ball{background:var(--blue)}
@keyframes hopx{from{translate:0 0}to{translate:0 0}}
@keyframes hopy{0%{transform:translateY(-.19em)}14%{transform:translateY(-.19em)}50%{transform:translateY(.47em)}60%{transform:translateY(.47em)}100%{transform:translateY(-.19em)}}
.slide.on.s-cover h1 .hop.a{animation:fade .4s var(--d,2.2s) both,hopx 1.1s calc(var(--d,2.2s) + .4s) ease-in-out infinite alternate}
.slide.on.s-cover h1 .hop.a .ball{animation:hopy 2.6s calc(var(--d,2.2s) + .4s) cubic-bezier(.45,0,.55,1) infinite}
.slide.on.s-cover h1 .hop.blue.a{animation-delay:var(--d,2.6s),calc(var(--d,2.6s) + .4s)}
.slide.on.s-cover h1 .hop.blue.a .ball{animation-delay:calc(var(--d,2.6s) + 1.7s)}

.s-cover .logo{position:absolute;right:5cqw;bottom:11cqh;height:7cqh;width:auto;z-index:7}
.s-cover .foot{bottom:6cqh}

/* ════════ המפה ════════ */
@font-face{font-family:Brush;src:url(assets/rugatka-bold.otf)}
.s-map .kick{position:absolute;right:12.4cqw;top:8cqh;font:600 3.2cqh/1 Ploni;color:var(--red)}
.s-map .big{position:absolute;right:12cqw;top:12cqh;font:800 15cqh/.9 Ploni;letter-spacing:-.03em;z-index:3}
.s-map .sub{position:absolute;right:12.4cqw;top:26cqh;font:600 3.2cqh/1 Ploni;color:var(--blue);z-index:3}
.s-map .frames{position:absolute;left:12cqw;right:12cqw;top:37cqh;display:flex;justify-content:space-between;z-index:2}
.s-map .fr{position:relative;width:22cqw;margin:0;display:flex;flex-direction:column;gap:1.6cqh}
.s-map .pic{position:relative;aspect-ratio:16/11;background:#ddd;border-radius:1.2cqh}
.s-map .pic video,.s-map .pic .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:1.2cqh;filter:grayscale(1) contrast(1.05)}
.s-map .pic .ph{background:linear-gradient(160deg,#cfcfd4,#8e8e96);filter:none}
.s-map .pic .num{position:absolute;left:1.6cqh;top:1.6cqh;font:800 2.2cqh/1 Ploni;color:#fff;letter-spacing:.06em}
.s-map .pic .brush{position:absolute;right:-1.2cqw;top:-4.5cqh;font:400 9cqh/1 Brush;color:var(--red);rotate:-5deg;white-space:nowrap;z-index:4;text-shadow:0 .3cqh 1cqh rgba(0,0,0,.08)}
.s-map .fr:nth-child(2) .pic .brush{rotate:-4deg}
.s-map .fr:nth-child(3) .pic .brush{rotate:-6deg}
.s-map figcaption{font:400 2.6cqh/1.35 Ploni;color:var(--char);border-top:.25cqh solid var(--char);margin-top:.6cqh;padding-top:1.2cqh;display:flex;flex-direction:column;gap:.5cqh}
.s-map figcaption b{font:800 3cqh/1.2 Ploni}
.slide.on.s-map .brush.a{animation:pop .5s var(--d,1.6s) cubic-bezier(.2,.8,.2,1.4) both,sway 6s calc(var(--d,1.6s) + 1s) ease-in-out infinite;--r:-5deg}

/* ════════ קיר קטגוריה ════════ */
.s-wall .center{position:absolute;left:26cqw;right:26cqw;top:50%;transform:translateY(-50%);text-align:center;z-index:3;display:flex;flex-direction:column;align-items:center;gap:2.2cqh}
.s-wall .num{font:800 3cqh/1 Ploni;color:var(--blue);letter-spacing:.04em}
.s-wall .big{font:800 12cqh/.98 Ploni;letter-spacing:-.025em;padding:0 1cqw}
.s-wall .line{font:400 3.2cqh/1.35 Ploni;max-width:44ch;padding:.5cqh 1cqw}
.s-wall .spec{display:flex;gap:2cqw;justify-content:center;flex-wrap:wrap}
.s-wall .spec div{display:flex;align-items:baseline;gap:1cqw;background:#fff;border-radius:99px;padding:1.2cqh 2cqw 1cqh;font:400 2.6cqh/1.2 Ploni;box-shadow:0 .6cqh 2cqh rgba(34,30,34,.06)}
.s-wall .spec i{font-weight:800;color:var(--red);white-space:nowrap}
.s-wall .tiles{position:absolute;inset:0;z-index:2;pointer-events:none}
.s-wall .tile{pointer-events:auto}
.s-wall .big.one{font-size:30cqh}
.s-wall .lines{display:flex;flex-direction:column;gap:.4cqh;align-items:center}
.s-wall .lines .line{padding:0;font-size:3.4cqh}
/* מילות דוגמאות ברקע */
.s-wall .words{position:absolute;inset:0;z-index:1;pointer-events:none}
.s-wall .wrd{position:absolute;font:800 4cqh/1 Ploni;color:#c9c7cf;white-space:nowrap;letter-spacing:-.01em;opacity:0}
.slide.on.s-wall .wrd{animation:fade .8s var(--d,1.2s) both,drift 9s calc(var(--d,1.2s) + 1s) ease-in-out infinite}
.s-wall .wrd.blue{color:var(--blue)}.s-wall .wrd.red{color:var(--red)}.s-wall .wrd.pink{color:#f0a9a9}
@keyframes drift{0%,100%{translate:0 0}50%{translate:0 -.8cqh}}
.tile{position:absolute;border-radius:2cqh;overflow:hidden;background:#fff;box-shadow:0 1cqh 3cqh rgba(34,30,34,.1);cursor:pointer;transition:scale .25s,box-shadow .25s;rotate:var(--rot,0deg)}
.slide.on .tile.fl{animation:tilein .7s var(--d,1s) cubic-bezier(.2,.8,.2,1.2) both,floaty var(--fd,8s) calc(var(--d,1s) + .7s) ease-in-out infinite}
.slide:not(.on) .tile.fl{opacity:0}
@keyframes tilein{from{opacity:0;transform:scale(.6) translateY(3cqh)}to{opacity:1;transform:none}}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -1.4cqh}}
.tile:hover{scale:1.06;box-shadow:0 2cqh 5cqh rgba(34,30,34,.16);z-index:5}
.tile video{width:100%;height:100%;object-fit:cover;display:block}
.tile .ph{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:1.4cqh;background:linear-gradient(160deg,#fff,var(--c2,var(--pink)))}
.tile .ph b{font:800 2.3cqh/1.1 Ploni;letter-spacing:-.01em}
.tile .ph i{position:absolute;left:1.2cqh;top:1.2cqh;width:3.2cqh;height:3.2cqh;border-radius:50%;background:var(--char);display:grid;place-items:center}
.tile .ph i::after{content:'';width:0;height:0;border-style:solid;border-width:.7cqh 0 .7cqh 1.1cqh;border-color:transparent transparent transparent #fff;margin-left:.2cqh}
.tile .nm{position:absolute;right:1.4cqh;bottom:1.2cqh;left:1.4cqh;font:800 2.2cqh/1.1 Ploni;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.5);pointer-events:none}
/* הגדלה בלחיצה */
#lightbox{position:fixed;inset:0;z-index:60;background:rgba(34,30,34,.92);display:none;place-items:center}
#lightbox.open{display:grid}
#lightbox .box{height:88svh;aspect-ratio:9/16;background:#000;border-radius:2svh;overflow:hidden;position:relative}
#lightbox video{width:100%;height:100%;object-fit:cover}
#lightbox .cap{position:absolute;left:0;right:0;bottom:0;padding:3svh;font:800 3.2svh/1.1 Ploni;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6))}
#lightbox .x{position:absolute;right:3vw;top:3vh;font:800 24px Ploni;color:#fff;background:none;border:0;cursor:pointer}

/* ── גיבור בסגנון RUN: סרטון במרכז, המילה סביבו בסידורים שמתחלפים ── */
@font-face{font-family:Con;src:url(assets/electron-con-heb-black.otf);font-weight:900;unicode-range:U+0590-05FF}
@font-face{font-family:Con;src:url(assets/electron-con-eng-black.otf);font-weight:900}
.s-wall .hero{position:absolute;left:28cqw;right:28cqw;top:8cqh;height:66cqh;z-index:3}
.s-wall .hero .vid{position:absolute;left:50%;top:50%;width:19cqh;height:34cqh;transform:translate(-50%,-50%);background:#111;overflow:hidden;z-index:4;box-shadow:0 1cqh 3cqh rgba(34,30,34,.25)}
.s-wall .hero .vid video,.s-wall .hero .vid .ph{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1)}
.s-wall .hero .vid .ph{display:grid;place-items:center;background:linear-gradient(170deg,#9a9aa2,#3c3c44);color:#fff;font:600 2.4cqh Ploni;filter:none}
.s-wall .lock{position:absolute;inset:0}
.s-wall .lock .t{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:800 24cqh/.9 Ploni;color:var(--char);white-space:nowrap;letter-spacing:-.02em;transition:none;opacity:0}
.s-wall .lock .t7{width:9cqh;height:9cqh;font-size:0}.s-wall .lock .t7 svg{width:100%;height:100%;fill:var(--blue)}
/* 1: מעל ומתחת, גדול */
.s-wall .lock.v1 .t1{opacity:1;transform:translate(-50%,-50%) translateY(-22cqh)}
.s-wall .lock.v1 .t2{opacity:1;transform:translate(-50%,-50%) translateY(22cqh)}
/* 2: שלוש שורות ענקיות בפונט הצר, הסרטון מעליהן */
.s-wall .lock.v2 .t1,.s-wall .lock.v2 .t2,.s-wall .lock.v2 .t3{opacity:1;font:900 34cqh/.8 Con,sans-serif}
.s-wall .lock.v2 .t1{transform:translate(-50%,-50%) translateY(-26cqh)}
.s-wall .lock.v2 .t2{transform:translate(-50%,-50%)}
.s-wall .lock.v2 .t3{transform:translate(-50%,-50%) translateY(26cqh)}
/* 3: מסובב 90 מעלות משני הצדדים */
.s-wall .lock.v3 .t1{opacity:1;font:900 28cqh/.9 Con,sans-serif;transform:translate(-50%,-50%) translateX(-19cqw) rotate(90deg)}
.s-wall .lock.v3 .t2{opacity:1;font:900 28cqh/.9 Con,sans-serif;transform:translate(-50%,-50%) translateX(19cqw) rotate(-90deg)}
/* 4: מברשת אדומה באלכסון */
.s-wall .lock.v4 .t1{opacity:1;font:400 30cqh/1 Brush;color:var(--red);transform:translate(-50%,-50%) rotate(-8deg) translateY(-2cqh)}
.s-wall .lock.v4 .t7{opacity:1;transform:translate(-50%,-50%) translate(-16cqw,-24cqh)}
/* 5: קו מתאר ענק */
.s-wall .lock.v5 .t1{opacity:1;font:800 54cqh/.9 Ploni;color:transparent;-webkit-text-stroke:.35cqh var(--char);transform:translate(-50%,-50%)}
/* 6: ארבע פינות קטנות + מרכז כחול גדול מאחור */
.s-wall .lock.v6 .t1{opacity:1;font:800 30cqh/.9 Ploni;color:var(--blue);transform:translate(-50%,-50%)}
.s-wall .lock.v6 .t3,.s-wall .lock.v6 .t4,.s-wall .lock.v6 .t5,.s-wall .lock.v6 .t6{opacity:1;font:800 5cqh/1 Ploni}
.s-wall .lock.v6 .t3{transform:translate(-50%,-50%) translate(-19cqw,-28cqh)}
.s-wall .lock.v6 .t4{transform:translate(-50%,-50%) translate(19cqw,-28cqh)}
.s-wall .lock.v6 .t5{transform:translate(-50%,-50%) translate(-19cqw,28cqh)}
.s-wall .lock.v6 .t6{transform:translate(-50%,-50%) translate(19cqw,28cqh)}
/* 7: מילה ענקית אחת מאחורי הסרטון */
.s-wall .lock.v7 .t1{opacity:1;font:900 70cqh/.8 Con,sans-serif;transform:translate(-50%,-50%)}
/* 8: רצועה ורודה עם המילה בשחור, חוצה את הסרטון */
.s-wall .lock.v8 .t1{opacity:1;font:800 16cqh/1 Ploni;background:var(--pink);padding:.1em .4em;transform:translate(-50%,-50%) rotate(-6deg) translateY(10cqh)}
.s-wall .lock.v8 .t2{opacity:1;font:800 16cqh/1 Ploni;background:var(--pink);padding:.1em .4em;transform:translate(-50%,-50%) rotate(-6deg) translateY(-18cqh)}
/* 9: למעלה שחור, למטה קו מתאר, הפוך */
.s-wall .lock.v9 .t1{opacity:1;font:800 26cqh/.9 Ploni;transform:translate(-50%,-50%) translateY(-21cqh)}
.s-wall .lock.v9 .t2{opacity:1;font:800 26cqh/.9 Ploni;color:transparent;-webkit-text-stroke:.3cqh var(--char);transform:translate(-50%,-50%) translateY(21cqh) scaleY(-1)}
.s-wall .center.under{top:auto;transform:none;bottom:6cqh}
.s-wall .center.under .num{display:none}
.s-wall .center.under .lines .line{font-size:3cqh}

/* ════════ נעים להכיר: נקי ══════ */
.s-about{display:grid;grid-template-columns:1fr 32cqw;column-gap:6cqw;align-items:center;padding:14cqh 8cqw 12cqh}
.s-about .kicker{grid-column:1;align-self:end}
.s-about .big{grid-column:1;font:800 13cqh/1 Ploni;letter-spacing:-.02em;margin-top:1cqh}
.s-about .big .dotr{width:.3em;height:.3em;vertical-align:0;margin-right:.1em}
.s-about .lines{grid-column:1;list-style:none;padding:0;margin:3cqh 0 0;display:flex;flex-direction:column;gap:1.6cqh;align-self:start}
.s-about .lines li{font:400 4cqh/1.35 Ploni;max-width:34ch;padding-right:2cqw;border-right:.5cqh solid var(--blue)}
.s-about .lines li:nth-child(2){border-color:var(--red)}
.s-about .photo{grid-column:2;grid-row:1/4;aspect-ratio:4/5;border-radius:2.4cqh;overflow:hidden;box-shadow:0 1.6cqh 4cqh rgba(34,30,34,.14);background:#ddd}
.s-about .photo img{width:100%;height:100%;object-fit:cover;object-position:top;filter:grayscale(1) contrast(1.05)}
.s-about .tag{position:absolute;right:8cqw;bottom:6cqh;font:600 2.4cqh/1 Ploni;letter-spacing:.08em;color:var(--blue)}

/* ════════ דוגמאות ════════ */
.s-examples .head{position:absolute;right:6cqw;top:12cqh}
.s-examples .kicker{font-size:3.2cqh}
.s-examples .ex{position:absolute;left:6cqw;right:6cqw;top:22cqh;display:flex;gap:2.2cqw;justify-content:space-between}
.s-examples .exf{flex:1;margin:0;display:flex;flex-direction:column;gap:1.4cqh;min-width:0}
.s-examples .pic{position:relative;aspect-ratio:9/16;border-radius:1.6cqh;overflow:hidden;background:#fff;box-shadow:0 1cqh 3cqh rgba(34,30,34,.08);cursor:pointer;transition:transform .25s}
.s-examples .pic:hover{transform:translateY(-1cqh)}
.s-examples .pic video,.s-examples .pic .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s-examples .pic .ph{background:linear-gradient(165deg,#e9e8ee,#c9c7cf)}
.s-examples .pic .ph i{position:absolute;left:50%;top:50%;width:5cqh;height:5cqh;margin:-2.5cqh;border-radius:50%;background:var(--char);display:grid;place-items:center}
.s-examples .pic .ph i::after{content:'';width:0;height:0;border-style:solid;border-width:1cqh 0 1cqh 1.6cqh;border-color:transparent transparent transparent #fff;margin-left:.3cqh}
.s-examples .pic .num{position:absolute;right:1.4cqh;top:1.2cqh;font:800 2cqh/1 Ploni;color:var(--blue);background:var(--paper);padding:.4cqh .7cqh;border-radius:99px}
.s-examples figcaption b{display:block;font:800 3.4cqh/1.1 Ploni;letter-spacing:-.01em}
.s-examples figcaption span{display:block;font:400 2.5cqh/1.3 Ploni;color:#555;margin-top:.5cqh}
.s-examples .tile{position:relative;rotate:0deg}

/* ── דוגמאות בקבוצות ── */
.s-examples .grp{position:absolute;left:6cqw;right:6cqw;top:22cqh;bottom:10cqh;display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw}
.s-examples .g{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;column-gap:1.6cqw;row-gap:1.2cqh;align-content:start}
.s-examples .g .pic{grid-row:1/3;width:14cqw;aspect-ratio:9/16;position:relative;border-radius:1.6cqh;overflow:hidden;background:#fff;box-shadow:0 1cqh 3cqh rgba(34,30,34,.08);cursor:pointer}
.s-examples .g .pic .ph{position:absolute;inset:0;background:linear-gradient(165deg,#e9e8ee,#c9c7cf)}
.s-examples .g h3{font:800 4.2cqh/1.05 Ploni;letter-spacing:-.01em;margin:0;align-self:end}
.s-examples .g ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1cqh}
.s-examples .g li{font:400 2.8cqh/1.25 Ploni;padding-right:1.4cqw;border-right:.4cqh solid var(--pink)}
.s-examples .g:nth-child(2) li{border-color:var(--blue)}.s-examples .g:nth-child(3) li{border-color:var(--red)}

/* ════════ התמקדות ════════ */
.s-focus{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;column-gap:5cqw;padding:16cqh 6cqw 10cqh}
.s-focus .head{grid-column:1}
.s-focus .head .n{font:600 2.8cqh/1 Ploni;color:var(--blue)}
.s-focus .head .big{font:800 12cqh/1 Ploni;margin-top:1.2cqh;letter-spacing:-.02em}
.s-focus .head .pain{display:inline-block;background:var(--pink);font:600 3.2cqh/1 Ploni;padding:1.2cqh 2cqw .9cqh;border-radius:99px;margin-top:2.2cqh;rotate:-1.5deg}
.s-focus .frame{grid-column:2;grid-row:1/3;height:74cqh;aspect-ratio:9/16;background:#fff;border-radius:2.4cqh;overflow:hidden;align-self:start;box-shadow:0 1cqh 3cqh rgba(34,30,34,.08)}
.s-focus .frame video,.s-focus .frame .ph{width:100%;height:100%;object-fit:cover;display:block}
.s-focus .frame .ph{display:grid;place-items:center;font:800 3cqh/1.3 Ploni;color:var(--char);background:linear-gradient(160deg,#fff,var(--pink))}
.s-focus .pts{grid-column:1;align-self:end;list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.s-focus .pts li{display:grid;grid-template-columns:5cqw 1fr;gap:1.5cqw;align-items:baseline;border-top:.25cqh solid rgba(34,30,34,.15);padding:1.8cqh 0}
.s-focus .pts li:last-child{border-bottom:.25cqh solid rgba(34,30,34,.15)}
.s-focus .pts li i{font:800 3cqh/1 Ploni;color:var(--blue)}
.s-focus .pts li span{font:400 3.6cqh/1.3 Ploni}

/* ════════ השוואה ════════ */
.s-compare{padding:12cqh 6cqw 8cqh;display:flex;flex-direction:column;gap:3cqh}
.s-compare .big{font:800 10cqh/1 Ploni;letter-spacing:-.02em}
.s-compare .five{display:flex;gap:2cqw;flex:1;align-items:stretch}
.s-compare figure{flex:1;margin:0;display:flex;flex-direction:column;gap:1.2cqh;min-width:0}
.s-compare .pic{position:relative;flex:1;border-radius:1.6cqh;overflow:hidden;background:linear-gradient(165deg,#e9e8ee,#c9c7cf);box-shadow:0 1cqh 3cqh rgba(34,30,34,.08);cursor:pointer;rotate:0deg}
.s-compare .pic .ph{position:absolute;inset:0}
.s-compare .pic .ph i{position:absolute;left:50%;top:50%;width:5cqh;height:5cqh;margin:-2.5cqh;border-radius:50%;background:var(--char);display:grid;place-items:center}
.s-compare .pic .ph i::after{content:'';border-style:solid;border-width:1cqh 0 1cqh 1.6cqh;border-color:transparent transparent transparent #fff;margin-left:.3cqh}
.s-compare figcaption{font:800 3cqh/1.1 Ploni;text-align:center}
.s-compare .axes{display:flex;gap:1.2cqw;flex-wrap:wrap;justify-content:center}
.s-compare .axes span{font:600 2.6cqh/1 Ploni;padding:1.1cqh 1.8cqw .9cqh;border-radius:99px;background:#fff;box-shadow:0 .6cqh 2cqh rgba(34,30,34,.06)}
.s-compare .axes span:nth-child(odd){background:var(--pink)}

/* ════════ פיד: טורים של מלבנים שגוללים, טקסט במרכז ════════ */
.s-feed .feedwall{position:absolute;inset:0;display:flex;gap:1.2cqw;padding:0 1.2cqw;z-index:0;overflow:hidden}
.s-feed .col{flex:1;overflow:hidden;position:relative}
.s-feed .col>div{display:flex;flex-direction:column;gap:1.2cqh;animation:feedscroll var(--spd,40s) linear infinite}
.s-feed .col.up>div{animation-direction:reverse}
@keyframes feedscroll{to{transform:translateY(-50%)}}
.s-feed .col img,.s-feed .col video{width:100%;display:block;border-radius:1.2cqh;filter:saturate(.75) brightness(.92)}
.s-feed .center{position:absolute;left:18cqw;right:18cqw;top:50%;transform:translateY(-50%);z-index:3;text-align:center;background:rgba(244,243,246,.94);padding:5cqh 4cqw;border-radius:2.4cqh;box-shadow:0 2cqh 6cqh rgba(34,30,34,.18);display:flex;flex-direction:column;gap:2cqh;align-items:center}
.s-feed .big{font:800 9cqh/1.05 Ploni;letter-spacing:-.02em}
.s-feed .body{font:400 3.4cqh/1.4 Ploni;max-width:46ch}
.s-feed .meta,.s-feed .foot{z-index:4}
.slide:not(.on).s-feed .col>div{animation-play-state:paused}

/* ════════ טקסט ════════ */
.s-text{display:flex;flex-direction:column;justify-content:center;padding:0 8cqw;gap:3cqh}
.s-text .big{font:800 14cqh/1 Ploni;letter-spacing:-.025em;max-width:84cqw}
.s-text .body{font:400 4cqh/1.35 Ploni;max-width:40ch}

/* ════════ סיום ════════ */
.s-closing{display:flex;flex-direction:column;justify-content:center;padding:0 8cqw;gap:2.4cqh}
.s-closing .big{font:800 18cqh/1 Ploni;letter-spacing:-.03em}
.s-closing .go{font:600 4cqh/1 Ploni;color:var(--red)}
.s-closing .url{display:inline-block;width:max-content;background:var(--char);color:#fff;font:800 7cqh/1 Ploni;direction:ltr;padding:2cqh 3cqw 1.6cqh;border-radius:99px}
.s-closing .qr{position:absolute;left:6cqw;bottom:8cqh;width:22cqh;height:22cqh;background:#fff;border-radius:2cqh;display:grid;place-items:center;font:800 2.4cqh Ploni;box-shadow:0 1cqh 3cqh rgba(34,30,34,.08)}

/* ── תנועה שקטה אחרי הכניסה ── */
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -.06em}}
@keyframes sway{0%,100%{rotate:var(--r,0deg)}50%{rotate:calc(var(--r,0deg) + 2.5deg)}}
/* לופים לצורות: כל צורה בתנועה משלה, במקום */
@keyframes pulse{0%,100%{scale:1}50%{scale:1.22}}
@keyframes breathe-h{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.82)}}
@keyframes slowspin{to{rotate:360deg}}
@keyframes blink{0%,100%{scale:1;opacity:1}50%{scale:.8;opacity:.75}}
.slide.on .sh.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,bob 4s calc(var(--d,1.2s) + .6s) ease-in-out infinite}
.slide.on .sh.tri.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,pulse 1.8s calc(var(--d,1.2s) + .6s) ease-in-out infinite}
.slide.on .sh.pill.a{transform-origin:center bottom;animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,breathe-h 3.2s calc(var(--d,1.2s) + .6s) ease-in-out infinite}
.slide.on .sh.flower.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both}
.flower svg{transform-box:fill-box;transform-origin:center}
.slide.on .sh.flower.a svg{animation:slowspin 14s linear infinite}
.slide.on .sh.dotp.a,.slide.on .sh.dotr.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,blink 2.6s calc(var(--d,1.2s) + .6s) ease-in-out infinite}
/* הקווים ביד מצטיירים, נעלמים ומצטיירים שוב */
@keyframes redraw{0%{stroke-dashoffset:var(--len,600)}22%{stroke-dashoffset:0}78%{stroke-dashoffset:0;opacity:1}88%{opacity:0}89%{stroke-dashoffset:var(--len,600);opacity:0}90%{opacity:1}100%{stroke-dashoffset:var(--len,600)}}
.slide.on .ink path{animation:redraw 9s var(--d,2.4s) cubic-bezier(.4,0,.3,1) infinite}
/* החץ בגלולה מנדנד שמאלה */
@keyframes nudge{0%,100%{translate:0 0}50%{translate:-.5cqw 0}}
.slide.on .cta svg{animation:nudge 1.6s 3.5s ease-in-out infinite}
.slide.on .lb.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,sway 5s calc(var(--d,1.2s) + .6s) ease-in-out infinite}
.slide.on .cta.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,sway 6s calc(var(--d,1.2s) + 1s) ease-in-out infinite;--r:-3deg}
.s-map li{transition:transform .3s,box-shadow .3s}.s-map li:hover{transform:translateY(-1.5cqh) rotate(-1deg);box-shadow:0 2.5cqh 5cqh rgba(34,30,34,.1)}
.slide.on .ico.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,bob 4s calc(var(--d,1.2s) + .6s) ease-in-out infinite}
.slide.on .frame{animation:floaty 9s 1s ease-in-out infinite}
.slide.on .url.a,.slide.on .qr.a{animation:pop .55s var(--d,1.2s) cubic-bezier(.2,.8,.2,1.4) both,floaty 8s 2s ease-in-out infinite}

/* ── פרגמנטים ── */
.frag{opacity:0;transform:translateY(1.2cqh);transition:opacity .35s,transform .35s}
.frag.in{opacity:1;transform:none}

/* ── סרגל, מונה, הערות, עזרה ── */
#bar{position:fixed;left:0;right:0;bottom:0;height:5px;background:var(--blue);transform-origin:right;transform:scaleX(0);transition:transform .4s;z-index:20;pointer-events:none}
#hud{position:fixed;left:50%;transform:translateX(-50%);bottom:12px;z-index:20;font:600 13px Ploni;color:var(--char);opacity:.5;letter-spacing:.05em;direction:ltr}
body.clean #hud{opacity:0}
#notes{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--char);color:#fff;padding:16px 28px 22px;font:400 20px/1.4 Ploni;border-top:5px solid var(--red);transform:translateY(100%);transition:transform .3s;max-height:40svh;overflow:auto}
#notes.open{transform:none}
#notes b{color:var(--pink);font-size:14px;letter-spacing:.05em;display:block;margin-bottom:4px}
#help{position:fixed;inset:0;z-index:40;background:rgba(34,30,34,.94);display:none;place-items:center;color:#fff;font:400 20px/1.7 Ploni}
#help.open{display:grid}
#help div{max-width:560px}
#help kbd{display:inline-block;min-width:2.2em;text-align:center;background:var(--pink);color:var(--char);font:700 15px Ploni;padding:3px 8px;margin-left:10px;border-radius:6px}

/* ── טלפון לאורך ── */
@media (max-aspect-ratio:1/1){
  .s-cover h1{font-size:8.5cqh}
  .s-cover .cta{margin-top:22cqh;font-size:3cqh}
  .s-map .big{font-size:10cqh}.s-map .sub{top:20cqh;font-size:2.4cqh}.s-map .frames{flex-direction:column;align-items:center;top:26cqh;gap:1.4cqh;left:6cqw;right:6cqw}.s-map .fr{width:60cqw;flex-direction:row;align-items:center;gap:3cqw}.s-map .pic{width:20cqw;aspect-ratio:1;flex:none}.s-map .pic .brush{font-size:5cqh}.s-map figcaption{font-size:2.1cqh;padding-top:0!important}
  .s-wall .center{left:6cqw;right:6cqw}.s-wall .big{font-size:7cqh}.s-wall .line{font-size:2.4cqh}.s-wall .spec div{font-size:2cqh}.tile{height:12cqh!important}
  .s-about{grid-template-columns:1fr;padding:10cqh 6cqw}.s-about .photo{grid-column:1;grid-row:auto;width:50cqw;margin:auto}.s-about .big{font-size:7cqh}.s-about .lines li{font-size:2.5cqh}
  .s-focus{grid-template-columns:1fr;grid-template-rows:auto auto 1fr;padding:12cqh 6cqw 8cqh}
  .s-focus .frame{grid-column:1;grid-row:2;height:34cqh;justify-self:center;margin:1cqh 0}
  .s-focus .head .big{font-size:7cqh}.s-focus .pts li span{font-size:2.3cqh}
  .s-examples .ex{flex-wrap:wrap;top:18cqh}.s-examples .exf{flex:0 0 30%}.s-examples figcaption b{font-size:2.2cqh}.s-examples figcaption span{font-size:1.8cqh}
  .s-text .big{font-size:8cqh}.s-text .body{font-size:2.8cqh}
  .s-closing .big{font-size:9cqh}.s-closing .url{font-size:3.6cqh}.s-closing .qr{display:none}
  .meta{font-size:2cqh}.foot{font-size:1.9cqh}.todo{font-size:1.8cqh;max-width:60cqw}
  .b-star,.b-drop,.b-moon{transform:scale(.6);transform-origin:top right}
}