:root{
    --blue:#123E9C;
    --blue-dark:#0B2A70;
    --red:#E2231A;
    --red-dark:#B5170F;
    --green:#1E9E4A;
    --green-dark:#127636;
    --gold:#F0B90B;
    --paper:#F5F8FF;
    --ink:#0E1B33;
    --line:#DCE4F5;
    --font-en:'Poppins', sans-serif;
    --font-hi:'Hind', sans-serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:var(--font-hi);
    color:var(--ink);
    background:var(--paper);
    line-height:1.5;
    overflow-x:hidden;
  }
  img,svg{display:block; max-width:100%;}
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  button{font-family:inherit; cursor:pointer; border:none;}
  input,select,textarea{font-family:inherit;}
  .en{font-family:var(--font-en);}
  .wrap{max-width:1180px; margin:0 auto; padding:0 clamp(18px,5vw,56px);}

  .btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:15px 30px;
    border-radius:12px;
    font-weight:700;
    font-size:16px;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
    white-space:nowrap;
    font-family:var(--font-hi);
}
  .btn-red{background:var(--red); color:#fff; box-shadow:0 10px 24px -8px rgba(226,35,26,0.55);}
  .btn-red:hover{background:var(--red-dark); transform:translateY(-2px);}
  .btn-blue{background:var(--blue); color:#fff; box-shadow:0 10px 24px -8px rgba(18,62,156,0.5);}
  .btn-blue:hover{background:var(--blue-dark); transform:translateY(-2px);}
  .btn-outline{background:#fff; color:var(--blue); border:2px solid var(--blue);}
  .btn-outline:hover{background:var(--blue); color:#fff; transform:translateY(-2px);}
  .btn:focus-visible{outline:3px solid var(--gold); outline-offset:2px;}

  /* ================= NAVBAR ================= */
  header.nav{
    position:sticky; top:0; z-index:100; background:#fff;
    box-shadow:0 2px 18px rgba(14,27,51,0.08);
  }
  header.nav .wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px clamp(18px,5vw,56px);
}

.logo{
    display:flex;
    align-items:center;
}
  .logo-mark{
    width:50px;
    height:50px;
    object-fit:contain;}
  .logo-text .en{font-size:22px; font-weight:800; color:var(--red); letter-spacing:0.5px; line-height:1;}
  .logo-text .sub{font-size:11px; font-weight:700; color:var(--blue); letter-spacing:2px; margin-top:2px;}
  .nav-links{display:flex; align-items:center; gap:30px;}
  .nav-links a{font-size:15.5px; font-weight:600; color:var(--ink);}
  .nav-links a:hover{color:var(--red);}
  .nav-cta{display:flex; align-items:center; gap:14px;}
  .nav-phone{display:flex; align-items:center; gap:8px; font-weight:700; color:var(--blue); font-size:15px;}
  .burger{display:none; flex-direction:column; gap:5px; background:none; padding:6px;}
  .burger span{width:24px; height:2.5px; background:var(--blue); border-radius:2px;}

  /* ================= HERO ================= */
/* ================= HERO SECTION ================= */

/* ================= HERO SECTION ================= */

.hero{
    
    min-height:55vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:80px 20px;
    position:relative;
    overflow:hidden;
}


.hero .wrap{
    width:100%;
    max-width:1100px;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0 auto;
}


.hero-copy{
    width:100%;
    max-width:900px;
    margin:0 auto;
    text-align:center;
}


.hero h1{
    margin:0;
    text-align:center;
    line-height:1.4;
    font-size:clamp(28px,3.5vw,42px);
    font-weight:800;
    color:#123E9C;
}


.hero .brand{
    display:block;
    text-align:center;
    font-size:clamp(48px,6vw,78px);
    font-weight:900;
    color:#159447;
    text-transform:uppercase;
    letter-spacing:2px;
}


/* Mobile */

@media(max-width:960px){

    .hero .wrap{
        flex-direction:column;
    }

}

 

  /* ================= LIMITED OPPORTUNITY BANNER ================= */
  .limited{
    margin:64px auto 0; max-width:1180px;
    background:linear-gradient(120deg, var(--red), var(--red-dark));
    border-radius:22px; padding:34px 40px; display:flex; align-items:center; justify-content:space-between; gap:24px;
    color:#fff; flex-wrap:wrap;
  }
  .limited h3{font-size:22px; font-weight:800; color:var(--gold);}
  .limited p{margin-top:6px; font-size:15px; color:#FDEBEA; max-width:500px;}

  /* ================= APPLY FORM ================= */
  

.apply{
    padding:70px 0;
    background:linear-gradient(180deg,#F7FAFF,#FFFFFF);
}


.apply .wrap{
    max-width:900px;
    margin:auto;
    display:block;
}


/* FORM HEADING */

.form-title{
    text-align:center;
    font-size:28px;
    font-weight:600;
    color:#123E9C;
    margin-bottom:28px;
}



/* FORM CARD */

form.dealer-form{

    background:#ffffff;

    border-radius:24px;

    padding:35px;

    border:1px solid rgba(14,27,51,0.08);

    box-shadow:
    0 20px 55px rgba(14,27,51,0.12);

}



/* FORM ROW */

.form-row{

    display:grid;

    grid-template-columns:1fr;

    gap:18px;

}



/* FIELD */

.field{

    margin-bottom:16px;

}


.field.full{

    grid-column:1/-1;

}



.field label{

    display:block;

    font-size:13.5px;

    font-weight:700;

    color:#123E9C;

    margin-bottom:7px;

}



/* INPUT BOX */

.field input,
.field select,
.field textarea{

    width:100%;

    padding:12px 15px;

    border-radius:10px;

    border:1.5px solid #D9E2F2;

    background:#F9FBFF;

    font-size:14.5px;

    color:#1E293B;

    transition:.25s ease;

}



.field input::placeholder,
.field textarea::placeholder{

    color:#94A3B8;

}



/* FOCUS EFFECT */

.field input:focus,
.field select:focus,
.field textarea:focus{

    outline:none;

    border-color:#159447;

    background:#fff;

    box-shadow:
    0 0 0 3px rgba(21,148,71,0.12);

}



/* ADDRESS */

.field textarea{

    height:70px;

    min-height:70px;

    resize:none;

}



/* SUBMIT BUTTON */

.submit-row{
    margin-top:10px;
    display:flex;
    justify-content:center;
    width:100%;
}

.submit-row .btn{
    width:100%;
    max-width:280px;
    padding:14px 25px;
    border:none;
    border-radius:12px;
    background:linear-gradient(135deg,#159447,#0E7A38);
    color:white;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    transition:.3s;
}

.submit-row .btn:hover{

    transform:translateY(-2px);

    box-shadow:
    0 10px 25px rgba(21,148,71,0.30);

}



/* STATUS */

.form-status{
    display:block;
    margin-top:12px;
    text-align:center;
    color:#159447;
    font-weight:600;
    font-size:14px;
}



/* MOBILE RESPONSIVE */

@media(max-width:768px){


.apply{

    padding:45px 15px;

}



.form-title{

    font-size:26px;

    margin-bottom:20px;

}



form.dealer-form{

    padding:22px;

    border-radius:20px;

}



.form-row{

    grid-template-columns:1fr;

    gap:0;

}



.field{

    margin-bottom:15px;

}



.field input,
.field select,
.field textarea{

    padding:12px;

    font-size:14px;

}



.submit-row .btn{

    max-width:100%;

}

}

  /* ================= CONTACT STRIP ================= */
  .contact{background:var(--blue); padding:40px 0; color:#fff;}
  .contact .wrap{display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between;}
  .contact-item{display:flex; align-items:center; gap:12px;}
  .contact-item .ic{
    width:42px; height:42px; border-radius:10px; background:rgba(255,255,255,0.15);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .contact-item b{display:block; font-size:15.5px; font-family:var(--font-en);}
  .contact-item span{font-size:12px; color:#C9D8FF; font-family:var(--font-en); letter-spacing:0.5px; text-transform:uppercase;}

  /* ================= TRUST BADGES ================= */
  .badges{background:var(--blue-dark); padding:26px 0;}
  .badges .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px;}
  .badge-item{display:flex; align-items:center; gap:10px; color:#fff; font-size:13px; font-weight:600;}
  .badge-item svg{color:var(--gold); flex-shrink:0;}

  /* ================= FOOTER ================= */
  footer{background:var(--ink); color:rgba(255,255,255,0.7); padding:36px 0;}
  footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
  footer .foot-logo{display:flex; align-items:center; gap:10px; color:#fff; font-family:var(--font-en); font-weight:700; font-size:16px;}
  .foot-logo-mark{height:32px; width:auto;}
  footer .foot-right{font-size:13px;}

  /* ================= RESPONSIVE ================= */
  @media (max-width:960px){
    .hero .wrap{grid-template-columns:1fr;}
    .hero-visual{order:-1; max-width:420px; margin:0 auto 20px;}
    .benefit-grid{grid-template-columns:1fr 1fr;}
    .apply .wrap{grid-template-columns:1fr;}
    .badges .wrap{justify-content:flex-start;}
  }
  @media (max-width:720px){
    .nav-links{
      position:fixed; top:64px; right:0; height:calc(100vh - 64px); width:72%; max-width:300px;
      background:#fff; flex-direction:column; align-items:flex-start; padding:30px; gap:22px;
      transform:translateX(100%); transition:transform .3s ease; box-shadow:-10px 0 30px rgba(0,0,0,0.1); z-index:99;
    }
    .nav-links.open{transform:translateX(0);}
    .nav-phone{display:none;}
    .burger{display:flex;}
    .benefit-grid{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .limited{flex-direction:column; align-items:flex-start; text-align:left;}
    .contact .wrap{flex-direction:column; align-items:flex-start;}
    footer .wrap{flex-direction:column; text-align:center;}
  }
