/* Reseller Program page (.mx-hero, .mx-form, .mx-steps, .mx-benefits media/badge, CF7 form). */

/* ---------- Hero (variant of the home hero) ---------- */
body .mh .mx-eyebrow-dark .elementor-heading-title { color: var(--mode-sky); }
body .mh .mx-eyebrow-dark .elementor-heading-title::before { background: var(--mode-sky); }
body .mh.mx-hero .mh-hero__copy { width: 600px; gap: 26px; }
body .mh.mx-hero .mh-hero__media { left: max(50% - 220px, 100% - 1600px); }
body .mh.mx-hero h1.elementor-heading-title { font-size: 54px; line-height: 1.04; letter-spacing: -.015em; color: #fff; }
@media (max-width: 1199px) { body .mh.mx-hero h1.elementor-heading-title { font-size: 48px; } }
@media (max-width: 1024px) { body .mh.mx-hero h1.elementor-heading-title { font-size: 42px; } }
@media (max-width: 640px) {
  body .mh.mx-hero h1.elementor-heading-title { font-size: 34px; line-height: 1.08; }
  body .mh.mx-hero .mh-hero__copy { gap: 22px; }
}

/* ---------- Application form ---------- */
body .mh .mx-form__grid { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 640px); gap: 64px; align-items: start; }
body .mh .mx-form__intro { display: flex; flex-direction: column; gap: 20px; padding-top: 8px; }
body .mh .mx-form__intro .mh-lead a { font-weight: 700; }
body .mh .mx-form__card {
  position: relative; min-width: 0; padding: 40px;
  background: linear-gradient(#eef5fc 0, #f4f7fd 38%, #f7fafd 100%);
  border: 1px solid #dce4f4; border-radius: var(--mode-radius-band); box-shadow: 0 30px 60px -36px rgba(13, 22, 51, .28);
}
body .mh .mx-form__card .wpcf7 form > p:empty { display: none; }
body .mh .mx-form__card .wpcf7-response-output { margin: 18px 0 0; padding: 14px 18px; border: 1px solid var(--mode-gold); border-radius: 12px; background: #fffbf2; font-size: 14px; color: var(--mode-text); }
body .mh .mx-form__card .wpcf7 form.sent .wpcf7-response-output { border-color: #12b76a; background: #ecfdf3; color: #05603a; }
body .mh .mx-form__card .wpcf7 form:is(.invalid, .failed, .spam, .unaccepted) .wpcf7-response-output { border-color: #f2a99e; background: #fef3f2; color: #912018; }
body .mh .mode-trial-form { display: flex; flex-direction: column; gap: 18px; }
body .mh .mode-trial-form p { margin: 0; }
body .mh .mode-trial-form .form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
body .mh .mode-trial-form label { display: block; margin: 0; font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--mode-text-2); }
body .mh .mode-trial-form .req { margin-left: 3px; color: var(--mode-blue); }
body .mh .mode-trial-form .wpcf7-form-control-wrap { display: block; margin-top: 8px; }
body .mh .mode-trial-form :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea) {
  display: block; width: 100%; min-height: 52px; margin: 0; padding: 13px 16px; border: 1px solid #d3dcef; border-radius: 12px; background: #fff;
  font-family: var(--mode-font-body); font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--mode-text);
  box-shadow: 0 1px 2px rgba(13, 22, 51, .04); transition: border-color .2s, box-shadow .2s;
}
body .mh .mode-trial-form textarea { min-height: 110px; height: auto; resize: vertical; }
body .mh .mode-trial-form select {
  appearance: none; -webkit-appearance: none; padding-right: 42px; cursor: pointer;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230171C9' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 16px center no-repeat #fff;
}
body .mh .mode-trial-form ::placeholder { color: #7a889c; opacity: 1; }
body .mh .mode-trial-form :is(input, select, textarea):hover { border-color: #b9cce2; }
body .mh .mode-trial-form :is(input, select, textarea):focus { outline: 0; border-color: var(--mode-blue); box-shadow: 0 0 0 3px rgba(0, 85, 164, .16); }
body .mh .mode-trial-form .wpcf7-not-valid { border-color: #dc6b5a; }
body .mh .mode-trial-form .wpcf7-not-valid-tip { margin-top: 6px; font-size: 13px; font-weight: 600; color: #b42318; }
body .mh .mode-trial-form br { display: none; }
body .mh .mode-trial-form .wpcf7-submit {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 56px; margin: 4px 0 0; padding: 0 26px;
  border: 1.5px solid var(--mode-blue); border-radius: var(--mode-radius-btn); background: var(--mode-blue); color: #fff;
  box-shadow: 0 12px 24px -14px rgba(0, 85, 164, .6); cursor: pointer; font-family: var(--mode-font-body); font-size: 16px; font-weight: 700; line-height: 1.2;
  transition: background-color .3s, border-color .3s;
}
body .mh .mode-trial-form .wpcf7-submit:is(:hover, :focus-visible) { background: var(--mode-blue-hover); border-color: var(--mode-blue-hover); color: #fff; }
body .mh .mode-trial-form .wpcf7-spinner { display: none; }
body .mh .wpcf7 form.submitting .mode-trial-form .wpcf7-spinner { display: block; margin: 10px auto 0; }
body .mh .mode-trial-form .form-note { margin: 0; text-align: center; font-size: 13px; line-height: 1.5; color: var(--mode-muted); }
@media (max-width: 1199px) { body .mh .mx-form__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 560px); gap: 44px; } }
@media (max-width: 1024px) {
  body .mh .mx-form__grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  body .mh .mx-form__card { max-width: 720px; }
}
@media (max-width: 640px) {
  body .mh .mx-form__card { padding: 26px 18px; border-radius: 18px; }
  body .mh .mode-trial-form .form-row { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- How it works steps ---------- */
body .mh .mx-steps { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
body .mh .mx-steps li { position: relative; display: flex; align-items: flex-start; gap: 16px; margin: 0; padding: 0 0 22px; }
body .mh .mx-steps li:last-child { padding-bottom: 0; }
body .mh .mx-steps li:not(:last-child)::after { content: ""; position: absolute; left: 19px; top: 44px; bottom: 4px; width: 2px; border-radius: 1px; background: #cfe0f2; }
body .mh .mx-steps__n {
  flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--mode-blue); color: #fff; box-shadow: 0 0 0 5px #dde7f8; font-family: var(--mode-font-display); font-size: 18px; font-weight: 700; line-height: 1;
}
body .mh .mx-steps__text { display: flex; flex-direction: column; gap: 2px; min-height: 56px; padding-top: 9px; }
body .mh .mx-steps__text strong { font-size: 17px; font-weight: 700; line-height: 1.35; color: var(--mode-text); }
body .mh .mx-steps__detail { font-size: 15px; line-height: 1.5; color: var(--mode-muted); }
body .mh.mx-split .mx-split__media img { aspect-ratio: auto; }

/* ---------- Benefits with photo + badge ---------- */
body .mh .mx-benefits__media { position: relative; min-width: 0; padding-bottom: 32px; }
body .mh .mx-benefits__img img { display: block; width: 100%; height: auto; aspect-ratio: 984 / 720; object-fit: cover; object-position: 50% 0; border-radius: 20px; }
body .mh .mx-badge-slot { position: absolute !important; left: 32px; bottom: 0; width: auto !important; }
body .mh .mx-badge {
  position: relative; width: 150px; height: 150px; display: flex; align-items: center; justify-content: center; padding: 16px; border-radius: 10px;
  background: var(--mode-blue); color: #fff; text-align: center; box-shadow: 0 18px 36px -16px rgba(0, 85, 164, .6);
}
body .mh .mx-badge::before, body .mh .mx-badge::after, body .mh .mx-badge__in::before, body .mh .mx-badge__in::after {
  content: ""; position: absolute; width: 8px; height: 8px; margin: auto; background: var(--mode-blue); transform: rotate(-45deg);
}
body .mh .mx-badge::before { top: -4px; left: 0; right: 0; }
body .mh .mx-badge::after { bottom: -4px; left: 0; right: 0; }
body .mh .mx-badge__in::before { left: -4px; top: 0; bottom: 0; }
body .mh .mx-badge__in::after { right: -4px; top: 0; bottom: 0; }
body .mh .mx-badge__label { max-width: 7.5em; margin: 0 auto; font-size: 13px; font-weight: 600; line-height: 22px; letter-spacing: .2em; text-transform: uppercase; color: #cfe6fa; }
body .mh .mx-badge__num { margin: 4px 0 0; font-family: var(--mode-font-display); font-size: 40px; font-weight: 800; line-height: 1.1; letter-spacing: -.03em; color: #fff; white-space: nowrap; }
@media (max-width: 1199px) {
  body .mh .mx-badge { width: 116px; height: 116px; padding: 12px; }
  body .mh .mx-badge__label { font-size: 11px; line-height: 18px; }
  body .mh .mx-badge__num { font-size: 32px; }
}
@media (max-width: 1024px) {
  body .mh .mx-benefits__media { width: 100%; max-width: 540px; margin-inline: auto; }
  body .mh .mx-badge { width: 140px; height: 140px; padding: 14px; }
  body .mh .mx-badge__label { font-size: 12px; line-height: 20px; }
  body .mh .mx-badge__num { font-size: 38px; }
}
@media (max-width: 640px) {
  body .mh .mx-badge-slot { left: 16px; }
  body .mh .mx-badge { width: 92px; height: 92px; padding: 8px; border-radius: 8px; }
  body .mh .mx-badge__label { font-size: 9px; line-height: 14px; letter-spacing: .14em; }
  body .mh .mx-badge__num { margin-top: 2px; font-size: 24px; }
}

/* ---------- Contact page: plain hero + channel cards + map ---------- */
body .mh.mx-hero--plain { position: relative; overflow: hidden; isolation: isolate; background: var(--mode-ink); color: #fff; padding: calc(var(--mh-header) + 88px) 0 88px; }
body .mh.mx-hero--plain::before {
  content: ""; position: absolute; z-index: -1; inset: 0; opacity: 1; border-radius: 0;
  background: radial-gradient(46% 60% at 76% 50%, rgba(0, 85, 164, .3), rgba(0, 85, 164, 0) 70%),
    radial-gradient(30% 40% at 8% 100%, rgba(143, 178, 242, .08), rgba(143, 178, 242, 0) 70%);
}
body .mh.mx-hero--plain::after {
  content: ""; position: absolute; z-index: -1; top: var(--mh-header); right: -60px; bottom: -40px; width: 220px;
  background: var(--mode-navy-card); opacity: .55; transform: skewX(-14deg);
}
body .mh .mx-hero__stack { display: flex; flex-direction: column; gap: 48px; }
body .mh.mx-hero--plain .mx-hero__copy { display: flex; flex-direction: column; gap: 26px; min-width: 0; max-width: 760px; }
body .mh.mx-hero--plain h1.elementor-heading-title { font-size: 54px; line-height: 1.04; letter-spacing: -.015em; color: #fff; }
body .mh .mx-cards { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
body .mh .mx-card { display: flex; flex-direction: column; gap: 12px; padding: 30px; border: 1px solid #22325e; border-radius: var(--mode-radius-card); background: rgba(19, 40, 90, .85); }
body .mh .mx-card__icon .elementor-icon-wrapper { display: flex; line-height: 0; }
body .mh .mx-card__icon .elementor-icon { width: 52px; height: 52px; border-radius: 14px; background: var(--mode-blue); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 24px; }
body .mh .mx-card__icon svg { width: 24px; height: 24px; }
body .mh .mx-card__title .elementor-heading-title { font-size: 26px; line-height: 1.15; color: #fff; }
body .mh .mx-card__text { font-size: 15px; line-height: 1.7; color: #c4cde3; }
body .mh .mx-card__text a { color: var(--mode-sky); font-weight: 700; text-decoration: none; }
body .mh .mx-card__text a:hover { color: #fff; text-decoration: underline; }
body .mh .mx-card__time { margin-top: auto !important; align-self: flex-start; width: auto !important; }
body .mh .mx-card__time .elementor-heading-title { display: block; padding: 6px 12px; border-radius: 999px; background: #0f2c4a; color: var(--mode-sky); font-family: var(--mode-font-body); font-size: 13px; font-weight: 700; line-height: 1.3; }
body .mh .mx-map { margin-top: 8px; overflow: hidden; border: 1px solid var(--mode-line); border-radius: var(--mode-radius-card); background: var(--mode-paper); }
body .mh .mx-map iframe { display: block; width: 100%; height: 320px; border: 0; }
body .mh .mx-map__ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; height: 320px; padding: 24px; text-align: center; background: linear-gradient(135deg, #0b1a3f, #13285a); color: #c9d4ee; }
body .mh .mx-map__ph p { margin: 0; font-size: 14px; line-height: 1.5; max-width: 300px; }
body .mh .mx-map__btn { min-height: 44px; padding: 10px 22px; border: 1px solid #8fb2f2; border-radius: 999px; background: transparent; color: #fff; font: 700 15px/1 var(--mode-font-body); cursor: pointer; }
body .mh .mx-map__btn:hover, body .mh .mx-map__btn:focus-visible { background: #0055a4; border-color: #0055a4; }
@media (max-width: 1024px) {
  body .mh.mx-hero--plain { padding: calc(var(--mh-header) + 64px) 0 72px; }
  body .mh.mx-hero--plain::after { display: none; }
  body .mh .mx-cards { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
}
@media (max-width: 640px) {
  body .mh.mx-hero--plain { padding: calc(var(--mh-header) + 40px) 0 56px; }
  body .mh.mx-hero--plain .mx-hero__copy { gap: 22px; }
  body .mh.mx-hero--plain h1.elementor-heading-title { font-size: 34px; line-height: 1.08; }
  body .mh .mx-card { padding: 24px; }
  body .mh .mx-map iframe, body .mh .mx-map__ph { height: 260px; }
}
