:root {--c1:#FFCA00;--c2:#7249CD;--c3:#261D68}
*{margin:0;padding:0;box-sizing:border-box;font-family:'HammerPro',Arial,sans-serif}
.act {margin:15px 0 100px 0}
.act span {background-color:var(--c2);display:inline-block;padding:5px 20px 15px 20px;color:var(--c1);font-size:3.5em;line-height:1;font-weight:bold}
body{direction:rtl;cursor:default;background-color:var(--c1)}
.container{display:flex;flex-direction:row-reverse;min-height:100vh}
.form-container{width:450px;background-color:#6838c2;padding:2rem;display:flex;flex-direction:column;align-items:center}
.form-container h2 {text-align:center;display:flex;flex-direction:column;color:var(--c1);font-size:2.5em;font-weight:800;line-height:1;margin:0 auto 20px auto}
.form-container h2 span {color:var(--c1)}
.main-image-container{flex:1;background-color:#fcc52d;background-image:url(../images/bg_image.png);background-repeat:repeat}
.main-image{width:100%;height:100%;background-size:contain;background-position:bottom left;background-repeat:no-repeat}
.logo{width:200px;margin-bottom:2rem}
form{width:100%;color:#fff}
.form-group{margin-bottom:10px}
label{display:block;margin-bottom:.5rem}
input,select{width:100%;padding:13px 20px;border:none;border-radius:4px;text-align:right;font-size:1.1em}
input::placeholder{color:gray;font-size:1em}
input[type="checkbox"]{width:auto;margin-left:.5rem;font-size:1em}
input[type="checkbox"]{display:none}
.checkbox-group{margin:1rem 0;display:flex;align-items:center}
.checkbox-group label {margin-bottom:0;font-size:.96em;display:block;padding-inline-start:30px;position:relative}
.checkbox-group label:before {content:'';width:20px;height:20px;background-color:var(--c1);display:block;position:absolute;top:0;inset-inline-start:0;border-radius:50%;transition:all .2s ease}
.checkbox-group label:hover:before {transform:scale(1.2);box-shadow:0 0 10px var(--c1)}
.checkbox-group label:after {content:'';width:20px;height:20px;background:url(../images/v.svg) no-repeat center center / 60%;display:block;position:absolute;top:0;inset-inline-start:0;z-index:2;opacity:0;transform:translateY(-10px);transition:all .2s ease}
.checkbox-group input:checked+label:after {opacity:1;transform:translateY(0)}
button{background-color:var(--c1);color:var(--c3);border:none;padding:.75rem 2rem;border-radius:50px;cursor:pointer;font-weight:700;width:100%;font-size:1.3em;display:flex;align-items:center;justify-content:center;gap:.25rem;transition:all .2s ease}
button span{display:inline-block;transform:scaleX(-1)}
button:hover{box-shadow:0 5px 20px var(--c1);transform:translateY(-2px)}

/*STAGE*/
.stage {flex-basis:calc(100% - 450px);color:var(--c3);position:relative;overflow:hidden;background:url('../images/desktop.webp') no-repeat top center / cover}
.stage ul {display:flex;flex-wrap:wrap;gap:20px;padding:20px 40px 20px 20px;font-size:1.3em;max-width:500px}
.stage ul li {flex-basis:calc(50% - 20px);list-style:none;display:flex;align-items:center;gap:20px;line-height:1}
.stage ul img {width:2em}
.stage aside {position:absolute;bottom:0;left:0;top:100px;max-width:60%;display:flex;align-items:flex-end}
.stage aside img {max-height:100%;width:auto;max-width:100%}
.stage aside div {position:absolute;bottom:40px;left:40px;display:flex;flex-wrap:wrap;font-size:2em;gap:5px;justify-content:flex-end;max-width:400px}
.stage aside div span {background-color:var(--c1);padding:0 10px 5px 10px}
.stage footer {background-color:var(--c1);color:#111;padding:15px 40px;font-size:1.7em;margin:20px 0}
.sapir_logo {display:none;max-width:200px}
.logos {display:flex;padding:30px;gap:40px;justify-content:flex-end;align-items:center}
header {color:#fff;justify-content:flex-start;align-items:flex-end;line-height:1;padding:0 40px 0 0;max-width:70%}
header h1 {font-size:1em;color:var(--c3);font-size:6em}
header p {margin-block:-0.15em}
header h1 span {display:inline-block;background-color:var(--c1);padding:0 20px 10px 20px;}
header h1 p:nth-child(2) {font-weight:400}
header h2 {display:inline-block;background-color:var(--c2);font-weight:400;font-size:1em;padding:0 20px 10px 20px;flex-grow:1}
.date {display:inline-flex;padding:10px 0 20px 20px;font-size:2.8em;align-items:center;gap:10px;line-height:.8;flex-direction:column;align-items:flex-start;background-color:var(--c2);padding:20px;margin:15px 0 0 0;font-weight:700}
.date span:last-child {font-weight:400}
.date h4 {font-size:5em;line-height:.8;color:var(--c1)}
.date div span:first-child {font-size:1.1em;font-weight:700;line-height:1;display:block;max-width:200px;line-height:.8}
.date div p:last-child {font-weight:400;line-height:.6}
.intro {padding:0 40px 0 0;font-size:2.3em}
.intro p {font-weight:300}
.logos_m {display:none;padding:20px;gap:20px;align-items:center;justify-content:center}
.logos_m img {max-width:90px}
.footer_m {display:none;text-align:center;color:#fff;margin-bottom:30px;font-weight:500}

@media (max-width: 1500px) {
    .stage main {font-size:.8em}
}
@media (max-width: 1300px) {
    .date {font-size:1.2em;margin-bottom:60px}
    header {max-width:none;margin:0 0 0 40px}
    .stage {display:flex;flex-direction:column;align-items:center}
    .stage main {width:100%}
    .sapir_logo {display:block;margin:20px auto 60px auto}
    .logos {display:none}
    .stage aside {position:relative;top:0;max-width:none;flex-direction:row-reverse;align-items:center;justify-content:space-between;padding:0 40px 0 0}
    .stage aside img {max-height:none;max-width:60%}
    .stage aside div {position:relative;bottom:auto;left:auto;flex-wrap:nowrap;font-size:2em;gap:5px;justify-content:flex-end;max-width:none;flex-direction:column;align-items:flex-start}
    .stage aside div span {background-color:var(--c2);padding:0 10px 5px 10px;display:inline-flex;color:#fff}
    .stage footer {display:none}
    .stage ul {flex-wrap:nowrap;max-width:none;gap:10px}
    .stage ul li {flex-direction:column;gap:10px;align-items:center;text-align:center}
    .stage ul img {width:auto;height:2em}
    .intro {display:none}
}
@media (max-width: 930px) {
}
@media (max-width: 768px) {
    .act {margin:5px 0 100px 0}
    .act span {font-size:2em}
    header {}
    header h1 {font-size:2.5em}
    .logo {display:none}
    .container{flex-direction:column-reverse;width:100%;overflow-x:hidden}
    .form-container {width:auto;margin:-40px 20px 0 20px;position:relative;z-index:1}
    .main-image-container{width:100%}
    .main-image{width:100%;height:0;padding-top:calc(100% * (1282/930));background-size:100% auto;background-position:top center;margin:0}
    .logos_m {display:flex}
    .footer_m {display:block}
    .stage {min-height:60vh;background-image:url('../images/mobile.webp')}
}
@media (max-width:580px) {
    header {padding-right:20px;width:calc(100% - 40px)}
    .date div p:first-child {font-size:1.4em}
    .sapir_logo {margin-bottom:40px;max-width:150px}
    .stage aside {align-items:flex-start;padding-inline-start:20px}
    .stage aside div {font-size:1.2em}
    .stage ul {font-size:1em;padding:0 20px 20px 20px;gap:5px}
}

#thankYouMessage{display:none;text-align:center;color:#fcc52d;padding-top:50px}
#thankYouMessage h2{color:#fff;font-weight:700;margin-bottom:20px;font-size:1.5em}
#thankYouMessage p{font-size:1.2em}
@font-face{font-family:'HammerPro';src:url(../fonts/HammerProGX.ttf) format("truetype")}
