/*
 * ELLT Blog category stylesheet.
 * This file owns the complete ELLT article presentation so the category can
 * be changed later without altering IELTS, SAT, GRE, GMAT, PTE, OET or DET.
 */
.mks-ellt-article {
	--mks-exam-primary: #4c1d95;
	--mks-exam-primary-strong: #3b0764;
	--mks-exam-primary-soft: #f5f3ff;
	--mks-exam-heading: #991b1b;
	--mks-exam-accent: #f4c430;
	--mks-exam-success: #0b7a75;
	--mks-exam-ink: #29243a;
	--mks-exam-muted: #625d70;
	--mks-exam-border: #ddd6fe;
	color: var(--mks-exam-ink);
}

.mks-ellt-article .mks-blog-hero {
	background:
		radial-gradient(circle at 92% 15%, rgba(255, 205, 57, 0.24), transparent 28%),
		linear-gradient(135deg, rgba(109, 40, 217, 0.10), rgba(255, 255, 255, 0) 62%),
		#ffffff;
}

.mks-ellt-article .mks-blog-hero .mks-eyebrow,
.mks-ellt-article .mks-ielts-kicker,
.mks-ellt-article .mks-section-intro > .eyebrow {
	display: inline-flex;
	align-items: center;
	width: fit-content;
	margin: 0 0 14px;
	padding: 7px 12px;
	border: 1px solid #c4b5fd;
	border-radius: 999px;
	background: var(--mks-exam-primary-soft);
	color: var(--mks-exam-primary);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.07em;
	line-height: 1.2;
	text-transform: uppercase;
}

.mks-ellt-article .mks-blog-hero .mks-eyebrow {
	border-color: var(--mks-exam-primary);
	background: var(--mks-exam-primary);
	color: #ffffff;
}

.mks-ellt-article .mks-blog-hero h1,
.mks-ellt-article .mks-section-intro h2 {
	color: var(--mks-exam-heading);
}

.mks-ellt-article .mks-ielts-body {
	padding: clamp(24px, 4vw, 52px);
	border-right: 1px solid #d8dee7;
	border-bottom: 1px solid #d8dee7;
	border-left: 1px solid #d8dee7;
	background: #ffffff;
}

.mks-ellt-article .mks-quick-answer {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 12px;
	align-items: start;
	margin: 0 0 16px;
	padding: 18px 20px;
	border: 1px solid #b9ddd9;
	border-left: 5px solid var(--mks-exam-success);
	border-radius: 14px;
	background: #effcf9;
}

.mks-ellt-article .mks-quick-answer .icon {
	display: flex;
	margin-top: 2px;
}

.mks-ellt-article .mks-quick-answer p,
.mks-ellt-article .mks-choice-note p {
	margin: 0;
}

.mks-ellt-article .mks-choice-note {
	margin: 16px 0 0;
	padding: 17px 19px;
	border: 1px solid #ead48b;
	border-radius: 12px;
	background: linear-gradient(135deg, #fffdf4, #fff8dc);
	color: #463d24;
}

.mks-ellt-article .mks-ielts-section {
	margin-top: clamp(30px, 4vw, 46px);
	padding: clamp(22px, 3vw, 32px);
	border: 1px solid #e2e0e8;
	border-radius: 18px;
	background: linear-gradient(180deg, #ffffff, #fcfbff);
	box-shadow: 0 14px 34px rgba(49, 46, 66, 0.07);
}

.mks-ellt-article .mks-section-intro {
	max-width: 930px;
	margin-bottom: 22px;
}

.mks-ellt-article .mks-section-intro h2 {
	margin: 0 0 10px;
	font-size: clamp(1.55rem, 2.4vw, 2.15rem);
	line-height: 1.18;
}

.mks-ellt-article .mks-section-intro p {
	margin: 0;
	color: var(--mks-exam-muted);
}

.mks-ellt-article .mks-proof-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

.mks-ellt-article .mks-proof-card {
	position: relative;
	min-width: 0;
	padding: 22px;
	border: 1px solid var(--mks-exam-border);
	border-radius: 16px;
	background: linear-gradient(150deg, #ffffff 48%, var(--mks-exam-primary-soft));
	box-shadow: 0 10px 24px rgba(76, 29, 149, 0.08);
}

.mks-ellt-article .mks-proof-card::before {
	position: absolute;
	top: 0;
	left: 20px;
	width: 52px;
	height: 4px;
	border-radius: 0 0 999px 999px;
	background: linear-gradient(90deg, var(--mks-exam-primary), var(--mks-exam-accent));
	content: "";
}

.mks-ellt-article .mks-proof-card h3 {
	margin: 3px 0 10px;
	color: var(--mks-exam-primary-strong);
	font-size: 1.25rem;
	line-height: 1.25;
}

.mks-ellt-article .mks-proof-card p:last-child {
	margin-bottom: 0;
}

.mks-ellt-article .mks-two-col {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.mks-ellt-article .mks-list-card,
.mks-ellt-article .mks-source-box,
.mks-ellt-article .mks-related-box {
	min-width: 0;
	padding: 24px;
	border: 1px solid var(--mks-exam-border);
	border-radius: 16px;
	background: #ffffff;
}

.mks-ellt-article .mks-list-card.purple,
.mks-ellt-article .mks-source-box {
	background: var(--mks-exam-primary-soft);
}

.mks-ellt-article .mks-list-card h2,
.mks-ellt-article .mks-source-box h2,
.mks-ellt-article .mks-related-box h2 {
	margin-top: 0;
	color: var(--mks-exam-primary-strong);
	font-size: 1.35rem;
}

.mks-ellt-article .mks-list-card li,
.mks-ellt-article .mks-source-box li,
.mks-ellt-article .mks-related-box li {
	margin-bottom: 9px;
}

.mks-ellt-article .mks-table-wrap {
	max-width: 100%;
	overflow-x: auto;
	border: 1px solid #d6d0e4;
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(49, 46, 66, 0.06);
	-webkit-overflow-scrolling: touch;
}

.mks-ellt-article .mks-ielts-table {
	width: 100%;
	min-width: 660px;
	margin: 0;
	border: 0;
	border-collapse: separate;
	border-spacing: 0;
}

.mks-ellt-article .mks-ielts-table th,
.mks-ellt-article .mks-ielts-table td {
	padding: 14px 16px;
	border-right: 1px solid #e3dfeb;
	border-bottom: 1px solid #e3dfeb;
	text-align: left;
	vertical-align: top;
}

.mks-ellt-article .mks-ielts-table thead th {
	background: linear-gradient(135deg, var(--mks-exam-primary), #6d28d9);
	color: #ffffff;
}

.mks-ellt-article .mks-ielts-table tbody th {
	background: #ede9fe;
	color: var(--mks-exam-ink);
}

.mks-ellt-article .mks-ielts-table tbody tr:nth-child(even) td {
	background: #faf9ff;
}

.mks-ellt-article .mks-ielts-table tr > :last-child {
	border-right: 0;
}

.mks-ellt-article .mks-ielts-table tbody tr:last-child > * {
	border-bottom: 0;
}

.mks-ellt-article .mks-cta-panel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 26px;
	align-items: center;
	border-color: transparent;
	background:
		radial-gradient(circle at 88% 18%, rgba(244, 196, 48, 0.30), transparent 25%),
		linear-gradient(135deg, var(--mks-exam-primary-strong), #6d28d9);
	color: #ffffff;
}

.mks-ellt-article .mks-cta-panel h2,
.mks-ellt-article .mks-cta-panel p {
	color: #ffffff;
}

.mks-ellt-article .mks-cta-panel .mks-ielts-kicker {
	border-color: rgba(255, 255, 255, 0.38);
	background: rgba(255, 255, 255, 0.16);
	color: #ffffff;
}

.mks-ellt-article .mks-cta-panel > div:last-child {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-end;
}

.mks-ellt-article .mks-ielts-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 17px;
	border: 2px solid #ffffff;
	border-radius: 999px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
}

.mks-ellt-article .mks-ielts-button.primary {
	border-color: #ffffff;
	background: #ffffff;
	color: var(--mks-exam-primary);
}

.mks-ellt-article .mks-ielts-button.secondary {
	background: transparent;
	color: #ffffff;
}

.mks-ellt-article .wp-block-rank-math-faq-block {
	margin-top: clamp(30px, 4vw, 46px);
}

.mks-ellt-article .rank-math-list-item {
	margin-bottom: 12px;
	padding: 20px 22px;
	border: 1px solid #e2e0e8;
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 8px 20px rgba(49, 46, 66, 0.05);
}

.mks-ellt-article a:focus-visible,
.mks-ellt-article button:focus-visible {
	outline: 3px solid var(--mks-exam-accent);
	outline-offset: 3px;
}

@media (max-width: 900px) {
	.mks-ellt-article .mks-proof-grid,
	.mks-ellt-article .mks-two-col,
	.mks-ellt-article .mks-cta-panel {
		grid-template-columns: 1fr;
	}

	.mks-ellt-article .mks-cta-panel > div:last-child {
		justify-content: flex-start;
	}
}

@media (max-width: 600px) {
	.mks-ellt-article .mks-ielts-body {
		padding: 20px 14px 30px;
	}

	.mks-ellt-article .mks-ielts-section,
	.mks-ellt-article .mks-proof-card,
	.mks-ellt-article .mks-list-card,
	.mks-ellt-article .mks-source-box,
	.mks-ellt-article .mks-related-box {
		padding: 19px 17px;
	}

	.mks-ellt-article .mks-ielts-button {
		width: 100%;
	}
}