
:root{
  --outer-bg: #f3fdf8;
  --card-bg: #ffffff;
  --label-color: #6f8b86;
  --underline: rgba(20,40,40,0.06);
  --btn-bg: #21374d;
}
*{box-sizing:border-box}
.efx2-outer{background:var(--outer-bg); padding:48px 20px; display:flex; justify-content:center; font-family:'Kanit', sans-serif}
.efx2-card{width:100%; max-width:760px; background:var(--card-bg); border-radius:16px; padding:54px 56px; box-shadow:0 6px 30px rgba(20,40,40,0.02)}

/* spacing similar to image */
.efx2-form{display:block}
.efx2-row{margin-bottom:34px}
.efx2-label{display:block; color:var(--label-color); font-weight:500; font-size:20px}
.efx2-label input, .efx2-label textarea{display:block; width:100%; margin-top:18px; padding:10px 6px; font-size:18px; border:0; border-bottom:1px solid var(--underline); outline:none; background:transparent; color:#334b47;}
.efx2-label.efx-text{font-size:18px}
.efx2-label textarea{min-height:110px; padding-top:16px; padding-bottom:16px}

/* focus */
.efx2-label input:focus, .efx2-label textarea:focus{box-shadow:0 8px 30px rgba(20,40,40,0.03); border-bottom-color:rgba(20,40,40,0.12)}

/* button */
.efx2-actions{margin-top:6px}
.efx2-btn{display:inline-flex; align-items:center; gap:12px; background:var(--btn-bg); color:#fff; padding:16px 36px; border-radius:999px; border:0; cursor:pointer; font-size:18px; box-shadow:0 8px 24px rgba(33,55,77,0.08)}
.efx2-btn span{display:inline-block}
.efx2-ico{color:#cfe6f3}

/* success */
.efx2-success{margin-top:18px; color:#097a3f; font-weight:600; font-size:16px}

/* responsive */
@media(max-width:780px){
  .efx2-card{padding:28px 20px}
  .efx2-label{font-size:18px}
  .efx2-label input, .efx2-label textarea{font-size:16px}
  .efx2-btn{padding:12px 22px; font-size:16px; width:72%}
}
