/* =====================================================================
   ModusTech help centre: Support home, 6 topic pages, Common questions, User manuals, Contact us.
   Markup: templates/*.php inside one Elementor shortcode widget per page (container class mt-help-con).
   Same tokens as the Track Order and order confirmation pages.
   ===================================================================== */
.mt-help-page {
	--mt-navy: #1A1A2E;
	--mt-teal: #008A94;
	--mt-teal-dark: #00727A;
	--mt-text: #3A3E52;
	--mt-muted: #4A4E63;
	--mt-line: #DCE6EA;
	--mt-line-soft: #E6EDF0;
	--mt-field: #B9C6CC;
	--mt-tint: #F1F7F9;
	--mt-icon-bg: #E3F2F3;
	--mt-warn-bg: #FFF4E5;
	--mt-warn-line: #F2C27B;
}
/* The Elementor container around the shortcode: page tint, full width, no extra spacing. */
.mt-help-page .mt-help-con { background: var(--mt-tint) !important; padding: 0 20px 72px !important; margin: 0 !important; }
.mt-help-page .mt-help-con > .e-con-inner { max-width: 1200px; padding: 0 !important; }
.mt-help-page .mt-help-con .elementor-widget-shortcode { width: 100%; }

.mt-help {
	font-family: Jost, Arial, sans-serif;
	color: var(--mt-text);
	display: flex;
	flex-direction: column;
	gap: 28px;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding-top: 140px; /* clear the floating site header */
	text-align: left;
	box-sizing: border-box;
	font-size: 17px;
}
.mt-help *, .mt-help *::before, .mt-help *::after { box-sizing: border-box; }
/* The theme gives every section a top margin and 5-8rem of padding and sets its own link size; the layout spacing
   comes from gap. :where keeps this weaker than the card padding below. */
.mt-help :where(section, nav, article, aside) { margin: 0; padding: 0; }
.mt-help p { margin: 0; line-height: 1.6; }
.mt-help a { color: var(--mt-teal-dark); font-size: inherit; font-family: inherit; }
.mt-help a:focus-visible, .mt-help summary:focus-visible, .mt-help button:focus-visible, .mt-help input:focus-visible { outline: 3px solid var(--mt-navy); outline-offset: 3px; }

/* Headings: the theme styles h1-h3 globally, so every value is set here. */
.mt-help .mt-help__title { margin: 0 !important; font-size: 44px !important; line-height: 1.15 !important; font-weight: 600 !important; color: var(--mt-navy) !important; text-transform: none !important; letter-spacing: 0 !important; font-family: inherit !important; }
.mt-help .mt-help__h2 { margin: 0 !important; font-size: 28px !important; line-height: 1.25 !important; font-weight: 600 !important; color: var(--mt-navy) !important; text-transform: none !important; letter-spacing: 0 !important; font-family: inherit !important; }
.mt-help .mt-help__h3 { margin: 0 !important; font-size: 21px !important; line-height: 1.3 !important; font-weight: 600 !important; color: var(--mt-navy) !important; text-transform: none !important; letter-spacing: 0 !important; font-family: inherit !important; }
.mt-help .mt-help__h3 a { color: inherit; text-decoration: none; }
.mt-help .mt-help__label { margin: 0 !important; font-size: 13px !important; line-height: 1.4 !important; font-weight: 600 !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: var(--mt-muted) !important; font-family: inherit !important; }
.mt-help__lead { font-size: 18px; max-width: 820px; }
.mt-help__intro { display: flex; flex-direction: column; gap: 10px; }

.mt-help__card { background: #ffffff; border: 1px solid var(--mt-line); border-radius: 18px; padding: 28px; }

/* Buttons and small links */
.mt-help .mt-help__btn { min-height: 50px; padding: 0 26px; border-radius: 999px; background: var(--mt-teal); border: 2px solid var(--mt-teal); color: #ffffff; text-decoration: none; font-size: 16px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.mt-help .mt-help__btn:hover { background: var(--mt-teal-dark); border-color: var(--mt-teal-dark); color: #ffffff; }
.mt-help .mt-help__btn--outline { background: #ffffff; color: var(--mt-teal-dark); border-color: var(--mt-teal-dark); }
.mt-help .mt-help__btn--outline:hover { background: var(--mt-tint); color: var(--mt-teal-dark); }
.mt-help .mt-help__more { font-size: 15px; font-weight: 600; text-decoration: none; }
.mt-help .mt-help__more:hover { text-decoration: underline; }

.mt-help__icon { width: 44px; height: 44px; flex: none; border-radius: 50%; background: var(--mt-icon-bg); color: var(--mt-teal-dark); display: flex; align-items: center; justify-content: center; }
.mt-help__icon--sq { width: 56px; height: 56px; border-radius: 14px; }

/* Breadcrumb */
.mt-help__crumbs { font-size: 15px; display: flex; gap: 8px; align-items: center; color: var(--mt-muted); margin-bottom: -6px; }
.mt-help__crumbs a { text-decoration: none; }

/* ---- Home ---- */
.mt-help__hero { display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.mt-help--home .mt-help__title { font-size: 48px !important; }
.mt-help__hero .mt-help__lead { max-width: 640px; }
.mt-help__search { width: 100%; max-width: 720px; margin-top: 10px; display: flex; align-items: center; gap: 12px; min-height: 60px; background: #ffffff; border: 1px solid var(--mt-field); border-radius: 999px; padding: 6px 7px 6px 22px; color: var(--mt-muted); }
.mt-help__search:focus-within { border-color: var(--mt-teal-dark); box-shadow: 0 0 0 3px rgba(0, 138, 148, .18); }
.mt-help__search svg { flex: none; }
.mt-help .mt-help__search input[type="search"] { flex: 1; min-width: 0; height: 46px; border: 0 !important; outline: none; box-shadow: none !important; padding: 0 !important; margin: 0; font-size: 17px; font-family: inherit; color: var(--mt-navy); background: transparent !important; }
.mt-help .mt-help__search input[type="search"]:focus-visible { outline: none; }
.mt-help .mt-help__search button { flex: none; height: 46px; padding: 0 26px; border: 0; border-radius: 999px; background: var(--mt-teal); color: #ffffff; font-size: 16px; font-weight: 600; font-family: inherit; text-transform: none; letter-spacing: 0; cursor: pointer; }
.mt-help .mt-help__search button:hover { background: var(--mt-teal-dark); }

.mt-help__results { display: flex; flex-direction: column; gap: 12px; }
.mt-help__results ul { list-style: none; margin: 0; padding: 0; }
.mt-help__results li { border-top: 1px solid var(--mt-line-soft); }
.mt-help__results li a { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; text-decoration: none; }
.mt-help__results li strong { color: var(--mt-navy); font-weight: 600; }
.mt-help__results li span { font-size: 14px; color: var(--mt-muted); white-space: nowrap; }

.mt-help__actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.mt-help__actions a, .mt-help__way { background: #ffffff; border: 1px solid var(--mt-line); border-radius: 14px; padding: 20px 22px; text-decoration: none; display: flex; gap: 14px; align-items: center; }
.mt-help__actions a:hover, .mt-help__way:hover, .mt-help__links a:hover { border-color: var(--mt-teal); }
.mt-help__actions a > span:last-child, .mt-help__way > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.mt-help__actions strong, .mt-help__way strong { font-size: 17px; font-weight: 600; color: var(--mt-navy); }
.mt-help__actions span span, .mt-help__way span span { font-size: 14px; color: var(--mt-muted); }

.mt-help__section { display: flex; flex-direction: column; gap: 18px; }
.mt-help__topics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mt-help__topic { display: flex; flex-direction: column; gap: 10px; }
.mt-help__topic > p { font-size: 15px; color: var(--mt-muted); }
.mt-help__topic ul { list-style: none; margin: 4px 0 0; padding: 0; flex: 1; }
.mt-help__topic li { border-top: 1px solid var(--mt-line-soft); margin: 0; }
.mt-help__topic li a { display: block; padding: 12px 0; font-size: 16px; color: var(--mt-text); text-decoration: none; }
.mt-help__topic li a:hover { color: var(--mt-teal-dark); }

.mt-help__talk { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 32px 40px; }
.mt-help__talk > div:first-child { display: flex; flex-direction: column; gap: 6px; }
.mt-help__talk .mt-help__h2 { font-size: 26px !important; }
.mt-help__talk-links { display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }

.mt-help__links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.mt-help__links a { background: #ffffff; border: 1px solid var(--mt-line); border-radius: 14px; padding: 18px 20px; text-decoration: none; display: flex; flex-direction: column; gap: 4px; }
.mt-help__links strong { font-size: 16px; font-weight: 600; color: var(--mt-navy); }
.mt-help__links span { font-size: 14px; color: var(--mt-muted); }

/* ---- Topic page and Common questions: expandable answers ---- */
.mt-help__cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; }
.mt-help__qs, .mt-help__group { display: flex; flex-direction: column; gap: 14px; }
.mt-help__group { margin-top: 6px; }
.mt-help__q { background: #ffffff; border: 1px solid var(--mt-line); border-radius: 16px; padding: 0 30px; }
.mt-help__q > summary { list-style: none; cursor: pointer; padding: 22px 0; display: flex; justify-content: space-between; align-items: center; gap: 16px; color: var(--mt-navy); scroll-margin-top: 130px; }
.mt-help__q > summary::-webkit-details-marker { display: none; }
.mt-help__q > summary h2, .mt-help__q > summary h3 { margin: 0 !important; font-size: 21px !important; line-height: 1.35 !important; font-weight: 600 !important; color: var(--mt-navy) !important; text-transform: none !important; letter-spacing: 0 !important; font-family: inherit !important; }
.mt-help--faqs .mt-help__q > summary h3 { font-size: 19px !important; }
.mt-help__chev { flex: none; color: var(--mt-teal-dark); transition: transform .2s; }
.mt-help__q[open] > summary .mt-help__chev { transform: rotate(180deg); }
.mt-help__q > summary:hover h2, .mt-help__q > summary:hover h3 { color: var(--mt-teal-dark) !important; }
/* A #link lands on the answer: leave room for the floating header and the question above it. */
.mt-help__a { scroll-margin-top: 200px; border-top: 1px solid var(--mt-line-soft); padding: 18px 0 26px; display: flex; flex-direction: column; gap: 14px; line-height: 1.65; }
.mt-help__a ol, .mt-help__a ul { margin: 0; padding-left: 24px; display: flex; flex-direction: column; gap: 10px; }
.mt-help__a li { margin: 0; line-height: 1.6; }
.mt-help__a strong { color: var(--mt-navy); }
.mt-help .mt-help__warn { background: var(--mt-warn-bg); border: 1px solid var(--mt-warn-line); border-radius: 12px; padding: 12px 16px; }

.mt-help__aside { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 120px; }
.mt-help__stuck { display: flex; flex-direction: column; gap: 12px; padding: 24px 26px; }
.mt-help__stuck p { font-size: 15px; }
.mt-help__others { display: flex; flex-direction: column; padding: 22px 26px; }
.mt-help__others .mt-help__label { margin-bottom: 6px !important; }
.mt-help__others a { padding: 8px 0; font-size: 16px; text-decoration: none; color: var(--mt-text); }
.mt-help__others a:hover { color: var(--mt-teal-dark); }

.mt-help--faqs { max-width: 960px; }
.mt-help__pills { display: flex; gap: 10px; flex-wrap: wrap; }
.mt-help__pills a { min-height: 44px; padding: 0 20px; border-radius: 999px; border: 1px solid var(--mt-field); background: #ffffff; color: var(--mt-navy); font-size: 15px; font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; }
.mt-help__pills a:hover { border-color: var(--mt-teal-dark); color: var(--mt-teal-dark); }
.mt-help__group { scroll-margin-top: 130px; }

/* ---- Manuals ---- */
.mt-help__manuals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mt-help__manual { display: flex; flex-direction: column; gap: 14px; padding: 26px 28px; }
.mt-help__manual-head { display: flex; gap: 16px; align-items: center; }
.mt-help__manual-head > div { display: flex; flex-direction: column; gap: 2px; }
.mt-help__manual-head span { font-size: 15px; color: var(--mt-muted); }
.mt-help__soon { min-height: 50px; border-radius: 999px; background: #EEF2F4; color: var(--mt-muted); font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.mt-help__manual--ask { background: transparent; border-style: dashed; border-color: var(--mt-field); justify-content: center; gap: 10px; }
.mt-help__manual--ask p { font-size: 15px; }

/* ---- Contact ---- */
.mt-help__contact { display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: 28px; align-items: start; }
.mt-help__ways { display: flex; flex-direction: column; gap: 14px; }
.mt-help__address { font-size: 15px; padding: 4px; }
.mt-help__quick { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px; }
.mt-help__quick .mt-help__h3 { font-size: 17px !important; }
.mt-help__quick a { font-size: 16px; text-decoration: none; }
.mt-help__form { display: flex; flex-direction: column; gap: 14px; padding: 32px 36px; }
.mt-help__form .mt-help__h2 { font-size: 24px !important; }
.mt-help__form > p { font-size: 15px; color: var(--mt-muted); }
/* Forminator form in the ModusTech style. */
.mt-help__form .forminator-ui.forminator-custom-form { margin: 0 !important; font-family: inherit !important; }
.mt-help__form .forminator-label { font-family: inherit !important; font-size: 15px !important; font-weight: 600 !important; color: var(--mt-navy) !important; }
/* The form uses Forminator's "material" design (labels floating inside the fields): labels sit above the boxes here. */
.mt-help__form .forminator-design--material .forminator-field { padding-top: 0 !important; }
.mt-help__form .forminator-design--material .forminator-label { position: static !important; transform: none !important; display: block !important; margin: 0 0 8px !important; padding: 0 !important; line-height: 1.4 !important; pointer-events: auto !important; }
.mt-help__form .forminator-design--material .forminator-input--wrap::before,
.mt-help__form .forminator-design--material .forminator-input--wrap::after,
.mt-help__form .forminator-design--material .forminator-field::before,
.mt-help__form .forminator-design--material .forminator-field::after { display: none !important; }
.mt-help__form .forminator-design--material .forminator-textarea { padding-top: 12px !important; min-height: 140px; }
.mt-help__form .forminator-input, .mt-help__form .forminator-textarea { font-family: inherit !important; font-size: 17px !important; color: var(--mt-navy) !important; border: 1px solid var(--mt-field) !important; border-radius: 10px !important; background: #ffffff !important; padding: 12px 16px !important; }
.mt-help__form .forminator-input:focus, .mt-help__form .forminator-textarea:focus { border-color: var(--mt-teal-dark) !important; box-shadow: 0 0 0 3px rgba(0, 138, 148, .18) !important; }
.mt-help__form .forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit { font-family: inherit !important; min-height: 52px !important; padding: 0 36px !important; border-radius: 999px !important; background: var(--mt-teal) !important; color: #ffffff !important; font-size: 17px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; box-shadow: none !important; }
.mt-help__form .forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit:hover { background: var(--mt-teal-dark) !important; }

/* ---- Tablet ---- */
@media (max-width: 1024px) {
	.mt-help__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mt-help__topics, .mt-help__manuals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mt-help__cols, .mt-help__contact { grid-template-columns: minmax(0, 1fr); }
	.mt-help__aside { position: static; }
	.mt-help__talk { flex-direction: column; align-items: flex-start; }
	.mt-help__talk-links { justify-content: flex-start; }
}

/* ---- Phone ---- */
@media (max-width: 767px) {
	.mt-help-page .mt-help-con { padding: 0 16px 48px !important; }
	.mt-help { padding-top: 104px; gap: 22px; font-size: 16px; }
	.mt-help .mt-help__title, .mt-help--home .mt-help__title { font-size: 32px !important; }
	.mt-help .mt-help__h2 { font-size: 23px !important; }
	.mt-help__lead { font-size: 16px; }
	.mt-help__hero { align-items: flex-start; text-align: left; }
	.mt-help__search { min-height: 54px; padding: 4px 4px 4px 16px; }
	.mt-help .mt-help__search button { padding: 0 16px; height: 44px; }
	.mt-help__card { padding: 20px; border-radius: 16px; }
	.mt-help__actions { gap: 12px; }
	.mt-help__actions a { flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px; }
	.mt-help__actions strong { font-size: 16px; }
	.mt-help__topics, .mt-help__manuals, .mt-help__links { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.mt-help__talk { padding: 22px 20px; gap: 14px; }
	.mt-help__talk-links { flex-direction: column; width: 100%; }
	.mt-help__talk-links .mt-help__btn, .mt-help__stuck .mt-help__btn { width: 100%; }
	.mt-help__q { padding: 0 20px; }
	.mt-help__q > summary { padding: 18px 0; scroll-margin-top: 90px; }
	.mt-help__q > summary h2, .mt-help__q > summary h3, .mt-help--faqs .mt-help__q > summary h3 { font-size: 18px !important; }
	.mt-help__a { padding: 14px 0 22px; scroll-margin-top: 160px; }
	.mt-help__a ol, .mt-help__a ul { padding-left: 20px; }
	.mt-help__results li a { flex-direction: column; gap: 2px; }
	.mt-help__form { padding: 22px 20px; }
}