/* 11.10 ערב: רועי — "הגרסה עם הגרדיאנט הייתה הרבה יותר יפה": חזרו השוליים המתמוססים וההילה, התמונות עם הרקע האפוי. */
/* ניסוי 11.10.2026: רועי שוכב על הענן במקום הפורטרט ב"נעים מאוד". מחשב: ענן גדול מימין שגולש לקצה, טקסט משמאל; טלפון: ענן מעל הטקסט.
   בלי הילה ובלי שוליים מתמוססים (רועי: "שלא יהיה גרדיאנט") — הדמות גזורה ויושבת ישר על הרקע. תנועה: כניסה מהצד, ריחוף, הטיה אחרי העכבר. */
.lp .ab2{display:grid;align-items:center;text-align:start}
.lp .ab2 .ab-cloud{grid-column:1/8;grid-row:2;width:calc(100% + 5vw);margin:0 -5vw 0 0;position:relative;z-index:1;pointer-events:none}
.lp .ab2 .ab-text{grid-column:8/13;grid-row:2;margin:0;max-width:none;justify-items:start}
.lp .ab2 .ab-text h2 .line>span{text-align:start}
.lp .ab2 .ab-text p.strong{white-space:normal}

.ac-tilt{position:relative;z-index:1;transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translate3d(var(--tx,0px),var(--ty,0px),0);will-change:transform}
.ac-float{animation:acFloat 6.5s ease-in-out infinite alternate}
.ac-float img{display:block;width:100%;height:auto;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 70%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 70%,transparent 100%)}
.ab-cloud .ab-glow{inset:-8% -12%;z-index:0}
.ac-shadow{position:absolute;z-index:0;left:14%;right:14%;bottom:-4%;height:9%;border-radius:50%;background:#100E22;filter:blur(18px);opacity:.75;animation:acShadow 6.5s ease-in-out infinite alternate}
@keyframes acFloat{0%{transform:translateY(-22px) rotate(-2.2deg)}100%{transform:translateY(18px) rotate(1.8deg)}}
@keyframes acShadow{0%{transform:scaleX(.82);opacity:.45}100%{transform:scaleX(1.04);opacity:.8}}

/* כניסה: מגיע מהקצה הימני, מסתובב ומתייצב */
.ab-cloud.ac-pre .ac-tilt{opacity:0;translate:28% 6%;rotate:9deg;scale:.86}
.ab-cloud .ac-tilt{transition:opacity .9s ease,translate 1.6s cubic-bezier(.18,1.25,.4,1),rotate 1.6s cubic-bezier(.18,1.25,.4,1),scale 1.6s cubic-bezier(.18,1.25,.4,1)}
.ab-cloud.ac-pre .ac-shadow{animation:none;opacity:0}

@media (max-width:900px){
  .lp .ab2{text-align:center}
  .lp .ab2 .ab-cloud,.lp .ab2 .ab-text{grid-column:1/-1;grid-row:auto}
  .lp .ab2 .ab-cloud{width:100%;margin:0 0 24px}
  .lp .ab2 .ab-text{justify-items:center}
  .lp .ab2 .ab-text h2 .line>span{text-align:center}
  .ac-float{animation-duration:5.5s}
}
@media (prefers-reduced-motion:reduce){
  .ac-float,.ac-shadow{animation:none}
  .ab-cloud.ac-pre .ac-tilt{opacity:1;translate:none;rotate:none;scale:none}
}