/* מקור: index.html בדוגמה */
/* ===== עמוד הבית: אינטרו נגלל בשכבות, פתיחה עם השם על הצילום, עומק בגלילה ===== */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
.site.hide{opacity:0;pointer-events:none}
.site{transition:opacity .5s,background .4s,color .4s,box-shadow .4s}

/* --- אינטרו: קטע גבוה עם במה דביקה --- */
#intro{position:relative;height:440vh;z-index:3}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--night);color:#fff}
.portrait{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;padding:6vh 4vw 44vh}
.portrait svg{width:min(84vw,760px);height:auto;overflow:visible}
.portrait svg.mob{display:none}
.portrait #dp,.portrait #dpm{stroke-dasharray:1;stroke-dashoffset:0;animation:gvDraw 1.4s ease-in-out .15s both}
@keyframes gvDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.sig{position:absolute;left:0;right:0;bottom:11vh;text-align:center;animation:gvSig .8s ease-out 1.3s both}
@keyframes gvSig{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:reduce){.portrait #dp,.portrait #dpm,.sig{animation:none}}
.sig .siglogo{width:min(56vw,220px);height:auto;margin:0 auto;display:block;filter:drop-shadow(0 2px 12px rgba(0,0,0,.35))}
.sig .sub{margin-top:6px;font-size:14px;letter-spacing:.4em;color:var(--leaf)}
.layer{position:absolute;opacity:0;will-change:transform;pointer-events:none}
.layer.photo{border:0;background:transparent;filter:drop-shadow(0 14px 18px rgba(20,30,10,.28))}
.layer.photo img{width:100%;height:auto;display:block;clip-path:polygon(1.5% 2%,38% 0,71% 1.5%,100% 0.5%,99% 36%,100% 72%,98.5% 100%,62% 98.5%,30% 100%,0 99%,1% 60%)}
.layer.photo:nth-of-type(even) img{clip-path:polygon(0 1%,34% 1.5%,68% 0,100% 2%,98.5% 32%,100% 68%,99% 99%,64% 100%,29% 98.5%,1.5% 100%,0.5% 62%)}
.layer.ink img{width:100%;height:auto;display:block}
.layer.scrap{background:var(--mustard);clip-path:polygon(3% 5%,36% 0,71% 3%,100% 1%,98% 38%,100% 71%,95% 100%,61% 97%,29% 100%,0 95%,3% 60%);display:flex;align-items:center;justify-content:center;text-align:center;padding:6%;box-sizing:border-box}
.layer.scrap span{display:block;width:100%;white-space:nowrap;color:#3b3000;font-size:clamp(20px,2.6vw,42px);line-height:1.05;font-family:"Amatic SC","Alef",cursive;font-weight:700}
.layer.final{inset:0;border:0;box-shadow:0 30px 80px rgba(0,0,0,.35);transform-origin:50% 50%}
.layer.final img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.stage .cue{bottom:calc(20px + env(safe-area-inset-bottom,0px))}
.skip{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom,0px));right:20px;left:auto;z-index:5;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.55);color:#fff;border-radius:4px;padding:8px 16px;font:inherit;font-size:15px;cursor:pointer;backdrop-filter:blur(4px)}
.stage.light .skip{color:var(--deep);border-color:var(--deep);background:rgba(255,255,255,.5)}
/* גדלים ומיקומים של השכבות: --w רוחב, --l/--t/--r/--b מיקום */
.layer{width:var(--w);left:var(--l,auto);right:var(--r,auto);top:var(--t,auto);bottom:var(--b,auto)}
.l1{--w:24vw;--l:2vw;--t:6vh;aspect-ratio:1/1.35;z-index:8}
.l2{--w:22vw;--r:6vw;--t:5vh;z-index:4}
.l3{--w:26vw;--l:50vw;--t:30vh;z-index:6}
.l4{--w:30vw;--l:20vw;--t:42vh;z-index:3}
.l5{--w:10vw;--r:32vw;--t:12vh;aspect-ratio:1/1.3;z-index:8}
.l6{--w:42vw;--l:-6vw;--b:-6vh;z-index:1}
.l7{--w:26vw;--r:-3vw;--b:8vh;z-index:4}
.l8{--w:13vw;--l:28vw;--t:2vh;z-index:5}
.l9{--w:14vw;--r:24vw;--b:2vh;z-index:6}
.l10{--w:21vw;--r:38vw;--t:50vh;z-index:5}
.l11{--w:15vw;--l:40vw;--t:4vh;aspect-ratio:1/1.05;z-index:8}
.l12{--w:46vw;--l:26vw;--t:16vh;z-index:7}
.l13{--w:15vw;--r:5vw;--t:36vh;z-index:6}
.l14{--w:22vw;--l:2vw;--t:38vh;z-index:7}
.layer.final{z-index:9}
.final .shade{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.12),rgba(0,0,0,.04) 35%,rgba(0,0,0,.6) 100%);opacity:0}
.stage .copy{position:absolute;inset:0;z-index:10;display:grid;align-content:end;justify-items:center;text-align:center;padding:0 var(--gutter) calc(96px + env(safe-area-inset-bottom,0px));opacity:0;pointer-events:none}
.stage .word{font-size:clamp(96px,15vw,230px);line-height:.9;font-weight:700;color:var(--mustard);margin:0;letter-spacing:-.02em;text-shadow:0 4px 40px rgba(0,0,0,.35)}
.stage .tag{font-size:clamp(32px,5vw,64px);line-height:1.05;color:#fff;margin:10px 0 0;text-shadow:0 2px 20px rgba(0,0,0,.45)}
.stage .lead2{font-size:clamp(17px,1.7vw,23px);line-height:1.5;color:#fff;max-width:34rem;margin:16px auto 0;text-shadow:0 1px 14px rgba(0,0,0,.6);text-wrap:balance}
.stage .copy .btn{pointer-events:auto;margin-top:18px}
.stage .cue,.skip{z-index:12}
@media (max-width:759px){
  #intro{height:330vh}
  /* הפתיחה בטלפון (דנה 16.10.2026: הציור והמשפט קטנים מדי): הציור בשתי שורות (svg.mob) ברוחב כמעט מלא, הלוגו מוגבל בגובה כדי שלא ייגעו גם בטלפון נמוך */
  .portrait{padding:5vh 4vw 0;padding-top:5svh;align-content:start}
  .portrait svg.wide{display:none}
  .portrait svg.mob{display:block;width:92vw;height:42vh;height:42svh}
  .sig{bottom:11svh}
  .sig .siglogo{max-height:38vh;max-height:38svh;object-fit:contain;object-position:50% 100%}
  .layer.l3,.layer.l5,.layer.l6,.layer.l9,.layer.l11,.layer.l12,.layer.l14{display:none!important}
  .l1{--w:40vw;--l:5vw;--t:5vh;--r:auto;--b:auto}
  .l2{--w:40vw;--r:5vw;--t:6vh;--l:auto;--b:auto}
  .l4{--w:64vw;--l:5vw;--t:32vh;--r:auto;--b:auto}
  .l8{--w:24vw;--r:4vw;--t:36vh;--l:auto;--b:auto}
  .l10{--w:40vw;--r:5vw;--t:56vh;--l:auto;--b:auto}
  .l13{--w:44vw;--l:5vw;--t:62vh;--r:auto;--b:auto}
  .layer.l7{display:none!important}
  .layer.scrap span{font-size:24px}
  .layer.final{inset:0;border:0;box-shadow:none}
  .layer.final img{object-position:44% 30%}
  .final .shade{display:none}
  .layer.final img{object-position:44% 38%}
  .stage .copy{inset:auto 0 0 0;min-height:46vh;background:var(--paper);color:var(--deep);align-content:center;padding:14px var(--gutter) 60px;border-radius:22px 22px 0 0;box-shadow:0 -12px 30px rgba(0,0,0,.18)}
  .stage .word{font-size:clamp(64px,19vw,90px);text-shadow:none;line-height:.95}
  .stage .tag{color:var(--deep);text-shadow:none;font-size:clamp(24px,6.4vw,32px);margin-top:2px}
  .stage .lead2{color:var(--ink);text-shadow:none;font-size:16px;margin-top:10px}
  .stage .copy .btn{margin-top:12px}
  .stage .cue{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .site:not(.hide){background:rgba(201,214,131,.96);box-shadow:0 1px 0 #b9c76e}
}

/* --- רמז גלילה --- */
.cue{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom,0px));left:0;right:0;display:grid;justify-items:center;gap:8px;font-size:17px;font-weight:700;letter-spacing:.24em;color:#fff;text-decoration:none;opacity:.9;z-index:3}
.cue svg{width:24px;height:24px;fill:currentColor;animation:nod 2.2s ease-in-out infinite;filter:drop-shadow(0 1px 4px rgba(0,0,0,.4))}
@keyframes nod{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}

/* --- כל מה שאחרי הפתיחה עולה מעליה --- */
.after{position:relative;z-index:5;background:var(--paper);box-shadow:0 -30px 60px rgba(0,0,0,.18);margin-top:-100vh}
.panel{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;overflow:hidden;color:#fff;text-align:center;isolation:isolate}
.panel .bg{position:absolute;inset:-14% 0;width:100%;height:128%;object-fit:cover;z-index:-1;will-change:transform}
.explore::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(6,52,20,.3)}
.explore .inner{max-width:38rem;padding:120px var(--gutter);display:grid;justify-items:center;gap:22px}
.vline{width:1px;height:88px;background:rgba(255,255,255,.75);transform-origin:top;transform:scaleY(0);transition:transform 1.1s var(--ease) .2s}
.in .vline{transform:scaleY(1)}
.explore p{margin:0;font-size:clamp(18px,2.3vw,24px);line-height:1.55;text-wrap:balance;max-width:30rem}
.explore .tri{display:block;color:#fff;font-size:22px;text-decoration:none;line-height:1}

/* --- תפריט תוכן עם עומק --- */
.menu{padding:74px 0 30px;position:relative;overflow:hidden}
.menu .title{display:flex;align-items:center;gap:18px;justify-content:center;color:var(--deep);margin:0 0 30px}
.menu .title::before,.menu .title::after{content:"";height:1px;background:var(--line);flex:1;max-width:160px}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;align-items:start}
.mcard{position:relative;display:block;text-decoration:none;color:var(--ink);perspective:900px}
.mcard .ph{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:255px 15px 225px 15px/15px 225px 15px 255px;border:1.5px solid var(--green);background:var(--pale);box-shadow:5px 5px 0 var(--pale);transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.cards .mcard:nth-child(even) .ph{border-radius:15px 225px 15px 255px/255px 15px 225px 15px}
.mcard .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transform:scale(1.02);transition:filter .7s var(--ease),transform 1.2s var(--ease)}
.mcard .ph::after{content:"";position:absolute;inset:0;background:var(--deep);mix-blend-mode:lighten;opacity:.92;transition:opacity .7s var(--ease)}
.mcard .ph.ill{display:grid;place-items:end center;background:var(--pale)}
.mcard .ph.ill img{filter:none;object-fit:contain;padding:8% 6% 0;transform:none}
.mcard .ph.ill::after{opacity:0}
.mcard:hover .ph{transform:translateY(-6px) rotate(-1deg);box-shadow:7px 9px 0 var(--leaf)}
.mcard:hover .ph img,.mcard:focus-visible .ph img{filter:none;transform:scale(1.07)}
.mcard:hover .ph::after,.mcard:focus-visible .ph::after{opacity:0}
.mcard .num{position:absolute;top:8px;right:12px;font-size:44px;line-height:1;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.mcard .ph.ill .num{color:var(--deep);text-shadow:none}
.mcard h3{margin:12px 0 2px;font-size:21px;color:var(--deep);line-height:1.2}
.mcard p{margin:0;color:var(--mute);font-size:14px;line-height:1.4}
.float{position:absolute;pointer-events:none;z-index:3;will-change:transform}
.ages-sec{padding:44px 0 10px;position:relative;overflow:hidden}
.quote{position:relative}
.quote .sprigs{position:absolute;left:-40px;bottom:-60px;width:320px;opacity:.14;filter:brightness(3);will-change:transform}
.qboy{width:min(92vw,880px);height:auto;display:block;margin:0 auto;position:relative}
#dp2{stroke-dasharray:1;stroke-dashoffset:1}
@media (prefers-reduced-motion:reduce){#dp2{stroke-dashoffset:0}}
@media (min-width:700px){.cards{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){
  .cards{grid-template-columns:repeat(5,1fr);gap:18px}
  .cards .mcard:nth-child(2),.cards .mcard:nth-child(4){margin-top:56px}
  .cards .mcard:nth-child(3){margin-top:22px}
  .menu{padding:96px 0 40px}
}
@media (max-width:759px){
  .menu{padding:56px 0 20px}
  .menu .float{display:none}
  .mcard h3{font-size:22px}
  .mcard p{font-size:16px}
  .mcard .num{font-size:40px}
  .explore .inner{padding:62px var(--gutter) 54px;gap:18px}
  .explore p{font-size:20px;line-height:1.5}
  .vline{height:56px}
  .panel.explore{min-height:0}
}
@media (prefers-reduced-motion:reduce){
  #intro{height:auto}
  .stage{position:relative;height:100svh}
  .stage .layer:not(.final),.portrait{display:none}
  .layer.final,.stage .copy{opacity:1}
  .after{margin-top:0}
  .cue svg{animation:none}
  .mcard .ph,.mcard .ph img,.mcard .ph::after{transition:none}
}

/* ===== וורדפרס: התאמות לעמוד הבית שנבנה באלמנטור ===== */
/* פתקי הנייר: הטקסט יושב בפסקה של עורך הטקסט */
.layer.scrap p{margin:0;width:100%}
/* הדמויות הצפות בתפריט התוכן (בדוגמה inline style) */
.menu .float img{width:100%;height:auto}
.menu .float.f1{width:clamp(90px,10vw,150px);left:4%;top:8%}
.menu .float.f2{width:clamp(110px,12vw,180px);right:3%;bottom:6%}
/* הענפים ברקע הציטוט */
.quote .sprigs img{width:100%;height:auto;position:static;opacity:1;filter:none}
/* בעורך: הפתיחה פרוסה (בלי גלילה ובלי שכבות שקופות), הצילום הגדול מוקטן לפינה כדי שלא יסתיר את השכבות */
.elementor-editor-active #intro{height:auto}
.elementor-editor-active .stage{position:relative;height:100vh;min-height:640px;background:#f6f1ea}
.elementor-editor-active .stage .layer{opacity:1;pointer-events:auto}
.elementor-editor-active .portrait{display:none}
.elementor-editor-active .layer.final{inset:auto auto 2vh 2vw;width:26vw;height:auto;z-index:9;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.elementor-editor-active .layer.final img{height:auto}
.elementor-editor-active .stage .copy{opacity:1;inset:auto 0 0 0;background:rgba(251,252,246,.92);color:var(--deep);padding:16px var(--gutter)}
.elementor-editor-active .stage .copy .word{text-shadow:none}
.elementor-editor-active .stage .copy :is(.tag,.lead2){color:var(--ink);text-shadow:none}
.elementor-editor-active .after{margin-top:0}
.elementor-editor-active .cue,.elementor-editor-active .skip{display:none}
.elementor-editor-active .float, .elementor-editor-active .sprigs { pointer-events: auto; }