/* לוגו מונפש (מסך כניסה + טופס הזמנה). למותג סערי: קנבס שבו האותיות נכתבות (alogo.js). למותגים אחרים: חשיפה רכה וברק. חוזר כל 30 שניות */
.alogo { display: block; width: var(--alogo-w, 240px); max-width: 100%; margin: 0 auto 6px; }
/* גיבוי: התמונה הרגילה מוסתרת עד שההנפשה נטענת, ואם משהו נכשל היא מופיעה אחרי 3 שניות */
.alogo > img { opacity: 0; animation: alogoFallback 0s 3s forwards; }
/* עד שההנפשה נטענת, האזור שומר על אותו יחס כמו הקנבס, כדי שהכותרת שמתחתיו לא תקפוץ */
.alogo:not([data-ready]) { aspect-ratio: 840 / 384; position: relative; }
.alogo.alogo-hide-until-ready:not([data-ready]) { display: none; }   /* דף התשלום: אם אין לוגו להציג, אין מקום ריק */
.alogo:not([data-ready]) > img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; }
@keyframes alogoFallback { to { opacity: 1; } }

.alogo-in { position: relative; display: block; width: 100%; }
.alogo-cv { display: block; width: 100%; height: auto; aspect-ratio: 840 / 384; }
.alogo-in img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; max-width: none; max-height: none; margin: 0; user-select: none; -webkit-user-drag: none; pointer-events: none; }
.alogo-in.generic img { position: relative; height: auto; }

.alogo.play .lg-word { -webkit-mask-image: linear-gradient(90deg, #000 42%, transparent 58%); mask-image: linear-gradient(90deg, #000 42%, transparent 58%); -webkit-mask-size: 250% 100%; mask-size: 250% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; animation: alogoWord 1.8s cubic-bezier(.3, .6, .2, 1) .15s both; }
.alogo-in .lg-shine { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0;
  background-image: linear-gradient(105deg, rgba(255,255,255,0) 38%, rgba(255,250,244,.92) 50%, rgba(255,255,255,0) 62%); background-size: 300% 100%; background-repeat: no-repeat; background-position: 100% 0;
  -webkit-mask-size: 100% 100%, 100% 100%; mask-size: 100% 100%, 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.alogo.play .lg-shine { opacity: 1; animation: alogoShine 1.6s ease-in-out 2.7s both; }
.alogo.play .generic .lg-shine { animation-delay: 1.9s; }

@keyframes alogoWord { 0% { -webkit-mask-position: 100% 0; mask-position: 100% 0; opacity: 0; filter: blur(8px); transform: translateY(12px) scale(.985); } 15% { opacity: 1; } 100% { -webkit-mask-position: 0 0; mask-position: 0 0; opacity: 1; filter: blur(0); transform: none; } }
@keyframes alogoShine { from { background-position: 100% 0; } to { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) {
  .alogo.play .lg-word,   .alogo.play .lg-shine { animation: none; opacity: 0; }
}
.login-box .alogo, .head .alogo, .lite-box .alogo, .box .alogo { margin-bottom: 14px; }
/* הלוגו בכותרת העליונה: אותו גודל נראה כמו התמונה הקודמת (שלה היו שוליים שקופים, ולכן הרוחב כאן קטן בכ-17%): 125px, 71px כשהכותרת מכווצת בגלילה, 75px בטלפון */
.sticky-logo-wrapper .alogo { --alogo-w: 125px; margin: 0; transition: width .3s cubic-bezier(.4, 0, .2, 1); }
.top-sticky-container.scrolled .sticky-logo-wrapper .alogo { --alogo-w: 71px; }
@media (max-width: 520px) { .sticky-logo-wrapper .alogo { --alogo-w: 75px; } }
@media (max-width: 520px) { .top-sticky-container.scrolled .sticky-logo-wrapper .alogo { --alogo-w: 71px; } }
/* לוגו שהועלה: הגדלים המקוריים של הכותרת (150px, 85px בגלילה, 90px בטלפון). רק ללוגו המובנה הרוחב קטן יותר, בגלל השוליים השקופים שהיו לתמונה שלו */
.sticky-logo-wrapper .alogo.is-generic { --alogo-w: 150px; }
.top-sticky-container.scrolled .sticky-logo-wrapper .alogo.is-generic { --alogo-w: 85px; }
@media (max-width: 520px) { .sticky-logo-wrapper .alogo.is-generic { --alogo-w: 90px; } }