/* RESET */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

body{
margin:0;
background:#f4fffc;
}

/* =========================================
   ENQUIRY SECTION
========================================= */

.enquiry-form-section{

position:relative;

padding:120px 20px;

overflow:hidden;

text-align:center;

background:
linear-gradient(
rgba(244,255,252,0.92),
rgba(244,255,252,0.96)
),
url("images/dna-bg.png");

background-size:cover;

background-position:center;
}

/* OVERLAY */

.enquiry-form-section::before{

content:"";

position:absolute;

inset:0;

background:
radial-gradient(
circle at top right,
rgba(20,184,166,0.10),
transparent 40%
);

z-index:1;
}

/* HEADING */

.enquiry-form-section h2{

position:relative;

z-index:5;

margin-bottom:35px;

font-size:52px;

font-weight:800;

letter-spacing:-2px;

color:#0f172a;
}

/* FORM */

.enquiry-form{

position:relative;

z-index:5;

max-width:650px;

margin:0 auto;

padding:35px;

border-radius:28px;

background:
rgba(255,255,255,0.72);

backdrop-filter:blur(14px);

box-shadow:
0 25px 60px rgba(15,118,110,0.10);

border:
1px solid rgba(255,255,255,0.45);
}

/* ROWS */

.row,
.sample-row{

display:flex;

gap:16px;
}

/* INPUT GROUP */

.input-group{
flex:1;
}

/* INPUTS */

.enquiry-form input,
.enquiry-form select,
.enquiry-form textarea{

width:100%;

height:52px;

padding:0 16px;

margin-top:14px;

border-radius:14px;

border:
1px solid rgba(15,118,110,0.10);

background:
rgba(255,255,255,0.82);

font-size:14px;

outline:none;

transition:0.35s ease;

color:#334155;
}

/* FOCUS */

.enquiry-form input:focus,
.enquiry-form select:focus,
.enquiry-form textarea:focus{

border-color:#14b8a6;

box-shadow:
0 0 0 4px rgba(20,184,166,0.10);

background:white;
}

/* TEXTAREA */

.enquiry-form textarea{

height:120px;

padding:16px;

resize:none;
}

/* SELECT */

.enquiry-form select{

appearance:none;

cursor:pointer;

background-image:
url('data:image/svg+xml;utf8,<svg fill="%23333" height="20" viewBox="0 0 24 24" width="20"><path d="M7 10l5 5 5-5z"/></svg>');

background-repeat:no-repeat;

background-position:right 14px center;
}

/* BUTTON */

.enquiry-form button{

width:100%;

margin-top:22px;

padding:15px;

border:none;

border-radius:16px;

background:
linear-gradient(
135deg,
#0f766e,
#14b8a6,
#06b6d4
);

color:white;

font-size:16px;

font-weight:700;

cursor:pointer;

transition:0.4s ease;

box-shadow:
0 15px 35px rgba(20,184,166,0.18);
}

.enquiry-form button:hover{

transform:
translateY(-4px);

box-shadow:
0 22px 45px rgba(20,184,166,0.25);
}

/* SUCCESS MESSAGE */

#successMsg{

position:relative;

z-index:5;

font-size:15px;

font-weight:600;
}

/* REMOVE NUMBER ARROWS */

input[type="number"]{
appearance:textfield;
}

/* RESPONSIVE */

@media(max-width:768px){

.row,
.sample-row{

flex-direction:column;
}

.enquiry-form{

padding:25px;
}

.enquiry-form-section h2{

font-size:40px;
}
}

/* =========================
   LOADER
========================= */

#loader{

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:rgba(255,255,255,0.7);

backdrop-filter:blur(5px);

display:none;

justify-content:center;
align-items:center;
flex-direction:column;

z-index:9999;
}

.spinner{

width:60px;
height:60px;

border:6px solid #d1d5db;

border-top:6px solid #14b8a6;

border-radius:50%;

animation:spin 1s linear infinite;
}

#loader p{

margin-top:15px;

font-size:16px;

font-weight:600;

color:#0f172a;
}

@keyframes spin{

100%{
transform:rotate(360deg);
}

}

/* =========================
   ENQUIRY PAGE RESPONSIVE
========================= */

@media(max-width:992px){

  .enquiry-layout{
    display:flex;
    flex-direction:column;
    gap:40px;
  }

  .enquiry-left,
  .enquiry-right{
    width:100%;
  }

  .enquiry-title{
    font-size:42px;
    line-height:1.3;
    text-align:center;
  }

  .enquiry-subtitle{
    text-align:center;
  }

}

@media(max-width:768px){

  .enquiry-section{
    padding:120px 20px 80px;
  }

  .enquiry-container{
    width:100%;
  }

  .enquiry-form{

    padding:35px 22px;

    border-radius:24px;
  }

  .form-row{
    display:flex;
    flex-direction:column;
    gap:20px;
  }

  .form-group{
    width:100%;
  }

  input,
  select,
  textarea{

    width:100%;

    font-size:15px;
  }

  textarea{
    min-height:130px;
  }

  .submit-btn{

    width:100%;

    justify-content:center;
  }

  .enquiry-image img{

    width:100%;

    max-width:380px;
  }

}

@media(max-width:480px){

  .enquiry-title{
    font-size:30px;
  }

  .enquiry-subtitle{
    font-size:14px;
    line-height:1.8;
  }

  .enquiry-form{
    padding:28px 18px;
  }

  input,
  select,
  textarea{

    padding:14px;
    font-size:14px;
  }

  .submit-btn{
    font-size:15px;
    padding:14px 20px;
  }

}