/* =========================
   WHATSAPP MODAL PREMIUM
========================= */

.wa-modal{

  position:fixed;

  inset:0;

  z-index:99999;

  display:none;

  align-items:center;

  justify-content:center;

  padding:50px 24px;

  overflow-y:auto;

  background:rgba(0,0,0,.78);

  backdrop-filter:blur(12px);
}

.wa-modal.active{

  display:flex;
}

/* BOX */

.wa-modal-box{

  width:100%;

  max-width:620px;

  position:relative;

  margin:auto;

  padding:56px 46px;

  border-radius:34px;

  background:
  linear-gradient(
    145deg,
    rgba(18,18,18,.98),
    rgba(8,8,8,.99)
  );

  border:1px solid rgba(212,175,55,.16);

  box-shadow:
  0 25px 80px rgba(0,0,0,.55);

  overflow:visible;
}

.wa-modal-box::before{

  content:'';

  position:absolute;

  inset:0;

  border-radius:34px;

  background:
  radial-gradient(
    circle at top right,
    rgba(212,175,55,.08),
    transparent 36%
  );

  pointer-events:none;
}

/* CLOSE */

.wa-close{

  position:absolute;

  top:20px;

  right:20px;

  width:46px;

  height:46px;

  border:none;

  border-radius:14px;

  background:rgba(255,255,255,.06);

  border:1px solid rgba(255,255,255,.08);

  color:#fff;

  display:flex;

  align-items:center;

  justify-content:center;

  cursor:pointer;

  transition:.25s ease;

  z-index:50;
}

.wa-close i{

  font-size:1rem;
}

.wa-close:hover{

  background:rgba(212,175,55,.14);

  border-color:rgba(212,175,55,.25);

  color:var(--gold-main);

  transform:rotate(90deg);
}

/* HEADER */

.wa-header{

  text-align:center;

  margin-bottom:38px;
}

.wa-icon{

  width:84px;

  height:84px;

  margin:auto auto 22px;

  border-radius:26px;

  display:flex;

  align-items:center;

  justify-content:center;

  background:
  linear-gradient(
    145deg,
    rgba(37,211,102,.18),
    rgba(37,211,102,.05)
  );

  color:#25D366;

  font-size:2rem;
}

.wa-badge{

  display:inline-flex;

  padding:8px 16px;

  border-radius:999px;

  margin-bottom:22px;

  background:rgba(212,175,55,.08);

  border:1px solid rgba(212,175,55,.16);

  color:var(--gold-main);

  font-size:.8rem;

  font-weight:700;

  letter-spacing:.08em;

  text-transform:uppercase;
}

.wa-title{

  margin:0 0 16px;

  color:#fff;

  font-size:2.2rem;

  line-height:1.08;

  font-weight:800;
}

.wa-subtitle{

  color:var(--text-muted);

  line-height:1.8;

  font-size:1rem;

  max-width:480px;

  margin:auto;
}

/* FORM */

.wa-form{

  display:flex;

  flex-direction:column;

  gap:24px;
}

.wa-field{

  display:flex;

  flex-direction:column;

  gap:10px;
}

.wa-field label{

  color:#fff;

  font-size:.92rem;

  font-weight:600;
}

.wa-field input,
.wa-field textarea,
.wa-field select{

  width:100%;

  border:none;

  outline:none;

  padding:18px 20px;

  border-radius:18px;

  background:rgba(255,255,255,.03);

  border:1px solid rgba(255,255,255,.06);

  color:#fff;

  font-size:.98rem;

  transition:.25s ease;

  appearance:none;
}

/* SELECT FIX */

.wa-field select{

  cursor:pointer;

  background-color:#111;
}

.wa-field select option{

  background:#111;

  color:#fff;
}

/* TEXTAREA */

.wa-field textarea{

  min-height:170px;

  resize:vertical;
}

/* FOCUS */

.wa-field input:focus,
.wa-field textarea:focus,
.wa-field select:focus{

  border-color:rgba(212,175,55,.35);

  box-shadow:
  0 0 0 4px rgba(212,175,55,.08);
}

/* BUTTON */

.wa-submit{

  margin-top:10px;

  height:64px;

  border:none;

  border-radius:18px;

  background:#25D366;

  color:#fff;

  font-size:1rem;

  font-weight:700;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:12px;

  cursor:pointer;

  transition:.30s ease;

  box-shadow:
  0 16px 45px rgba(37,211,102,.28);
}

.wa-submit:hover{

  transform:translateY(-4px);

  box-shadow:
  0 22px 55px rgba(37,211,102,.35);
}

/* RESPONSIVE */

@media(max-width:640px){

  .wa-modal{

    padding:30px 16px;
  }

  .wa-modal-box{

    padding:50px 24px 34px;
  }

  .wa-title{

    font-size:1.8rem;
  }

  .wa-submit{

    height:60px;
  }
}






/* =========================
   EMAIL MODAL PREMIUM
========================= */

.email-modal{

  position:fixed;

  inset:0;

  z-index:99999;

  display:none;

  align-items:center;

  justify-content:center;

  padding:50px 24px;

  overflow-y:auto;

  background:rgba(0,0,0,.78);

  backdrop-filter:blur(12px);
}

.email-modal.active{

  display:flex;
}

/* BOX */

.email-modal-box{

  width:100%;

  max-width:620px;

  position:relative;

  margin:auto;

  padding:56px 46px;

  border-radius:34px;

  background:
  linear-gradient(
    145deg,
    rgba(18,18,18,.98),
    rgba(8,8,8,.99)
  );

  border:1px solid rgba(212,175,55,.16);

  box-shadow:
  0 25px 80px rgba(0,0,0,.55);

  overflow:visible;
}

.email-modal-box::before{

  content:'';

  position:absolute;

  inset:0;

  border-radius:34px;

  background:
  radial-gradient(
    circle at top right,
    rgba(212,175,55,.08),
    transparent 36%
  );

  pointer-events:none;
}

/* CLOSE */

.email-close{

  position:absolute;

  top:20px;

  right:20px;

  width:46px;

  height:46px;

  border:none;

  border-radius:14px;

  background:rgba(255,255,255,.06);

  border:1px solid rgba(255,255,255,.08);

  color:#fff;

  display:flex;

  align-items:center;

  justify-content:center;

  cursor:pointer;

  transition:.25s ease;

  z-index:50;
}

.email-close:hover{

  background:rgba(212,175,55,.14);

  border-color:rgba(212,175,55,.25);

  color:var(--gold-main);

  transform:rotate(90deg);
}

/* HEADER */

.email-header{

  text-align:center;

  margin-bottom:38px;
}

.email-icon{

  width:84px;

  height:84px;

  margin:auto auto 22px;

  border-radius:26px;

  display:flex;

  align-items:center;

  justify-content:center;

  background:
  linear-gradient(
    145deg,
    rgba(212,175,55,.18),
    rgba(212,175,55,.05)
  );

  color:var(--gold-main);

  font-size:2rem;
}

.email-badge{

  display:inline-flex;

  padding:8px 16px;

  border-radius:999px;

  margin-bottom:22px;

  background:rgba(212,175,55,.08);

  border:1px solid rgba(212,175,55,.16);

  color:var(--gold-main);

  font-size:.8rem;

  font-weight:700;

  letter-spacing:.08em;

  text-transform:uppercase;
}

.email-title{

  margin:0 0 16px;

  color:#fff;

  font-size:2.2rem;

  line-height:1.08;

  font-weight:800;
}

.email-subtitle{

  color:var(--text-muted);

  line-height:1.8;

  font-size:1rem;

  max-width:480px;

  margin:auto;
}

/* FORM */

.email-form{

  display:flex;

  flex-direction:column;

  gap:24px;
}

.email-field{

  display:flex;

  flex-direction:column;

  gap:10px;
}

.email-field label{

  color:#fff;

  font-size:.92rem;

  font-weight:600;
}

.email-field input,
.email-field textarea,
.email-field select{

  width:100%;

  border:none;

  outline:none;

  padding:18px 20px;

  border-radius:18px;

  background:rgba(255,255,255,.03);

  border:1px solid rgba(255,255,255,.06);

  color:#fff;

  font-size:.98rem;

  transition:.25s ease;

  appearance:none;
}

.email-field select{

  cursor:pointer;

  background-color:#111;
}

.email-field select option{

  background:#111;

  color:#fff;
}

.email-field textarea{

  min-height:170px;

  resize:vertical;
}

.email-field input:focus,
.email-field textarea:focus,
.email-field select:focus{

  border-color:rgba(212,175,55,.35);

  box-shadow:
  0 0 0 4px rgba(212,175,55,.08);
}

/* BUTTON */

.email-submit{

  margin-top:10px;

  height:64px;

  border:none;

  border-radius:18px;

  background:var(--gold-main);

  color:#111;

  font-size:1rem;

  font-weight:700;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:12px;

  cursor:pointer;

  transition:.30s ease;

  box-shadow:
  0 16px 45px rgba(212,175,55,.20);
}

.email-submit:hover{

  transform:translateY(-4px);

  box-shadow:
  0 22px 55px rgba(212,175,55,.28);
}

/* RESPONSIVE */

@media(max-width:640px){

  .email-modal{

    padding:30px 16px;
  }

  .email-modal-box{

    padding:50px 24px 34px;
  }

  .email-title{

    font-size:1.8rem;
  }

  .email-submit{

    height:60px;
  }
}