:root{
    --blue:#1E3A8A;
    --blue-light:#2F55C4;
    --blue-pale:#EEF2FF;
    --green:#16A34A;
    --green-light:#22C55E;
    --green-pale:#ECFDF3;
    --red:#DC2626;
    --red-pale:#FEF2F2;
    --ink:#0F1A33;
    --ink-soft:#4B5A78;
    --muted:#7C8AA5;
    --line:#E7EBF3;
    --bg:#FFFFFF;
    --surface:#F7F9FC;
    --shadow-sm: 0 2px 10px rgba(15,26,51,.06);
    --shadow-md: 0 12px 30px rgba(15,26,51,.10);
    --shadow-lg: 0 24px 60px rgba(15,26,51,.16);
    --radius-lg: 26px;
    --radius-md: 18px;
    --radius-sm: 12px;
  }

  *{margin:0;padding:0;box-sizing:border-box;}
  img{max-width:100%;display:block;}
  a{text-decoration:none;color:inherit;}
  body{
    font-family:'Poppins',sans-serif;
    color:var(--ink);
    background:linear-gradient(180deg,#0E2159 0%, var(--blue) 46%, var(--blue-light) 100%);
    min-height:100vh;
    display:flex;
    flex-direction:column;
    -webkit-font-smoothing:antialiased;
  }
  button{font-family:inherit;cursor:pointer;border:none;}
  .container{
    width:100%;
    max-width:1240px;
    margin:0 auto;
    padding:0 28px;
  }

  /* ---------- Navbar ---------- */
  .navbar{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.88);
    backdrop-filter:saturate(180%) blur(14px);
    -webkit-backdrop-filter:saturate(180%) blur(14px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:78px;
    position:relative;
  }
  .nav-logo-left,
  .nav-logo-right{
    display:flex;
    align-items:center;
  }
 .nav-logo-left img{
    height:76px;
    width:auto;
    display:block;
    flex-shrink:0;
    object-fit:contain;
}
.nav-logo-right img{
    height:44px;   
    width:auto;
    display:block;
    flex-shrink:0;
    object-fit:contain;
}

  /* ---------- Page content wrap ---------- */
  .page-main{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px 20px;
  }

  /* ---------- Footer ---------- */
  footer{
    background:#0B1533;
    padding:34px 0;
  }
  .footer-inner{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:1px;
    text-align:center;
}

.footer-copy{
    color:rgba(255,255,255,.75);
    font-size:14px;
    margin:0;
}

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--green);
    background:var(--green-pale);
    padding:7px 16px 7px 12px;
    border-radius:999px;
  }
  .eyebrow .dot{
    width:7px;height:7px;border-radius:50%;
    background:var(--green);
    box-shadow:0 0 0 4px rgba(22,163,74,.18);
  }

  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-weight:600;
    font-size:.95rem;
    border-radius:999px;
    padding:13px 26px;
    transition:transform .28s cubic-bezier(.34,1.56,.64,1), box-shadow .28s ease, background .28s ease;
    white-space:nowrap;
  }
  .btn:active{transform:scale(.96);}
  .btn-primary{
    background:linear-gradient(135deg,var(--green-light),var(--green));
    color:#fff;
    box-shadow:0 10px 24px rgba(22,163,74,.30);
  }
  .btn-primary:hover{
    transform:translateY(-3px) scale(1.03);
    box-shadow:0 16px 32px rgba(22,163,74,.38);
  }
  .btn-primary:disabled{
    opacity:.55;
    cursor:not-allowed;
    transform:none;
    box-shadow:none;
  }
  .btn-lg{padding:16px 34px;font-size:1rem;}
  .btn-ghost{
    background:transparent;
    color:var(--blue-light);
    padding:8px 4px;
    font-size:.88rem;
  }
  .btn-ghost:hover{ color:var(--green); }
  .btn-ghost:disabled{ color:var(--muted); cursor:not-allowed; }

  /* ---------- Form card (modal box, minus the modal overlay behaviour) ---------- */
  .form-card{
    position:relative;
    width:100%;
    max-width:520px;
    background:#fff;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);
    padding:38px 34px 32px;
  }
  .modal-head h3{
    font-size:1.5rem;
    font-weight:700;
    color:var(--ink);
    line-height:1.28;
  }
  .modal-head .eyebrow{margin-bottom:14px;}
  .modal-head p{
    margin-top:8px;
    font-size:.9rem;
    color:var(--ink-soft);
    line-height:1.6;
  }
  .reg-form{
    margin-top:26px;
    display:flex;
    flex-direction:column;
    gap:18px;
  }
  .field-group{
    display:flex;
    flex-direction:column;
    gap:7px;
  }
  .field-group label{
    font-size:.82rem;
    font-weight:600;
    color:var(--ink);
  }
  .field-group input[type="text"],
  .field-group input[type="tel"],
  .field-group input[type="email"],
  .field-group select,
  .field-group textarea{
    width:100%;
    font-family:inherit;
    font-size:.94rem;
    color:var(--ink);
    background:var(--surface);
    border:1.5px solid var(--line);
    border-radius:12px;
    padding:13px 15px;
    transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
    appearance:none;
    -webkit-appearance:none;
  }
  .field-group textarea{
    min-height:96px;
    resize:vertical;
    line-height:1.5;
  }
  .field-group select{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%237C8AA5' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 15px center;
    padding-right:38px;
    cursor:pointer;
  }
  .field-group input:focus,
  .field-group select:focus,
  .field-group textarea:focus{
    outline:none;
    border-color:var(--green);
    background:#fff;
    box-shadow:0 0 0 4px rgba(22,163,74,.12);
  }
  .field-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
  }
  .checkbox-row{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .checkbox-row input[type="checkbox"]{
    width:19px;height:19px;
    accent-color:var(--green);
    cursor:pointer;
    flex-shrink:0;
  }
  .checkbox-row label{
    font-size:.86rem;
    color:var(--ink-soft);
    cursor:pointer;
  }
  #whatsappGroup{
    overflow:hidden;
    max-height:90px;
    transition:max-height .3s ease, opacity .3s ease, margin .3s ease;
    opacity:1;
  }
  #whatsappGroup.is-hidden{
    max-height:0;
    opacity:0;
    margin-top:-18px;
  }
  .reg-submit{
    width:100%;
    margin-top:6px;
  }
  .form-success{
    display:none;
    text-align:center;
    padding:20px 4px 6px;
  }
  .form-success.is-visible{display:block;}
  .form-success .ring{
    width:64px;height:64px;
    border-radius:50%;
    margin:0 auto 18px;
    display:flex;align-items:center;justify-content:center;
    background:var(--green-pale);
    color:var(--green);
        border: 2px solid var(--green); /* Border Added */
  }
  .form-success h4{
    font-size:1.2rem;
    font-weight:700;
    color:var(--ink);
  }
  .form-success p{
    margin-top:8px;
    font-size:.9rem;
    color:var(--ink-soft);
    line-height:1.6;
  }
  .form-alert{
    border-radius:14px;
    padding:14px 16px;
    font-size:.9rem;
    line-height:1.6;
  }
  .form-alert.is-error{
    background:var(--red-pale);
    border:1px solid rgba(220,38,38,.25);
    color:var(--red);
  }
  .reg-form.is-hidden{display:none;}

  /* ---------- Multi-select dropdown (Degree) ---------- */
  .msel{
    position:relative;
  }
  .msel-trigger{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    font-family:inherit;
    font-size:.94rem;
    text-align:left;
    color:var(--ink);
    background:var(--surface);
    border:1.5px solid var(--line);
    border-radius:12px;
    padding:13px 15px;
    transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
  }
  .msel-trigger .msel-placeholder{color:var(--muted);}
  .msel-trigger .chev{
    flex-shrink:0;
    transition:transform .22s ease;
    color:var(--muted);
  }
  .msel.is-open .msel-trigger{
    border-color:var(--green);
    background:#fff;
    box-shadow:0 0 0 4px rgba(22,163,74,.12);
  }
  .msel.is-open .msel-trigger .chev{transform:rotate(180deg);}
  .msel-panel{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    right:0;
    background:#fff;
    border:1.5px solid var(--line);
    border-radius:14px;
    box-shadow:var(--shadow-md);
    padding:8px;
    z-index:20;
    display:none;
    max-height:260px;
    overflow-y:auto;
  }
  .msel.is-open .msel-panel{display:block;}
  .msel-option{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 10px;
    border-radius:9px;
    cursor:pointer;
    font-size:.92rem;
    color:var(--ink);
  }
  .msel-option:hover{background:var(--surface);}
  .msel-option input[type="checkbox"]{
    width:18px;height:18px;
    accent-color:var(--green);
    cursor:pointer;
    flex-shrink:0;
  }
  .msel-option.msel-select-all{
    font-weight:600;
    border-bottom:1px solid var(--line);
    border-radius:9px 9px 0 0;
    margin-bottom:4px;
    padding-bottom:12px;
  }

  .stream-radio-group{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }
  .stream-radio-option{
    display:flex;
    align-items:center;
    gap:10px;
    background:var(--surface);
    border:1.5px solid var(--line);
    border-radius:12px;
    padding:13px 15px;
    color:var(--ink);
    font-size:.94rem;
    font-weight:600;
    cursor:pointer;
    transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
  }
  .stream-radio-option:has(input:checked){
    border-color:var(--green);
    background:#fff;
    box-shadow:0 0 0 4px rgba(22,163,74,.12);
  }
  .reg-form.was-validated input:invalid,
  .reg-form.was-validated select:invalid,
  .reg-form.was-validated textarea:invalid{
    border-color:var(--red);
    background:#fff7f7;
    box-shadow:0 0 0 4px rgba(239,68,68,.12);
  }
  .field-group input.is-invalid,
  .field-group select.is-invalid,
  .field-group textarea.is-invalid{
    border-color:var(--red);
    background:#fff7f7;
    box-shadow:0 0 0 4px rgba(239,68,68,.12);
  }
  .field-error{
    display:none;
    color:var(--red);
    font-size:.78rem;
    font-weight:600;
    line-height:1.35;
  }
  .field-error.is-visible{
    display:block;
  }
  .stream-radio-option input[type="radio"]{
    width:18px;
    height:18px;
    accent-color:var(--green);
    cursor:pointer;
    flex-shrink:0;
  }

  /* ---------- OTP screen ---------- */
  .otp-screen{
    display:none;
    text-align:center;
    padding:6px 2px 2px;
  }
  .otp-screen.is-visible{display:block;}
  .otp-screen .otp-icon{
    width:60px;height:60px;
    border-radius:50%;
    margin:0 auto 18px;
    display:flex;align-items:center;justify-content:center;
    background:var(--blue-pale);
    color:var(--blue-light);
    border:2px solid var(--blue-light);
  }
  .otp-screen h3{
    font-size:1.3rem;
    font-weight:700;
    color:var(--ink);
  }
  .otp-screen p{
    margin-top:8px;
    font-size:.88rem;
    color:var(--ink-soft);
    line-height:1.6;
  }
  .otp-screen p .otp-mobile{
    font-weight:600;
    color:var(--ink);
  }
  .otp-boxes{
    display:flex;
    justify-content:center;
    gap:12px;
    margin:26px 0 6px;
  }
  .otp-channel-group{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:20px;
  }
  .otp-channel-option{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:46px;
    padding:10px 12px;
    border:1.5px solid var(--line);
    border-radius:12px;
    background:var(--surface);
    color:var(--ink);
    font-size:.84rem;
    font-weight:600;
    cursor:pointer;
  }
  .otp-channel-option input{
    width:16px;
    height:16px;
    accent-color:var(--green);
    flex-shrink:0;
  }
  .otp-box{
    width:52px;
    height:58px;
    text-align:center;
    font-size:1.3rem;
    font-weight:700;
    color:var(--ink);
    background:var(--surface);
    border:1.5px solid var(--line);
    border-radius:12px;
    transition:border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .18s ease;
  }
  .otp-box:focus{
    outline:none;
    border-color:var(--blue-light);
    background:#fff;
    box-shadow:0 0 0 4px rgba(47,85,196,.14);
  }
  .otp-box.is-success{
    border-color:var(--green);
    background:var(--green-pale);
    color:var(--green);
    box-shadow:0 0 0 4px rgba(22,163,74,.14);
  }
  .otp-box.is-error{
    border-color:var(--red);
    background:var(--red-pale);
    color:var(--red);
    animation:otpShake .34s ease;
  }
  @keyframes otpShake{
    20%{transform:translateX(-6px);}
    40%{transform:translateX(6px);}
    60%{transform:translateX(-4px);}
    80%{transform:translateX(4px);}
    100%{transform:translateX(0);}
  }
  .otp-status{
    min-height:20px;
    font-size:.84rem;
    font-weight:600;
    margin-top:4px;
  }
  .otp-status.is-error{ color:var(--red); }
  .otp-status.is-success{ color:var(--green); }
  .otp-resend{
    margin-top:18px;
    font-size:.86rem;
    color:var(--ink-soft);
  }
  .otp-actions{
    margin-top:22px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  /* ---------- OTP verifying loader ---------- */
  .otp-loading{
    display:none;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin-top:22px;
    font-size:.9rem;
    font-weight:600;
    color:var(--ink-soft);
  }
  .otp-loading.is-visible{ display:flex; }
  .otp-spinner{
    width:20px;height:20px;
    border-radius:50%;
    border:2.5px solid var(--green-pale);
    border-top-color:var(--green);
    animation:otpSpin .7s linear infinite;
    flex-shrink:0;
  }
  @keyframes otpSpin{ to{ transform:rotate(360deg); } }

  @media (max-width:760px){
    .container{padding:0 20px;}
   .nav-logo-left img{height:66px;}
.nav-logo-right img{height:42px;}  /* mobile ku venum size */
    .footer-inner{flex-direction:column;text-align:center;}
  }

  @media (max-width:520px){
    .form-card{padding:30px 22px 26px;}
    .field-row{grid-template-columns:1fr;}
    .otp-channel-group{grid-template-columns:1fr;}
    .otp-box{width:44px;height:52px;font-size:1.15rem;}
    .otp-boxes{gap:9px;}
  }











  .footer{

      padding: 19px 23px;
    text-align:center;
}

.footer-social{
    display:flex;
    justify-content:center;
    gap:16px;
    margin-bottom:20px;
}

.footer-social a{
    width:30px;
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.25);
    border-radius:50%;
    color:#fff;
    text-decoration:none;
    font-size:14px;
    transition:.3s;
}

.footer-social a:hover{
    background:#7CF2A6;
    color:#0B2D87;
    border-color:#7CF2A6;
}

.footer-links{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    margin-bottom:15px;
    flex-wrap:wrap;
}

.footer-links a{
    color:#fff;
    text-decoration:none;
    font-size:15px;
}

.footer-links a:hover{
    color:#7CF2A6;
}

.footer-links span{
    color:rgba(255,255,255,.5);
}

.footer-copy{
    color:rgba(255,255,255,.75);
    font-size:14px;
    margin:0;
}

@media(max-width:768px){
    .footer-links{
        flex-direction:column;
        gap:8px;
    }

    .footer-links span{
        display:none;
    }
}
.modal-head{
  display: none !important;
}











.agree-group {
  margin-top: 12px;
}
.agree-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 14px;
  cursor: pointer;
}
.agree-checkbox input[type="checkbox"] {
  margin-top: 3px;
  cursor: pointer;
}