/* Studio S · קאבר קולנועי לעמוד הבית ("השלט שנפתח"). פעיל רק כשהסקריפט הדליק אותו (html.ss-cover-on). */
.ss-track{position:relative;height:calc(100svh + var(--ss-flight,150svh))}
html.ss-cover-on #ss-hero{position:sticky!important;top:0;height:100svh!important;min-height:0!important;padding:0!important;overflow:hidden;background:#05030A!important}
html.ss-cover-on #ss-hero::before,html.ss-cover-on #ss-hero::after{display:none!important}
html.ss-cover-on #ss-hero > .e-con-inner > .elementor-background-video-container,html.ss-cover-on #ss-hero .ss-vplay{display:none!important}
#ss-hero .ssc-poster,#ss-hero .ssc-cv,#ss-hero .ssc-ign{position:absolute;inset:0;width:100%;height:100%;display:block}
#ss-hero .ssc-poster{object-fit:cover;z-index:0}
#ss-hero .ssc-cv{z-index:1}
#ss-hero .ssc-ign{object-fit:cover;z-index:2;transition:opacity .4s ease}
#ss-hero .ssc-ign.gone{opacity:0;pointer-events:none}
#ss-hero .ssc-scrim{position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,rgba(12,8,23,.55) 0%,rgba(12,8,23,0) 16%,rgba(12,8,23,0) 52%,rgba(12,8,23,.82) 72%,rgba(12,8,23,.96) 100%)}
#ss-hero .ssc-inscrim{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 50%,rgba(12,8,23,.55),rgba(12,8,23,.25) 70%)}

/* the hero's own widgets (editable in Elementor) become the copy block */
html.ss-cover-on #ss-hero > .e-con-inner{position:absolute!important;z-index:4;left:16px;right:16px;bottom:calc(76px + env(safe-area-inset-bottom));top:auto;
  width:auto!important;max-width:none!important;padding:0!important;margin:0!important;gap:0!important;display:flex!important;flex-direction:column;align-items:center;text-align:center;will-change:transform,opacity}
html.ss-cover-on #ss-hero > .e-con-inner > .elementor-widget{margin:0!important;width:100%}
html.ss-cover-on #ss-hero .ssc-hide{display:none!important}
html.ss-cover-on #ss-hero .ssc-eyebrow .elementor-heading-title{font-size:13px!important;letter-spacing:.04em;margin-bottom:6px}
html.ss-cover-on #ss-hero h1.elementor-heading-title{font-size:clamp(30px,9.3vw,64px)!important;line-height:1.04!important;white-space:nowrap;perspective:900px}
html.ss-cover-on #ss-hero h1 .ss-h1sub{white-space:normal;font-size:16px;margin-top:8px}
html.ss-cover-on #ss-hero h1 .ssc-w{display:inline-block;transform-origin:50% 100%}
html.ss-cover-on #ss-hero > .e-con-inner > .e-con{margin-top:14px!important;width:100%!important;flex-wrap:wrap!important;gap:10px!important;justify-content:center!important;padding:0!important}
html.ss-cover-on #ss-hero > .e-con-inner > .e-con > .elementor-widget{flex:1 1 40%;margin:0!important}
html.ss-cover-on #ss-hero > .e-con-inner > .e-con > .elementor-widget:first-child{flex:1 1 100%}
html.ss-cover-on #ss-hero > .e-con-inner > .e-con .elementor-button{width:100%;justify-content:center}

/* the copy waits for the ignition, then enters (the headline words fall into place like in the film) */
html.ss-cover-on #ss-hero .ssc-in{opacity:0;transform:translateY(18px)}
html.ss-cover-on #ss-hero.ssc-live .ssc-in{opacity:1;transform:none;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.9,.25,1)}
html.ss-cover-on #ss-hero.ssc-live .ssc-in.ssc-late{transition-delay:.45s}
html.ss-cover-on #ss-hero:not(.ssc-live) h1 .ssc-w{opacity:0}
html.ss-cover-on #ss-hero.ssc-live h1 .ssc-w{animation:sscW .75s cubic-bezier(.2,.9,.25,1) both}
html.ss-cover-on #ss-hero.ssc-live h1 .ssc-w:nth-child(2){animation-delay:.12s}
html.ss-cover-on #ss-hero.ssc-live h1 .ssc-w:nth-child(3){animation-delay:.24s}
@keyframes sscW{0%{opacity:0;transform:rotateX(-80deg) translate3d(0,40px,-240px) scale(1.4);filter:blur(12px)}100%{opacity:1;transform:none;filter:blur(0)}}

/* inside the studio: the brand line lands over the real class at the end of the flight */
#ss-hero .ssc-inside{position:absolute;z-index:4;left:20px;right:20px;top:50%;transform:translateY(-50%);text-align:center;opacity:0;pointer-events:none}
#ss-hero .ssc-inside .big{font:900 clamp(30px,8.6vw,58px)/1.12 Heebo,sans-serif;color:#fff;text-shadow:0 0 30px rgba(255,30,111,.75),0 4px 30px rgba(0,0,0,.6)}
#ss-hero .ssc-inside .desc{font:400 clamp(16px,4.3vw,22px)/1.55 Heebo,sans-serif;color:#FFE3F0;margin:14px auto 0;max-width:24em;text-shadow:0 2px 16px rgba(0,0,0,.9)}
#ss-hero .ssc-inside .chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:18px}
#ss-hero .ssc-inside .chips span{padding:8px 14px;border-radius:20px;background:rgba(21,16,36,.66);border:1px solid rgba(255,61,139,.7);font:700 14px Heebo,sans-serif;color:#fff;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#ss-hero .ssc-pause{position:absolute;z-index:5;left:16px;top:78px;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,227,240,.35);
  background:rgba(21,16,36,.6);display:grid;place-items:center;cursor:pointer;padding:0}
#ss-hero .ssc-pause:focus-visible{outline:2px solid #FF3D8B;outline-offset:3px}
#ss-hero .ssc-hint{position:absolute;z-index:4;left:50%;bottom:26px;transform:translateX(-50%);width:22px;height:34px;border-radius:12px;border:1.5px solid rgba(255,227,240,.5);display:none}
#ss-hero .ssc-hint::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:#FF3D8B;animation:sscH 1.6s ease-in-out infinite}
@keyframes sscH{0%{transform:translateY(0);opacity:1}70%{transform:translateY(10px);opacity:0}100%{opacity:0}}

@media (min-width:900px){
  #ss-hero .ssc-scrim{background:linear-gradient(270deg,rgba(12,8,23,.9) 0%,rgba(12,8,23,.55) 30%,rgba(12,8,23,0) 52%),linear-gradient(180deg,rgba(12,8,23,.5) 0%,rgba(12,8,23,0) 18%,rgba(12,8,23,0) 80%,rgba(12,8,23,.7) 100%)}
  html.ss-cover-on #ss-hero > .e-con-inner{left:auto;right:max(5vw,calc((100vw - 1240px)/2));bottom:auto;top:50%;transform:translateY(-44%);width:min(470px,30vw)!important;align-items:flex-start;text-align:right}
  html.ss-cover-on #ss-hero h1.elementor-heading-title{font-size:clamp(38px,3.2vw,60px)!important}
  html.ss-cover-on #ss-hero h1 .ss-h1sub{font-size:17px}
  html.ss-cover-on #ss-hero > .e-con-inner > .e-con{justify-content:flex-start!important}
  html.ss-cover-on #ss-hero > .e-con-inner > .e-con > .elementor-widget,html.ss-cover-on #ss-hero > .e-con-inner > .e-con > .elementor-widget:first-child{flex:0 0 auto}
  #ss-hero .ssc-pause{top:auto;bottom:28px;left:28px}
  #ss-hero .ssc-hint{display:block}
}