#mailPopup { display:none; position:fixed; inset:0; z-index:100001; }
#mailPopup.active { display:block; }
#mailPopup .sg-mail-dim { position:absolute; inset:0; background:rgba(15,25,55,.45); backdrop-filter:blur(4px); }

@keyframes sgPop {
  from { opacity:0; transform:translate(-50%,-46%); }
  to   { opacity:1; transform:translate(-50%,-50%); }
}

#mailPopup .sg-mail-box {
  position:fixed;
  left:50%;
  top:50%;
  width:680px;
  max-width:calc(100vw - 48px);
  transform:translate(-50%,-50%);
  background:#f7faff;
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 24px 70px rgba(35,65,140,.28);
  animation:sgPop .25s ease;
  box-sizing:border-box;
}

#mailPopup .sg-mail-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  padding:30px 34px;
  color:#fff;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.25), transparent 28%),
    linear-gradient(135deg, #477ee8 0%, #5c7df2 48%, #a35be8 100%);
}

#mailPopup .sg-mail-badge {
  display:inline-flex;
  padding:5px 12px;
  border-radius:20px;
  background:rgba(255,255,255,.18);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  color:#fff;
}

#mailPopup .sg-mail-head h3 { margin:12px 0 6px; font-size:28px; line-height:1.2; color:#fff; }
#mailPopup .sg-mail-head p  { margin:0; font-size:15px; opacity:.9; color:#fff; }

#mailPopup .sg-mail-close {
  width:38px;
  height:38px;
  min-width:38px;
  border:1px solid rgba(255,255,255,.45);
  border-radius:50%;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:26px;
  line-height:1;
  cursor:pointer;
  flex-shrink:0;
  padding:0;
  margin:0;
}

#mailPopup .sg-mail-form {
    padding: 30px 34px 34px;
    background: #f7faff;
    display: block;
} 

#mailPopup .sg-form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

#mailPopup .sg-mail-form label {
  display:block;
  margin:0;
  padding:0;
  line-height:normal;
  font-size:14px;
}

#mailPopup .sg-mail-form > label,
#mailPopup .sg-form-grid label {
  display:block;
  margin:0;
  padding:0;
}

#mailPopup .sg-mail-form span {
  display:block;
  margin:0 0 8px 0;
  padding:0;
  color:#20345f;
  font-size:14px;
  font-weight:800;
  line-height:normal;
}

#mailPopup .sg-mail-form em { color:#477ee8; font-style:normal; }

#mailPopup .sg-mail-form input[type="text"],
#mailPopup .sg-mail-form input[type="email"],
#mailPopup .sg-mail-form textarea {
  display:block;
  width:100%;
  box-sizing:border-box;
  border:1px solid #c9d8f5;
  border-radius:12px;
  background:#fff;
  padding:14px 15px;
  color:#222;
  font-size:15px;
  font-family:inherit;
  line-height:1.4;
  height:auto;
  margin:0;
  letter-spacing:normal;
  outline:none;
  -webkit-appearance:none;
  appearance:none;
}

#mailPopup .sg-mail-form input[type="text"]:focus,
#mailPopup .sg-mail-form input[type="email"]:focus,
#mailPopup .sg-mail-form textarea:focus {
  border-color:#5c7df2;
  box-shadow:0 0 0 4px rgba(92,125,242,.12);
}

#mailPopup .sg-full { margin-top:18px; }
#mailPopup .sg-full > span:first-child { margin-top:20px; margin-bottom:10px; }
#mailPopup .sg-mail-form textarea { min-height:150px; resize:vertical; height:auto; }
#mailPopup .sg-content-count {
  display:block;
  text-align:right;
  font-size:12px;
  color:#8a9bbf;
  margin-top:4px;
  font-weight:normal;
  line-height:normal;
  white-space:nowrap;
}
#mailPopup .sg-content-count #sg_contentLen {
  display:inline;
}

#mailPopup .sg-mail-agree {
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:18px;
  color:#4b5b78;
  font-size:14px;
  padding:0;
}

#mailPopup .sg-mail-agree input[type="checkbox"] {
  display:inline-block;
  width:18px;
  height:18px;
  min-width:18px;
  padding:0;
  margin:0;
  border-radius:3px;
  background:#fff;
  border:1px solid #ccc;
  flex-shrink:0;
  -webkit-appearance:checkbox;
  appearance:checkbox;
}

#mailPopup .sg-mail-agree label {
  display:inline;
  margin:0;
  padding:0;
  line-height:normal;
  font-size:14px;
  color:#4b5b78;
}

#mailPopup .sg-mail-actions {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:26px;
}

#mailPopup .sg-mail-actions button {
  min-width:120px;
  height:46px;
  border-radius:12px;
  font-weight:800;
  cursor:pointer;
  font-size:14px;
  padding:0 20px;
  box-sizing:border-box;
  line-height:1;
  margin:0;
}

#mailPopup .sg-btn-cancel { border:1px solid #cfd8ea; background:#fff; color:#41516e; }
#mailPopup .sg-btn-submit {
  border:0;
  background:linear-gradient(135deg,#477ee8,#8e63ee);
  color:#fff;
  box-shadow:0 10px 22px rgba(92,125,242,.28);
}
#mailPopup .sg-btn-submit:disabled { opacity:.6; cursor:not-allowed; }

.sg-mail-btn {
  padding:6px 18px;
  border:1px solid rgba(255,255,255,.6);
  border-radius:30px;
  background:linear-gradient(135deg,#4f83f1,#9b5cf4);
  color:#fff;
  font-weight:700;
  cursor:pointer;
  font-size:13px;
  vertical-align:middle;
}

@media (max-width:640px) {
  #mailPopup .sg-form-grid { grid-template-columns:1fr; }
  #mailPopup .sg-mail-head { padding:24px 22px; }
  #mailPopup .sg-mail-form { padding:24px 22px; }
  #mailPopup .sg-mail-head h3 { font-size:24px; }
}
