@font-face{font-family:Heebo;src:url('../assets/fonts/Heebo-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Heebo;src:url('../assets/fonts/Heebo-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Heebo;src:url('../assets/fonts/Heebo-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Heebo;src:url('../assets/fonts/Heebo-ExtraBold.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}

:root{--cyan:#10ced6;--cyan2:#22e2de;--ink:#020b13;--line:rgba(113,196,232,.75)}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%;background:#061421;color:#fff;font-family:Heebo,Arial,sans-serif}
body{overflow-x:hidden}
button,input{font-family:inherit}
a{color:inherit}

/* TRUE RESPONSIVE DESKTOP
   The page fills the actual browser viewport. The artwork uses cover and the form has a fluid max width,
   instead of forcing the browser into a fixed 16:9 artboard. */
.desktop-scene{
  display:flex;
  direction:ltr;
  align-items:center;
  justify-content:flex-start;
  position:relative;
  width:100%;
  min-height:100svh;
  padding:clamp(18px,3.2vh,42px) clamp(18px,2.2vw,44px);
  background-color:#061421;
  background-image:url('../assets/icaur-desktop-classic-fullframe-0914-v2.png');
  background-position:58% center;
  background-size:cover;
  background-repeat:no-repeat;
  overflow:hidden;
}
.mobile-layout{display:none}

/* Always centered below the central iCAUR slogan, independent of form width. */
.coming-soon-desktop{
  position:absolute;
  z-index:3;
  left:50%;
  top:61.2%;
  transform:translate(-50%,-50%);
  direction:rtl;
  text-align:center;
  color:#fff;
  font-family:Heebo,Arial,sans-serif;
  font-size:clamp(28px,2vw,44px);
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
  text-shadow:0 2px 10px rgba(0,0,0,.38);
  pointer-events:none;
}

.lead-card{direction:rtl;color:#fff;background:rgba(2,13,22,.97);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 48px rgba(0,0,0,.38),0 0 24px rgba(0,186,255,.08);overflow:hidden}
.lead-card-desktop{
  position:relative;
  z-index:5;
  left:auto;
  top:auto;
  width:clamp(300px,21vw,410px);
  min-width:0;
  max-width:410px;
  max-height:calc(100svh - clamp(36px,6.4vh,84px));
  overflow:auto;
  flex:0 0 auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(16,206,214,.45) transparent;
}
.lead-card-inner{padding:clamp(16px,1.45vw,28px) clamp(15px,1.5vw,29px) clamp(11px,.9vw,18px);display:flex;flex-direction:column;justify-content:flex-start;min-height:100%}
.lead-card h1{margin:0;text-align:center;font-size:clamp(28px,2vw,40px);line-height:1.08;font-weight:800;letter-spacing:-.02em}
.lead-subtitle{margin:clamp(6px,.6vw,11px) 0 clamp(12px,1.1vw,21px);text-align:center;font-size:clamp(15px,1.08vw,21px);line-height:1.38;font-weight:400}
.input-field{position:relative;margin:0 0 clamp(8px,.7vw,13px)}
.input-field input{width:100%;height:clamp(46px,3.1vw,59px);padding:0 clamp(42px,3vw,56px) 0 16px;border:1px solid rgba(203,222,233,.37);border-radius:9px;background:rgba(255,255,255,.03);color:#fff;font-size:clamp(15px,1vw,19px);text-align:right;outline:none;transition:.18s ease}
.input-field input::placeholder{color:rgba(255,255,255,.95);opacity:1}
.input-field input:focus{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(20,214,223,.12)}
.field-icon{position:absolute;right:clamp(12px,.9vw,17px);top:50%;transform:translateY(-50%);width:clamp(19px,1.35vw,25px);height:clamp(19px,1.35vw,25px);color:#fff;opacity:.9;pointer-events:none}
.field-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mail-icon{width:clamp(18px,1.25vw,23px);height:clamp(18px,1.25vw,23px)}
label.error{display:block;margin:3px 5px 0;color:#ffb2b2;font-size:12px;text-align:right}
.input-field input.error{border-color:#ff7a7a}
.checkbox-container{display:flex;align-items:flex-start;gap:clamp(8px,.7vw,13px);margin:clamp(9px,.8vw,16px) 3px clamp(8px,.7vw,14px)}
.check-label{flex:0 0 clamp(20px,1.3vw,25px);position:relative;margin-top:3px;cursor:pointer}
.check-label input{position:absolute;opacity:0;pointer-events:none}
.check-label .box{display:block;width:clamp(20px,1.3vw,25px);height:clamp(20px,1.3vw,25px);background:#fff;border:1px solid rgba(255,255,255,.8);border-radius:1px}
.check-label input:checked + .box{background:var(--cyan);box-shadow:inset 0 0 0 5px #fff}
.checkbox-container p{margin:0;flex:1;font-size:clamp(10.5px,.72vw,14px);line-height:1.35;text-align:right;color:#fff}
.checkbox-container p a{text-decoration:underline;text-underline-offset:2px}
#submit,#submit-mobile{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:clamp(48px,3.3vw,63px);border:0;border-radius:8px;background:linear-gradient(90deg,var(--cyan),var(--cyan2));color:#001017;font-size:clamp(21px,1.5vw,29px);font-weight:800;cursor:pointer;box-shadow:0 7px 20px rgba(0,210,220,.12);transition:transform .15s ease,filter .15s ease}
#submit:hover,#submit-mobile:hover{filter:brightness(1.04);transform:translateY(-1px)}
#submit .arrow,#submit-mobile .arrow{font-family:Arial,sans-serif;font-size:clamp(24px,1.7vw,32px);font-weight:400;line-height:1}
.samelet-logo-wrap{display:flex;justify-content:center;align-items:center;min-height:clamp(52px,4.4vw,78px);padding-top:clamp(7px,.65vw,12px);margin-top:auto}
.samelet-logo-wrap img{display:block;width:min(48%,205px);height:auto;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}
#thanks,#thanks-mobile{display:none;text-align:center;padding:80px 26px 30px}
#thanks h2,#thanks-mobile h2{font-size:44px;margin:0 0 12px;color:var(--cyan)}
#thanks h4,#thanks-mobile h4{font-size:22px;line-height:1.45;margin:0;font-weight:500}

/* 1366 / 1440 class desktops: keep a clear safety gap before the baked iCAUR logo. */
@media (min-width:769px) and (max-width:1450px){
  .desktop-scene{padding-left:clamp(14px,1.5vw,22px);padding-right:clamp(14px,1.5vw,22px)}
  .lead-card-desktop{width:clamp(292px,21.5vw,312px);max-width:312px}
  .lead-card-inner{padding:17px 16px 11px}
  .lead-card h1{font-size:30px}
  .lead-subtitle{font-size:16px;margin:7px 0 14px}
  .input-field{margin-bottom:9px}
  .input-field input{height:48px;font-size:16px}
  .checkbox-container{margin:10px 2px 9px}
  .checkbox-container p{font-size:11px;line-height:1.3}
  #submit{height:52px;font-size:23px}
  .samelet-logo-wrap{min-height:54px;padding-top:7px}
  .coming-soon-desktop{top:61.5%;font-size:clamp(27px,2.2vw,34px)}
}


/* Taller desktop ratios (16:10, 3:2, 4:3): reveal more of the left side of the artwork so the iCAUR logo never sits behind the form. */
@media (min-width:769px) and (max-aspect-ratio:17/10){
  .desktop-scene{background-position:58% center;padding-left:clamp(12px,1.35vw,22px)}
  .lead-card-desktop{width:clamp(288px,18vw,305px);max-width:305px}
}
@media (min-width:769px) and (max-aspect-ratio:3/2){
  .desktop-scene{background-position:56% center;background-size:contain}
  .lead-card-desktop{width:288px;max-width:288px}
  .coming-soon-desktop{top:58.5%}
}

/* Short desktop/laptop screens: compact the live form, never distort the hero. */
@media (min-width:769px) and (max-height:780px){
  .desktop-scene{padding-top:14px;padding-bottom:14px}
  .lead-card-desktop{max-height:calc(100svh - 28px)}
  .lead-card-inner{padding:13px 14px 8px}
  .lead-card h1{font-size:27px}
  .lead-subtitle{font-size:14px;margin:5px 0 10px}
  .input-field{margin-bottom:7px}
  .input-field input{height:43px;font-size:15px}
  .checkbox-container{margin:7px 1px 7px;gap:8px}
  .checkbox-container p{font-size:10px;line-height:1.25}
  .check-label,.check-label .box{width:19px;height:19px;flex-basis:19px}
  #submit{height:47px;font-size:21px}
  .samelet-logo-wrap{min-height:45px;padding-top:4px}
}

/* On wide desktop windows fill the full viewport to avoid a dark band on the left. */
@media (min-width:1500px) and (min-aspect-ratio:19/10){
  .desktop-scene{background-size:cover;background-position:58% center}
}
@media (min-width:1800px) and (min-aspect-ratio:21/10){
  .desktop-scene{background-size:cover;background-position:56% center}
  .lead-card-desktop{width:clamp(300px,20vw,390px)}
}
@media (min-width:2100px) and (min-aspect-ratio:23/10){
  .desktop-scene{background-size:cover;background-position:54% center}
  .coming-soon-desktop{top:61%}
  .lead-card-desktop{width:410px}
}

@media(max-width:768px){
  html,body{background:#06121d}
  .desktop-scene{display:none}
  .mobile-layout{display:block;min-height:100vh;background:linear-gradient(#06121d,#020a11)}
  .mobile-hero{display:block;width:100%;height:auto;object-fit:cover}
  .mobile-form-wrap{position:relative;margin-top:-2px;padding:0 15px 34px;background:linear-gradient(180deg,rgba(4,18,30,.2),#04111b 14%,#020a11 100%)}
  .lead-card-mobile{position:relative;margin:-1px auto 0;max-width:620px;border-radius:18px;box-shadow:0 0 22px rgba(45,189,255,.14)}
  .lead-card-mobile .lead-card-inner{padding:27px 20px 21px;height:auto;display:block}
  .lead-card-mobile h1{font-size:37px}
  .lead-card-mobile .lead-subtitle{font-size:20px;margin:9px 0 20px}
  .lead-card-mobile .input-field{margin-bottom:13px}
  .lead-card-mobile .input-field input{height:61px;font-size:21px;border-radius:8px;padding-right:52px}
  .lead-card-mobile .checkbox-container{margin:20px 7px 18px;gap:14px}
  .lead-card-mobile .checkbox-container p{font-size:15px;line-height:1.52}
  .lead-card-mobile #submit-mobile{height:66px;font-size:28px}
  .lead-card-mobile .samelet-logo-wrap{height:102px;padding-top:22px}
  .lead-card-mobile .samelet-logo-wrap img{width:min(54%,230px)}
  .lead-card-desktop{display:block!important;position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;min-height:0!important;opacity:0!important;pointer-events:none!important;left:-9999px!important;top:-9999px!important;overflow:hidden!important;border:0!important;padding:0!important}
  .mobile-error{margin:-7px 5px 8px;color:#ffb2b2;font-size:13px;text-align:right}
}

.blockpage{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.58);display:none;align-items:center;justify-content:center}
.blockpage.active{display:flex}
.loader-ring{width:52px;height:52px;border:5px solid rgba(255,255,255,.3);border-top-color:var(--cyan);border-radius:50%;animation:spin .85s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
#yomanframe_wrpr[hidden]{display:none!important}


/* FINAL LAPTOP RESPONSIVE OVERRIDES */
@media (min-width:769px){
  .desktop-scene{
    background-size:cover !important;
    background-position:58% center !important;
  }
}
@media (min-width:769px) and (max-width:1600px){
  .desktop-scene{
    background-position:60% center !important;
  }
  .lead-card-desktop{
    width:clamp(286px,22vw,330px);
    max-width:330px;
  }
}
@media (min-width:769px) and (max-width:1450px){
  .desktop-scene{
    background-position:61% center !important;
  }
}
@media (min-width:769px) and (max-height:820px){
  .desktop-scene{
    padding-top:12px;
    padding-bottom:12px;
  }
  .lead-card-desktop{
    max-height:calc(100vh - 24px);
  }
}
