/* assets/css/ije-contact.css */


/* =========================================================
   CONTACT PAGE
   ========================================================= */

.ije-contact-page {
  overflow: hidden;

  background:
    linear-gradient(
      180deg,
      #fffdf8 0%,
      #ffffff 44%,
      #f8fbff 100%
    );

  color: var(--ije-text);
}


/* =========================================================
   HERO
   ========================================================= */

.ije-contact-hero {
  position: relative;
  min-height: 390px;

  display: flex;
  align-items: center;

  overflow: hidden;

  color: #fff;

  background-size: cover;
  background-position: bottom;
}

.ije-contact-hero::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 1;

  background:
    radial-gradient(
      circle at top left,
      rgba(0, 168, 232, .22),
      transparent 30%
    ),
    radial-gradient(
      circle at 88% 16%,
      rgba(254, 209, 0, .10),
      transparent 25%
    ),
    linear-gradient(
      90deg,
      rgba(7, 24, 39, .90) 0%,
      rgba(7, 24, 39, .72) 46%,
      rgba(7, 24, 39, .38) 100%
    );
}

.ije-contact-hero .container {
  position: relative;
  z-index: 2;

  max-width: 980px;

  text-align: center;
}

.ije-contact-eyebrow {
  display: inline-flex;
  align-items: center;

  gap: .45rem;

  margin-bottom: 1rem;
  padding: .42rem .78rem;

  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;

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

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  color: #fff;

  font-size: .9rem;
  font-weight: 800;
}

.ije-contact-hero h1 {
  max-width: 900px;

  margin-left: auto;
  margin-right: auto;

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: 1.05;
}

.ije-contact-hero p {
  max-width: 780px;

  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;

  color: rgba(255, 255, 255, .90);

  font-size: 1.05rem;
  line-height: 1.7;
}

.ije-contact-hero-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;

  gap: .75rem;

  margin-top: 1.45rem;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.ije-contact-btn-primary,
.ije-contact-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: .45rem;

  padding: .78rem 1.1rem;

  border-radius: 999px;

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 800;

  text-decoration: none;
}

.ije-contact-btn-primary {
  border: 0;

  background:
    linear-gradient(
      135deg,
      var(--ije-yellow),
      var(--ije-orange)
    );

  color: var(--ije-navy) !important;
}

.ije-contact-btn-secondary {
  border: 1px solid rgba(255, 255, 255, .26);

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

  color: #fff !important;
}


/* =========================================================
   CONTACT CONTENT
   ========================================================= */

.ije-contact-content {
  position: relative;
  overflow: hidden;

  padding: 4rem 0;

  background:
    radial-gradient(
      circle at 7% 12%,
      rgba(254, 209, 0, .13),
      transparent 27%
    ),
    radial-gradient(
      circle at 95% 88%,
      rgba(0, 168, 232, .08),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #fffdf7 0%,
      #ffffff 46%,
      #f8fbff 100%
    );

  border-bottom:
    1px solid rgba(7, 24, 39, .05);
}

.ije-contact-intro {
  max-width: 720px;

  margin-bottom: 2rem;
}

.ije-contact-intro h2 {
  margin-bottom: .55rem;

  color: var(--ije-navy);

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -.03em;
}

.ije-contact-intro p {
  margin-bottom: 0;

  color: var(--ije-muted);

  line-height: 1.7;
}


/* =========================================================
   CONTACT CARDS
   ========================================================= */

.ije-contact-panel,
.ije-contact-form-card {
  height: 100%;

  border: 1px solid rgba(7, 24, 39, .08);
  border-radius: 22px;

  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, .98),
      rgba(251, 252, 255, .98)
    );

  box-shadow:
    0 18px 42px rgba(7, 24, 39, .08);
}

.ije-contact-panel {
  padding: 1.65rem;
}

.ije-contact-form-card {
  padding: 1.8rem;
}

.ije-contact-panel h3,
.ije-contact-form-card h3 {
  margin-bottom: .6rem;

  color: var(--ije-navy);

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 800;
}

.ije-contact-panel > p,
.ije-contact-form-card > p {
  margin-bottom: 1.4rem;

  color: var(--ije-muted);

  line-height: 1.65;
}


/* =========================================================
   CONTACT METHODS
   ========================================================= */

.ije-contact-methods {
  display: grid;

  gap: .8rem;
}

.ije-contact-method {
  display: flex;
  align-items: center;

  gap: .8rem;

  padding: .9rem;

  border: 1px solid rgba(7, 24, 39, .07);
  border-radius: 16px;

  background:
    linear-gradient(
      180deg,
      #ffffff,
      #f8fbff
    );
}

.ije-contact-method i {
  width: 36px;
  height: 36px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 auto;

  border: 1px solid rgba(7, 24, 39, .07);
  border-radius: 50%;

  background:
    linear-gradient(
      135deg,
      rgba(0, 168, 232, .10),
      rgba(254, 209, 0, .18)
    );

  color: var(--ije-blue-dark);
}

.ije-contact-method strong {
  display: block;

  color: var(--ije-navy);

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 800;
  line-height: 1.2;
}

.ije-contact-method a,
.ije-contact-method span {
  color: var(--ije-muted);

  font-size: .92rem;
  font-weight: 700;

  text-decoration: none;
}

.ije-contact-method a:hover {
  color: var(--ije-blue-dark);
}


/* =========================================================
   CONTACT NOTE
   ========================================================= */

.ije-contact-note {
  margin-top: 1.2rem;
  padding: 1rem;

  border-radius: 16px;

  background:
    radial-gradient(
      circle at top right,
      rgba(254, 209, 0, .16),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      var(--ije-navy),
      #0b2238
    );

  box-shadow:
    0 18px 34px rgba(7, 24, 39, .14);

  color: #fff;
}

.ije-contact-note strong {
  display: block;

  margin-bottom: .25rem;

  color: var(--ije-yellow);

  font-family: 'Poppins', system-ui, sans-serif;
}

.ije-contact-note p {
  margin: 0;

  color: rgba(255, 255, 255, .82);

  font-size: .92rem;
  line-height: 1.6;
}


/* =========================================================
   FORM
   ========================================================= */

.ije-contact-form-card .form-label {
  margin-bottom: .35rem;

  color: var(--ije-navy);

  font-size: .92rem;
  font-weight: 800;
}

.ije-contact-form-card .form-control,
.ije-contact-form-card .form-select {
  padding: .78rem .9rem;

  border: 1px solid #dfe5ec;
  border-radius: 12px;

  background-color: #fff;

  box-shadow: none;

  color: var(--ije-text);
}

.ije-contact-form-card .form-control:focus,
.ije-contact-form-card .form-select:focus {
  border-color: var(--ije-blue);

  box-shadow:
    0 0 0 .18rem rgba(0, 168, 232, .12);
}

.ije-contact-submit {
  padding: .78rem 1.15rem;

  border: 0;
  border-radius: 999px;

  background:
    linear-gradient(
      135deg,
      var(--ije-yellow),
      var(--ije-orange)
    );

  color: var(--ije-navy);

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 800;
}

.ije-contact-alert {
  border: 0;
  border-radius: 14px;

  font-weight: 700;
}


/* =========================================================
   FAQ
   ========================================================= */

.ije-contact-faq {
  position: relative;
  overflow: hidden;

  padding: 3rem 0;

  border-top: 1px solid rgba(7, 24, 39, .045);

  background:
    radial-gradient(
      circle at 8% 16%,
      rgba(254, 209, 0, .10),
      transparent 26%
    ),
    radial-gradient(
      circle at 92% 84%,
      rgba(0, 168, 232, .075),
      transparent 28%
    ),
    linear-gradient(
      180deg,
      #f8fbff 0%,
      #fffdf8 100%
    );
}

.ije-contact-faq-title {
  margin-bottom: 1.25rem;

  color: var(--ije-navy);

  font-family: 'Poppins', system-ui, sans-serif;
  font-weight: 800;
}

.ije-contact-faq-card {
  height: 100%;

  padding: 1.2rem;

  border: 1px solid rgba(7, 24, 39, .08);
  border-radius: 18px;

  background:
    linear-gradient(
      180deg,
      #ffffff,
      #fbfcff
    );

  box-shadow:
    0 12px 30px rgba(7, 24, 39, .05);
}

.ije-contact-faq-card h3 {
  margin-bottom: .45rem;

  color: var(--ije-navy);

  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 800;
}

.ije-contact-faq-card p {
  margin-bottom: 0;

  color: var(--ije-muted);

  line-height: 1.6;
}


/* =========================================================
   FEEDBACK MODAL
   ========================================================= */

.ije-contact-feedback-modal .modal-content {
  overflow: hidden;

  border: 0;
  border-radius: 20px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 991.98px) {
  .ije-contact-hero {
    min-height: 360px;
  }

  .ije-contact-content {
    padding: 3rem 0;
  }
}

@media (max-width: 575.98px) {
  .ije-contact-hero {
    min-height: 350px;
  }

  .ije-contact-hero h1 {
    font-size: 2.15rem;
  }

  .ije-contact-hero-actions,
  .ije-contact-btn-primary,
  .ije-contact-btn-secondary,
  .ije-contact-submit {
    width: 100%;
  }

  .ije-contact-panel,
  .ije-contact-form-card {
    padding: 1.25rem;

    border-radius: 18px;
  }

  body.page-template-template-contact .ije-footer-trust,
  body.page-template-contact .ije-footer-trust {
    display: none;
  }
}