/* desktop (min-width:50.05rem): content column on the right, registration form docked on the left */
@font-face{font-family:Assistant;src:url(fonts/Assistant-Regular.woff2) format('woff2'),url(fonts/Assistant-Regular.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:Assistant;src:url(fonts/Assistant-Bold.woff2) format('woff2'),url(fonts/Assistant-Bold.woff) format('woff');font-weight:700;font-style:normal}
:root{
  --brand:#009EFF;
  --brand-deep:#0077C2;
  --night:#061321;
  --ink:#1F2A35;
  --text:#404040;
  --muted:#6B7684;
  --line:#DCE6EF;
  --paper:#FFFFFF;
  --mist:#F3F8FC;
  --error:#C1272D;
  --font:"Assistant","Heebo","Arial Hebrew",Arial,sans-serif;
  --form-w:19rem;
  --gutter-l:max(.8rem, env(safe-area-inset-left, 0px));
  --gutter-r:max(.8rem, env(safe-area-inset-right, 0px));
  color-scheme:light;
}
*{box-sizing:border-box}
body,html{font-size:calc(1vw + .8px)}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--font);font-size:.85rem;line-height:1.6;direction:rtl;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;color:var(--ink);text-wrap:balance;line-height:1.12;font-weight:700}
button,input,select{font:inherit}
a{text-decoration:none}
:focus-visible{outline:.15rem solid var(--brand);outline-offset:.15rem}

.wrap{padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
.inner{max-width:52rem;margin-inline:auto}
.visually-hidden,.screen-reader-text{border:0!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;width:1px!important;white-space:nowrap!important;position:absolute!important}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--night);color:#fff;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:30% 30%;transform-origin:28% 40%;animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1.02)}to{transform:scale(1.12) translateX(1.5%)}}
@media (prefers-reduced-motion:reduce){.hero__media img{animation:none}}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:
   linear-gradient(90deg, rgba(6,19,33,0) 30%, rgba(6,19,33,.78) 62%, rgba(6,19,33,.94) 100%),
   linear-gradient(0deg, rgba(6,19,33,.85) 0%, rgba(6,19,33,0) 38%)}
/* logo pinned to the top right corner of the hero */
.hero__bar{position:absolute;z-index:1;top:2.25rem;right:2rem;left:auto;display:flex;align-items:center}
.hero__bar img{height:2.85rem;width:auto}
/* copy sits flush with the logo on the right edge of the hero, not in the centered column */
.hero .wrap{padding-right:2rem}
.hero .inner{max-width:none}
.hero__body{min-height:35rem;display:flex;align-items:center;justify-content:flex-start;padding-block:5rem}
.hero__copy{max-width:40rem;margin-inline-start:0}
.eyebrow{display:inline-block;font-size:1rem;font-weight:500;letter-spacing:.01em;color:var(--brand);margin-bottom:1.6rem}
.hero h1{color:#fff;font-size:3.6rem;letter-spacing:-.01em;line-height:1.05;font-weight:300}
.hero h1 strong{display:block;font-weight:800;margin-top:.04em;white-space:nowrap}
.hero h1 em{font-style:normal;color:var(--brand)}
.hero__lead{margin:1.6rem 0 0;max-width:23.5rem;font-size:1.1rem;line-height:1.6;font-weight:400;color:rgba(255,255,255,.88)}

/* ---------- intro statement ---------- */
.statement{padding-block:3.6rem 1.2rem;text-align:center}
.statement p{margin:0 auto;max-width:38rem;font-size:1.9rem;font-weight:200;line-height:1.15;color:var(--ink);text-wrap:balance}
.statement strong{font-weight:800;color:var(--brand)}

/* ---------- section heads ---------- */
.sec{padding-block:3.2rem}
.sec__head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.2rem;margin-bottom:1.4rem;flex-wrap:wrap}
.sec__head h2{font-size:2.1rem;font-weight:800}
.sec__note{margin:.3rem 0 0;color:var(--muted);font-size:.8rem}

/* ---------- roles carousel ---------- */
.nav{display:flex;gap:.4rem;align-items:center}
.nav__count{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.75rem;margin-inline-end:.4rem;min-width:4.5em;text-align:center}
.nav button{width:2.3rem;height:2.3rem;border-radius:50%;border:.075rem solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;display:grid;place-items:center;transition:border-color .2s,background .2s,color .2s}
.nav button:hover:not(:disabled){border-color:var(--brand);color:var(--brand)}
.nav button:disabled{opacity:.35;cursor:default}
.nav svg{width:.9rem;height:.9rem}
.rolefilter{display:flex;flex-wrap:wrap;gap:.4rem;margin:-.3rem 0 1.3rem;padding:0;list-style:none}
.rolefilter button{font:inherit;font-size:.75rem;font-weight:500;line-height:1;padding:.5rem .8rem;border-radius:49.95rem;border:.075rem solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;white-space:nowrap;transition:border-color .2s,background .2s,color .2s}
.rolefilter button:hover{border-color:var(--brand);color:var(--brand-deep)}
.rolefilter button[aria-pressed=true]{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.role.is-picked{border-color:var(--brand);box-shadow:0 0 0 .1rem var(--brand) inset}
.track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(12.5rem,14rem);gap:.9rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.9rem;scrollbar-width:thin;scrollbar-color:var(--line) transparent;overscroll-behavior-x:contain}
.track::-webkit-scrollbar{height:.3rem}
.track::-webkit-scrollbar-thumb{background:var(--line);border-radius:.15rem}
.role{scroll-snap-align:start;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:.5rem;overflow:hidden;min-width:0;transition:border-color .25s, transform .25s}
.role:hover{border-color:var(--brand);transform:translateY(-.15rem)}
@media (prefers-reduced-motion:reduce){.role,.role:hover{transition:none;transform:none}}
.role__img{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--night)}
.role__img img{width:100%;height:100%;object-fit:cover}
.role__img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,19,33,.88) 0%,rgba(6,19,33,0) 55%)}
.role__img h3{position:absolute;z-index:1;inset:auto .9rem .8rem .9rem;color:#fff;font-size:1.15rem;line-height:1.15;font-weight:700}
.role__body{padding:.8rem .9rem 1rem;font-size:.8rem;line-height:1.55;color:var(--text)}
.role__body p{margin:0}

/* ---------- service places ---------- */
.places{background:var(--mist)}
.places .logos{display:flex;align-items:center;justify-content:space-between;gap:1.6rem;overflow-x:auto;padding-block:.4rem .2rem;scrollbar-width:none}
.places .logos::-webkit-scrollbar{display:none}
.places .logos img{flex:0 0 auto;height:3.8rem;width:auto;object-fit:contain}

/* ---------- quote: quote on the right, large photo on the left, tilted tag overlapping the bottom ---------- */
.voice{position:relative;display:flex;align-items:flex-start;margin:4rem 0 7rem;overflow-x:clip}
.voice__quote{flex:0 0 22rem;margin:11rem 2.5rem 0 0;padding-left:1rem;font-size:2.4rem;line-height:1.12;font-weight:600;color:var(--brand);position:relative;z-index:2}
.voice__quote p{margin:0}
.voice__img{flex:1 1 auto;height:39.527rem}
.voice__img img{position:absolute;left:0;top:0;width:65rem;max-width:none;height:auto}
.voice__tag{position:absolute;z-index:3;left:50%;bottom:-3rem;transform:translateX(-50%);width:46.5rem;max-width:none;height:auto}

/* ---------- closing ---------- */
.closing{background:var(--night);color:#fff;text-align:center;padding-block:4.4rem 4.6rem}
.closing h2{display:flex;flex-direction:column;align-items:center;gap:.06em;color:#fff;font-size:2.9rem;line-height:1;letter-spacing:-.01em}
.closing h2 .l1{color:var(--brand);font-weight:800}
.closing h2 .l2{color:#fff;font-weight:200}
.closing__rule{width:2.8rem;height:.1rem;margin:1.6rem auto 0;background:var(--brand);border:0}
.closing__slogan{margin:1.3rem auto 0;width:min(18rem,80%)}
.closing__slogan img{width:100%;height:auto}

/* ---------- form panel: underlined fields, floating labels, select2 pickers ---------- */
#form_wrapper{position:relative;background:#fff;color:#002e6e;padding:1.9rem 1.5rem .7rem 2.3rem}
#form_wrapper .logos{text-align:center}
.form-logo{width:9.2rem;margin:0 auto}
.form_title{font-size:1.35rem;font-weight:400;line-height:1.2;color:var(--brand);text-align:center;margin:1rem 0 .7rem}
.form_title b{font-weight:700;color:#000}
.form_item{position:relative;border-bottom:.06rem solid #011a3d;margin-top:.4rem;margin-bottom:.1rem}
.form_item input{display:block;width:100%;height:2rem;border:0;background:transparent;padding:.6rem 0 0;font-family:var(--font);font-size:.7rem;font-weight:500;color:#000;outline:none}
.form_item label{position:absolute;right:0;bottom:.45rem;font-size:.7rem;color:#6a6c6b;font-weight:400;pointer-events:none;transition:transform .2s ease-in-out,font-size .2s}
.form_item label.top{transform:translateY(-.9rem);font-size:.5rem}
.form_item:focus-within{border-bottom-color:var(--brand)}
.error_msg{display:none;position:absolute;left:0;bottom:-.85rem;font-size:.55rem;font-weight:400;color:var(--error)}
.error_msg.show,.error>.error_msg{display:block}
.form_item.error{border-bottom-color:var(--error)}
input:-webkit-autofill,input:-webkit-autofill:focus{transition:background-color 600000s 0s,color 600000s 0s}
#phone{text-align:right}

/* select2, restyled to sit on the underline like the text fields */
.select2-container{width:100%!important}
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{display:flex;align-items:center;min-height:2rem;height:auto;border:0;border-radius:0;background:transparent;padding:.6rem 0 .2rem 1rem;cursor:pointer;font-family:var(--font)}
.select2-container--default .select2-selection--single .select2-selection__rendered{padding:0;line-height:1.4;font-size:.7rem;color:#000}
.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--default .select2-selection--single .select2-selection__rendered[title="בחרי בית ספר:"]{color:#6a6c6b}
.select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container--default .select2-selection--multiple::after{position:absolute;left:.2rem;right:auto;top:auto;bottom:.75rem;width:0;height:0;border:.25rem solid transparent;border-top-color:#888;border-bottom:0}
.select2-container--default .select2-selection--multiple::after{content:""}
.select2-container--default .select2-selection--single .select2-selection__arrow b{display:none}
.select2-container--default .select2-selection--multiple .select2-selection__rendered{display:flex;flex-wrap:wrap;gap:.2rem;align-items:center;margin:0;padding:0;list-style:none}
.select2-container--default .select2-selection--multiple .select2-selection__choice{margin:0;float:none;background:#e4e4e4;border:1px solid #aaa;border-radius:.2rem;padding:0 .3rem;font-size:.6rem;line-height:1rem;color:#404040}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:#999;margin-left:.2rem}
.select2-container--default .select2-search--inline .select2-search__field{height:auto;margin:0;padding:0;font-family:var(--font);font-size:.7rem;color:#6a6c6b;pointer-events:none}
.select2-container--default .select2-search--inline .select2-search__field::placeholder{color:#6a6c6b}
.select2-container--default.select2-container--focus .select2-selection--multiple{border:0}
.select2-dropdown{border:1px solid #aaa;border-radius:0 0 .2rem .2rem;box-shadow:0 .4rem .9rem rgba(0,0,0,.08);font-family:var(--font);z-index:60}
.select2-results__option{padding:.3rem;font-size:.75rem;color:#404040;line-height:1.3}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--brand);color:#fff}
.select2-container--default .select2-results>.select2-results__options{max-height:11.5rem}
#select2-screeningstage-results .select2-results__option[aria-selected]{display:flex;align-items:center;gap:.3rem}
#select2-screeningstage-results .select2-results__option::before{content:"";flex:0 0 .6rem;width:.6rem;height:.6rem;border:1px solid silver;background:#fff;display:grid;place-items:center;font-size:.55rem;font-weight:700;color:#000;line-height:1}
#select2-screeningstage-results .select2-results__option[aria-selected=true]::before{content:"✓"}
#select2-screeningstage-results .select2-results__message::before{display:none}

/* consent checkbox */
.checkboxes{position:relative;margin-top:.9rem}
#subscribe_cb{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.cb_text{display:flex;align-items:center;font-size:.65rem;color:#000;cursor:pointer;line-height:1}
.cb_text .bigger{display:inline-flex;align-items:center;gap:.4rem}
.cb_text .cb{flex:0 0 .7rem;width:.7rem;height:.7rem;border:1px solid #002e6e;background:#fff;display:grid;place-items:center;font-size:.55rem;font-weight:700;line-height:1}
#subscribe_cb:checked+.cb_text .cb::before{content:"✓"}
#subscribe_cb:focus-visible+.cb_text .cb{outline:.1rem solid var(--brand);outline-offset:.1rem}

#submitinput{margin-top:2rem;text-align:center}
#formsubmit{display:block;width:60%;height:1.75rem;margin:auto;border:0;border-radius:.8rem;background:var(--brand);color:#fff;font-family:var(--font);font-size:1.15rem;font-weight:700;line-height:1.75rem;cursor:pointer;padding:0;transition:background .2s}
#formsubmit:hover{background:var(--brand-deep)}
#formsubmit:disabled{opacity:.6;cursor:default}
iframe#lead_frame{display:none}
#thanks{display:none;text-align:center;padding:4rem 0 2rem}
#thanks h3{font-size:1.5rem;line-height:1.1;color:#000;font-weight:700}
#thanks .wap{font-size:1.6rem;color:#fff;display:block;text-align:center}
#thanks a{text-decoration:none;color:#fff;display:flex;background:#60d669;border-radius:1rem;font-size:1.2rem;padding:.5rem;width:90%;margin:auto;justify-content:center}
#thanks a img{height:1.6rem;margin-left:.5rem}
/* submit error overlay */
.eb{display:none}
.eb.show{display:flex;position:absolute;z-index:70;inset:0;background:#fff;flex-direction:column;justify-content:center;align-items:center}
.eb .text{font-size:1.3rem;line-height:1.2;text-align:center;width:16rem;color:#000}
a.close{position:absolute;left:.4rem;top:calc(.2rem + env(safe-area-inset-top, 0px));width:2.2rem;height:2.2rem;display:grid;place-items:center;font-size:2rem;font-weight:200;line-height:1;color:#002e6e}

/* ---------- docked form ---------- */
#wrapper{padding-left:var(--form-w)}
#wrapper>footer{position:fixed;top:0;left:0;bottom:0;width:var(--form-w);overflow-y:auto;background:#fff;box-shadow:0 .2rem .6rem rgba(0,0,0,.12);z-index:10;padding-left:env(safe-area-inset-left, 0px)}
#form_wrapper{padding-top:calc(1.9rem + env(safe-area-inset-top, 0px));min-height:100%}
.mobile,.formclose{display:none!important}
