/* Teachers page (teachers-ar): who the teachers are, how to join (#join) and a button to the application page (#mdk-apply → /join-teacher/, join-teacher-ar). */

.mdk-teachers-ar-hero,
.mdk-teachers-ar-qualities,
.mdk-teachers-ar-who,
.mdk-teachers-ar-join,
.mdk-teachers-ar-benefits,
.mdk-teachers-ar-conditions,
.mdk-teachers-ar-tracks,
.mdk-teachers-ar-apply {
	position: relative;
	/* Anchors land below the sticky header. */
	scroll-margin-top: 96px;
}

/* In-page links (#join, #mdk-conditions, #mdk-apply) glide unless the visitor prefers reduced motion.
   Kadence's own anchor scrolling is switched off for this page (body.no-anchor-scroll, see inc/pages/teachers-ar.php). */
@media (prefers-reduced-motion: no-preference) {
	html:has(.mdk-teachers-ar-join) {
		scroll-behavior: smooth;
	}
}

/* Kadence zeroes the side padding of .alignfull blocks (two classes), so these need two classes too. */
.mdk-section.mdk-teachers-ar-qualities,
.mdk-section.mdk-teachers-ar-stats,
.mdk-section.mdk-teachers-ar-apply {
	padding-inline: var(--mdk-gutter);
}
.mdk-teachers-ar-benefits > .mdk-head,
.mdk-teachers-ar-conditions > .mdk-head,
.mdk-teachers-ar-tracks > .mdk-head {
	padding-inline: var(--mdk-gutter);
}

/* Shared bits */
.mdk-teachers-ar-pill {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	min-height: 32px;
	padding: 4px 14px;
	box-sizing: border-box;
	border: 0.8px solid #afe4e4;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.7);
	color: #356667;
	font-size: 14px;
	line-height: 22px;
}
.mdk-teachers-ar-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}
.mdk-section .mdk-teachers-ar-actions .wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	width: auto;
}
.mdk-section .mdk-teachers-ar-actions .wp-block-button.mdk-btn,
.mdk-teachers-ar-app-btn.mdk-btn {
	width: auto;
}
.mdk-teachers-ar-app-btn.mdk-btn,
.mdk-section .mdk-teachers-ar-actions .wp-block-button.mdk-btn .wp-block-button__link {
	min-width: 220px;
	min-height: 52px;
	font-size: 17px;
	font-weight: 600;
}
.mdk-section .wp-block-button.mdk-teachers-ar-btn-alt .wp-block-button__link {
	background: #fff;
	color: var(--mdk-teal);
}
.mdk-section .wp-block-button.mdk-teachers-ar-btn-alt .wp-block-button__link:hover {
	background: #e2f7f7;
	border-color: var(--mdk-teal);
	color: #188f86;
}
.mdk-teachers-ar-list.mdk-checklist {
	gap: 14px;
}
.mdk-teachers-ar-list.mdk-checklist li {
	align-items: flex-start;
	color: #1f3a3a;
	font-size: 16px;
	font-weight: 500;
	line-height: 27px;
}
.mdk-teachers-ar-list.mdk-checklist li::before {
	margin-top: 0;
	width: 26px;
	height: 26px;
}

/* Hero: the animated world map ([mdk_hero_map], class mdk-has-map) sits behind it. */
.mdk-teachers-ar-hero {
	padding-block: 56px;
}
.mdk-teachers-ar-hero__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 48px;
}
.mdk-teachers-ar-hero__text {
	display: flex;
	flex: 1 1 640px;
	flex-direction: column;
	gap: 20px;
	max-width: 680px;
}
.mdk-teachers-ar-hero__title {
	font-size: 44px;
	font-weight: 500;
	line-height: 1.45;
}
.mdk-teachers-ar-hero__lead {
	color: var(--mdk-muted);
	font-size: 18px;
	line-height: 1.75;
}
.mdk-teachers-ar-hero .mdk-teachers-ar-actions {
	margin-top: 8px;
}
.mdk-teachers-ar-hero__media {
	position: relative;
	display: flex;
	flex: 0 1 460px;
	justify-content: center;
}
.mdk-teachers-ar-hero__media::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 440px;
	height: 440px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(31, 173, 162, 0.2), rgba(31, 173, 162, 0) 68%);
	transform: translate(-50%, -50%);
}
.mdk-teachers-ar-hero__media img {
	position: relative;
	display: block;
	width: 100%;
	max-width: 420px;
	height: auto;
	filter: drop-shadow(0 24px 30px rgba(24, 48, 48, 0.14));
}

/* Stats strip */
.mdk-teachers-ar-stats {
	border-block: 0.8px solid #d0f1f1;
	background: #f9ffff;
}

/* What every teacher has */
.mdk-teachers-ar-qualities {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	padding: 80px var(--mdk-gutter);
}
.mdk-teachers-ar-qualities .mdk-grid {
	padding-inline: 0;
}
.mdk-teachers-ar-quality.mdk-soft-card {
	justify-content: flex-start;
	gap: 12px;
	padding: 32px 20px;
}
.mdk-teachers-ar-quality::before {
	content: "";
	width: 56px;
	height: 56px;
	margin-bottom: 6px;
	border-radius: 50%;
	background: var(--mdk-teal-2) url(../../figma/a656e.svg) center / 30px no-repeat;
	box-shadow: 0 0 0 8px rgba(62, 191, 179, 0.14);
}

/* Who is a Moddakir teacher */
.mdk-teachers-ar-who {
	padding-block: 80px;
	background: #f9f9f9;
}
.mdk-teachers-ar-who__inner {
	display: flex;
	align-items: center;
	gap: 56px;
}
.mdk-teachers-ar-who__text {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
}
.mdk-teachers-ar-who__title {
	color: var(--mdk-ink);
	font-size: 36px;
	font-weight: 500;
	line-height: 1.5;
}
.mdk-teachers-ar-who__lead {
	color: var(--mdk-muted);
	font-size: 18px;
	line-height: 1.7;
}
.mdk-teachers-ar-who .mdk-teachers-ar-app-btn {
	margin-top: 8px;
}
.mdk-teachers-ar-who__media {
	flex: 1 1 0;
	min-width: 0;
}
.mdk-teachers-ar-who__media img {
	display: block;
	width: 100%;
	height: 460px;
	border-radius: 16px;
	object-fit: cover;
}

/* Join (the footer links here: /teachers/#join) */
.mdk-teachers-ar-join {
	overflow: hidden;
	padding-block: 88px;
	background:
		radial-gradient(circle at 12% 18%, rgba(118, 193, 193, 0.28), rgba(118, 193, 193, 0) 38%),
		radial-gradient(circle at 92% 90%, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0) 30%),
		var(--mdk-purple);
	color: #fff;
}
.mdk-teachers-ar-join__inner {
	display: flex;
	align-items: center;
	gap: 56px;
}
.mdk-teachers-ar-join__text {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	gap: 20px;
}
.mdk-teachers-ar-join .mdk-teachers-ar-pill {
	border-color: rgba(255, 255, 255, 0.4);
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
}
.mdk-teachers-ar-join__title {
	color: #fff;
	font-size: 44px;
	font-weight: 500;
	line-height: 1.4;
}
.mdk-teachers-ar-join__lead {
	max-width: 560px;
	color: rgba(255, 255, 255, 0.88);
	font-size: 18px;
	line-height: 1.8;
}
.mdk-section .wp-block-button.mdk-teachers-ar-btn-light .wp-block-button__link {
	border-color: #fff;
	background: #fff;
	color: var(--mdk-purple);
}
.mdk-section .wp-block-button.mdk-teachers-ar-btn-light .wp-block-button__link:hover {
	border-color: var(--mdk-primary-light);
	background: var(--mdk-primary-light);
	color: var(--mdk-purple);
}
.mdk-section .wp-block-button.mdk-teachers-ar-btn-line .wp-block-button__link {
	border-color: rgba(255, 255, 255, 0.7);
	background: transparent;
	color: #fff;
}
.mdk-section .wp-block-button.mdk-teachers-ar-btn-line .wp-block-button__link:hover {
	border-color: #fff;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
}
.mdk-teachers-ar-join__media {
	flex: 1 1 0;
	min-width: 0;
}
.mdk-teachers-ar-join__media img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 24px;
	box-shadow: 0 24px 48px rgba(20, 8, 48, 0.35);
}

/* Why teach with Moddakir: six benefits around the app screen */
.mdk-teachers-ar-benefits {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 48px;
	padding-block: 80px;
}
.mdk-teachers-ar-benefits__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 280px minmax(0, 1fr);
	align-items: center;
	gap: 48px;
}
.mdk-teachers-ar-benefits__col {
	display: flex;
	flex-direction: column;
	gap: 36px;
}
.mdk-teachers-ar-benefit {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	column-gap: 16px;
	row-gap: 6px;
	align-items: start;
}
.mdk-teachers-ar-benefit::before {
	content: "";
	grid-row: 1 / span 2;
	width: 56px;
	height: 56px;
	border-radius: 16px;
	background: var(--mdk-primary-light) center / 28px no-repeat;
}
.mdk-teachers-ar-benefit h3 {
	grid-column: 2;
	color: #111827;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.5;
}
.mdk-teachers-ar-benefit p {
	grid-column: 2;
	color: var(--mdk-muted);
	font-size: 16px;
	line-height: 1.7;
}
.mdk-teachers-ar-benefit--time::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008383' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
}
.mdk-teachers-ar-benefit--impact::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008383' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
}
.mdk-teachers-ar-benefit--easy::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008383' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='2.5'/%3E%3Cpath d='M10.5 18.5h3M9.5 10.5l2 2 3.5-3.5'/%3E%3C/svg%3E");
}
.mdk-teachers-ar-benefit--privacy::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008383' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.4 7.5 9.5 4.3-1.1 7.5-4.9 7.5-9.5V6L12 3Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}
.mdk-teachers-ar-benefit--growth::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008383' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17l6-6 4 4 8-8'/%3E%3Cpath d='M15 7h6v6'/%3E%3C/svg%3E");
}
.mdk-teachers-ar-benefit--reward::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008383' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='8' width='17' height='4' rx='1'/%3E%3Cpath d='M5 12v8.5h14V12M12 8v12.5M12 8S10.5 3.5 8 4.2C6 4.8 7 8 12 8Zm0 0s1.5-4.5 4-3.8c2 .6 1 3.8-4 3.8Z'/%3E%3C/svg%3E");
}
.mdk-teachers-ar-benefits__phone {
	position: relative;
	display: flex;
	justify-content: center;
}
.mdk-teachers-ar-benefits__phone::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 360px;
	height: 360px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(31, 173, 162, 0.2), rgba(31, 173, 162, 0) 68%);
	transform: translate(-50%, -50%);
}
.mdk-teachers-ar-benefits__phone img {
	position: relative;
	display: block;
	width: 260px;
	height: auto;
	filter: drop-shadow(0 24px 30px rgba(24, 48, 48, 0.16));
}

/* Conditions and priorities */
.mdk-teachers-ar-conditions {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	padding-block: 80px;
	border-block: 0.8px solid #d0f1f1;
	background: #f9ffff;
}
.mdk-teachers-ar-conditions__body {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.mdk-teachers-ar-subtitle {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--mdk-ink);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
}
.mdk-teachers-ar-subtitle::before {
	content: "";
	width: 6px;
	height: 26px;
	border-radius: 3px;
	background: var(--mdk-teal);
}
.mdk-teachers-ar-steps + .mdk-teachers-ar-subtitle {
	padding-top: 24px;
}
.mdk-teachers-ar-steps {
	counter-reset: mdk-teachers-step;
}
.mdk-teachers-ar-step,
.mdk-teachers-ar-plus {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 28px 24px;
	box-sizing: border-box;
	border: 0.8px solid #c9eeee;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(35, 74, 75, 0.04);
}
.mdk-teachers-ar-step {
	counter-increment: mdk-teachers-step;
}
.mdk-teachers-ar-step::before {
	content: counter(mdk-teachers-step);
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-bottom: 8px;
	border-radius: 50%;
	background: var(--mdk-teal);
	color: #fff;
	font-size: 20px;
	font-weight: 700;
}
.mdk-teachers-ar-step h4,
.mdk-teachers-ar-plus h4 {
	color: #111827;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.5;
}
.mdk-teachers-ar-step p,
.mdk-teachers-ar-plus p {
	color: var(--mdk-muted);
	font-size: 16px;
	line-height: 1.7;
}
.mdk-teachers-ar-priority {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}
.mdk-teachers-ar-plus {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	column-gap: 16px;
	row-gap: 4px;
	align-items: start;
	border-color: #e2d9f0;
}
.mdk-teachers-ar-plus::before {
	content: "";
	grid-row: 1 / span 2;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #efe9f7 url(../../figma/1bada.svg) center / 14px no-repeat;
}
.mdk-teachers-ar-plus h4,
.mdk-teachers-ar-plus p {
	grid-column: 2;
}

/* Application tracks */
.mdk-teachers-ar-tracks {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	padding-block: 80px;
}
.mdk-teachers-ar-tracks__grid {
	align-items: stretch;
}
.mdk-teachers-ar-track {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 12px 12px 28px;
	box-sizing: border-box;
	border: 1px solid var(--mdk-primary-light);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(35, 74, 75, 0.06);
}
.mdk-teachers-ar-track__head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 20px 16px 16px;
	border-radius: 10px;
	background: linear-gradient(to bottom, var(--mdk-primary-light) 40%, #fff 100%);
}
.mdk-teachers-ar-track__label {
	padding: 3px 12px;
	border-radius: 999px;
	background: var(--mdk-purple);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
}
.mdk-teachers-ar-track__title {
	color: var(--mdk-teal-dark);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.45;
}
.mdk-teachers-ar-track__desc {
	color: var(--mdk-muted);
	font-size: 16px;
	line-height: 1.7;
}
.mdk-teachers-ar-track .mdk-teachers-ar-list {
	padding-inline: 16px;
}

/* Application form */
.mdk-teachers-ar-apply {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	padding: 80px var(--mdk-gutter);
	background: linear-gradient(to top, #fff 75%, #c9f7f7 140%);
}
.mdk-teachers-ar-form {
	width: 100%;
	max-width: 880px;
	padding: 40px;
	box-sizing: border-box;
	border: 0.8px solid #c9eeee;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 12px 40px rgba(35, 74, 75, 0.07);
}
.mdk-teachers-ar-help {
	color: var(--mdk-muted);
	font-size: 16px;
	line-height: 1.7;
	text-align: center;
}
.mdk-teachers-ar-help a {
	color: var(--mdk-teal-dark);
	font-weight: 700;
}
/* The form lives on /join-teacher/ (join-teacher-ar); the teachers page ends with a button to it. */
.mdk-section.mdk-teachers-ar-apply--cta {
	gap: 28px;
}
.mdk-section .wp-block-buttons.mdk-teachers-ar-apply__actions {
	display: flex;
	justify-content: center;
}
.mdk-section.mdk-teachers-ar-apply--page {
	padding-top: 48px;
}
.mdk-section .mdk-teachers-ar-back {
	width: 100%;
	max-width: 880px;
	margin-bottom: -16px;
	font-size: 15px;
	line-height: 1.6;
}
.mdk-teachers-ar-back a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--mdk-teal-dark);
	font-weight: 600;
	text-decoration: none;
}
.mdk-teachers-ar-back a::before {
	content: "→";
}
.mdk-teachers-ar-back a:hover {
	text-decoration: underline;
}

/* Fluent Forms, restyled to match the site */
.mdk-teachers-ar-form .fluentform {
	font-family: "Cairo", system-ui, sans-serif;
}
.mdk-teachers-ar-form .fluentform .ff-el-group {
	margin-bottom: 22px;
}
.mdk-teachers-ar-form .fluentform .ff-el-input--label label {
	color: var(--mdk-ink);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.6;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-control {
	min-height: 48px;
	padding: 10px 14px;
	border: 1px solid #cfe3e3;
	border-radius: 8px;
	background-color: #fff;
	color: var(--mdk-text);
	font-family: inherit;
	font-size: 16px;
	line-height: 1.6;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-control:focus {
	border-color: var(--mdk-teal);
	box-shadow: 0 0 0 3px rgba(31, 173, 162, 0.16);
	outline: none;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-control::placeholder {
	color: #9aa7a5;
}
.mdk-teachers-ar-form .fluentform input[dir="ltr"] {
	text-align: right;
}
.mdk-teachers-ar-form .fluentform input[dir="ltr"]:not(:placeholder-shown) {
	text-align: left;
}
.mdk-teachers-ar-form .fluentform .ff-el-help-message {
	margin-top: 6px;
	color: var(--mdk-muted);
	font-size: 14px;
	font-style: normal;
	line-height: 1.6;
}
.mdk-teachers-ar-form .fluentform .ff-el-section-break {
	margin-top: 12px;
}
.mdk-teachers-ar-form .fluentform .ff-el-section-break:first-child {
	margin-top: 0;
}
.mdk-teachers-ar-form .fluentform .ff-el-section-title {
	margin: 0 0 4px;
	color: var(--mdk-teal-dark);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
}
.mdk-teachers-ar-form .fluentform .ff-section_break_desk {
	color: var(--mdk-muted);
	font-size: 15px;
	line-height: 1.7;
}
.mdk-teachers-ar-form .fluentform .ff-el-section-break hr {
	margin: 12px 0 0;
	border: 0;
	border-top: 0.8px solid #d0f1f1;
	background: none;
}
/* Radios and checkboxes: the whole label row (44px tall) is the tap target. The native input covers it
   invisibly, and the visible box or circle is drawn on the text span that follows it. */
.mdk-teachers-ar-form .fluentform .ff-el-form-check {
	margin-bottom: 0;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check-label {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding-inline-end: 4px;
	color: #1f3a3a;
	font-size: 16px;
	line-height: 1.6;
	cursor: pointer;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check-input {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-input + span {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-input + span::before {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	box-sizing: border-box;
	border: 1.5px solid #9dbcbc;
	border-radius: 6px;
	background: #fff center / 13px no-repeat;
	transition: background-color 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-radio + span::before {
	border-radius: 50%;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-input:checked + span::before {
	border-color: var(--mdk-teal);
	background-color: var(--mdk-teal);
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-checkbox:checked + span::before {
	background-image: url(../../figma/a656e.svg);
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-radio:checked + span::before {
	box-shadow: inset 0 0 0 4px #fff;
}
.mdk-teachers-ar-form .fluentform .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-input:focus-visible + span::before {
	outline: 2px solid var(--mdk-teal);
	outline-offset: 2px;
}
.mdk-teachers-ar-form .fluentform .ff-el-is-error .ff-el-form-check .ff-el-form-check-label > .ff-el-form-check-input:not(:checked) + span::before {
	border-color: #e5484d;
}
/* Fluent Forms keeps inline choices inline only above 640px; short choices stay inline on phones too. */
.mdk-teachers-ar-form .fluentform .ff-el-group.ff_list_inline .ff-el-form-check {
	display: inline-block;
	width: auto;
	margin: 0;
	margin-inline-end: 24px;
}
.mdk-teachers-ar-form .fluentform .ff-el-is-error .ff-el-form-control {
	border-color: #e5484d;
}
.mdk-teachers-ar-form .fluentform .error.text-danger {
	margin-top: 6px;
	color: #c62a2f;
	font-size: 14px;
}
.mdk-teachers-ar-form .fluentform .ff_submit_btn_wrapper {
	margin-top: 8px;
	margin-bottom: 0;
}
.mdk-teachers-ar-form .fluentform .ff-btn-submit {
	width: 100%;
	min-height: 54px;
	padding: 10px 24px;
	border: 0;
	border-radius: 8px;
	background-color: var(--mdk-teal) !important;
	color: #fff !important;
	font-family: inherit;
	font-size: 18px;
	font-weight: 600;
}
.mdk-teachers-ar-form .fluentform .ff-btn-submit:hover {
	background-color: #188f86 !important;
	opacity: 1;
}
.mdk-teachers-ar-form .ff-message-success {
	padding: 24px;
	border: 0.8px solid #afe4e4;
	border-radius: 16px;
	background: #f0fbfb;
	box-shadow: none;
	color: var(--mdk-ink);
	font-size: 17px;
	line-height: 1.8;
	text-align: center;
}
.mdk-teachers-ar-form .ff-message-success p {
	margin: 0;
}

/* Tablet */
@media (max-width: 1100px) {
	.mdk-teachers-ar-hero__title,
	.mdk-teachers-ar-join__title {
		font-size: 36px;
	}
	.mdk-teachers-ar-benefits__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.mdk-teachers-ar-benefits__phone {
		grid-column: 1 / -1;
		order: -1;
	}
	.mdk-teachers-ar-benefits__phone img {
		width: 220px;
	}
}

/* Phone */
@media (max-width: 860px) {
	.mdk-teachers-ar-hero,
	.mdk-teachers-ar-join {
		padding-block: 40px;
	}
	.mdk-teachers-ar-hero__inner,
	.mdk-teachers-ar-who__inner,
	.mdk-teachers-ar-join__inner {
		flex-direction: column;
		align-items: stretch;
		gap: 32px;
	}
	.mdk-teachers-ar-hero__text {
		flex-basis: auto;
	}
	.mdk-teachers-ar-hero__title,
	.mdk-teachers-ar-join__title {
		font-size: 28px;
		line-height: 1.5;
	}
	.mdk-teachers-ar-hero__lead,
	.mdk-teachers-ar-join__lead,
	.mdk-teachers-ar-who__lead {
		font-size: 16px;
	}
	.mdk-teachers-ar-hero__media {
		flex-basis: auto;
	}
	.mdk-teachers-ar-hero__media img {
		max-width: 300px;
	}
	.mdk-teachers-ar-hero__media::before {
		width: 320px;
		height: 320px;
	}
	.mdk-teachers-ar-actions,
	.mdk-section .mdk-teachers-ar-actions .wp-block-buttons {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
	}
	.mdk-section .mdk-teachers-ar-actions .wp-block-button.mdk-btn,
	.mdk-teachers-ar-app-btn.mdk-btn {
		width: 100%;
	}
	.mdk-teachers-ar-who .mdk-teachers-ar-app-btn {
		align-self: stretch;
	}
	.mdk-teachers-ar-qualities,
	.mdk-teachers-ar-who,
	.mdk-teachers-ar-benefits,
	.mdk-teachers-ar-conditions,
	.mdk-teachers-ar-tracks,
	.mdk-teachers-ar-apply {
		gap: 32px;
		padding-block: 48px;
	}
	.mdk-teachers-ar-who__title {
		font-size: 28px;
	}
	.mdk-teachers-ar-who__media img {
		height: 240px;
	}
	.mdk-teachers-ar-benefits__grid,
	.mdk-teachers-ar-priority {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}
	.mdk-teachers-ar-benefits__col {
		gap: 24px;
	}
	.mdk-teachers-ar-benefits__phone img {
		width: 200px;
	}
	.mdk-teachers-ar-benefits__phone::before {
		width: 280px;
		height: 280px;
	}
	.mdk-teachers-ar-form {
		padding: 24px 16px;
		border-radius: 16px;
	}
	.mdk-teachers-ar-form .fluentform .ff-t-container {
		display: block;
	}
	.mdk-teachers-ar-track__head {
		padding: 16px 12px 12px;
	}
	.mdk-teachers-ar-track .mdk-teachers-ar-list {
		padding-inline: 8px;
	}
}

@media (max-width: 560px) {
	.mdk-teachers-ar-stats .mdk-grid--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}
	.mdk-teachers-ar-stats .mdk-stat {
		padding: 12px 4px;
	}
	.mdk-teachers-ar-stats .mdk-stat__value {
		font-size: 30px;
	}
	.mdk-teachers-ar-stats .mdk-stat__label {
		font-size: 14px;
		line-height: 1.6;
	}
}

/* Left-to-right languages: the back link points left. */
html:not([dir="rtl"]) .mdk-teachers-ar-back a::before {
	content: "←";
}

/* Left-to-right languages: placeholders of left-to-right fields line up with the other fields. */
html:not([dir="rtl"]) .mdk-teachers-ar-form .fluentform input[dir="ltr"] {
	text-align: left;
}
