/*
 * Learn4Belarus — tokens and block styles.
 * Loaded on the front end and in the block editor (add_editor_style), so
 * everything an editor can build looks the same in both places.
 */

:root {
	--l4b-container: 1050px;
	--l4b-gutter: 17px;

	--l4b-brand-900: #791512;
	--l4b-brand-700: #8E1922;
	--l4b-brand-600: #991D27;
	--l4b-link: #9B1C22;
	--l4b-cta: #BB0017;
	--l4b-rule: #C31A27;
	--l4b-accent: #F25A69;
	--l4b-navy-700: #243E60;
	--l4b-navy-900: #192F50;
	--l4b-navy-cta: #1E3657;

	--l4b-ink-900: #1D2938;
	--l4b-ink-800: #253649;
	--l4b-ink-600: #3F5062;
	--l4b-ink-500: #4D5E71;
	--l4b-muted: #748292;
	--l4b-faint: #919CAB;

	--l4b-line: #E4E8ED;
	--l4b-surface-1: #F8F9FA;
	--l4b-surface-2: #F6F7F9;
	--l4b-surface-3: #F2F4F7;
	--l4b-tint: #F8EEF0;
	--l4b-ok: #466742;
	--l4b-ok-bg: #F1F7EF;

	--l4b-shadow-card: 0 4px 15px rgba(26, 42, 63, 0.05);
	--l4b-shadow-side: 0 5px 20px rgba(22, 37, 62, 0.05);
	--l4b-shadow-feature: 0 4px 12px rgba(9, 24, 50, 0.145);
	--l4b-shadow-raised: 0 5px 14px rgba(38, 54, 77, 0.22);

	--l4b-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
	--l4b-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
	--l4b-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}

/* ---------- Shared bits ---------- */

/* Arrow after a link: paragraphs with "Спасылка са стрэлкай", buttons "Са стрэлкай". */
.is-style-l4b-more a::after,
.is-style-l4b-tag a::after,
.is-style-l4b-arrow .wp-block-button__link::after,
.is-style-l4b-outline-light .wp-block-button__link::after,
.l4b-mail-link a::after,
.wp-block-read-more::after {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-left: 0.4em;
	vertical-align: -0.14em;
	background: currentColor;
	-webkit-mask: var(--l4b-arrow) center / contain no-repeat;
	mask: var(--l4b-arrow) center / contain no-repeat;
}

.is-style-l4b-arrow .wp-block-button__link::after,
.is-style-l4b-outline-light .wp-block-button__link::after {
	width: 1.15em;
	height: 1.15em;
	margin-left: 24px;
	vertical-align: -0.2em;
}

.is-style-l4b-more {
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
}

.is-style-l4b-more a {
	color: var(--l4b-link);
	text-decoration: none;
}

.is-style-l4b-more a:hover {
	color: var(--l4b-brand-900);
	text-decoration: underline;
}

.is-style-l4b-tag {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.is-style-l4b-tag a {
	color: #A82728;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.is-style-l4b-lead {
	font-size: 19px;
	line-height: 1.55;
	color: var(--l4b-ink-500);
}

.is-style-l4b-eyebrow {
	font-size: 10.5px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--l4b-brand-900);
}

/* Heading with the short brand bar under it. */
.wp-block-heading.is-style-l4b-bar::after {
	content: "";
	display: block;
	width: 62px;
	height: 3px;
	margin-top: 0.55em;
	border-radius: 2px;
	background: var(--l4b-brand-900);
}

h1.wp-block-heading.is-style-l4b-bar::after {
	width: 66px;
	height: 4px;
	margin-top: 0.38em;
}

/* Outline button for dark backgrounds. */
.wp-block-button.is-style-l4b-outline-light .wp-block-button__link {
	background: transparent;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.9);
	padding: 10px 20.5px 10px 18.5px;
}

.wp-block-button.is-style-l4b-outline-light .wp-block-button__link:hover {
	background: #fff;
	color: var(--l4b-navy-900);
}

.wp-block-button__link {
	text-decoration: none;
}

/* ---------- Section heading row: heading — rule — "Усе …" ---------- */

.wp-block-group.is-style-l4b-section-head {
	display: flex;
	align-items: baseline;
	gap: 15px;
	margin-bottom: 12px;
}

.wp-block-group.is-style-l4b-section-head > * {
	margin: 0 !important;
}

.wp-block-group.is-style-l4b-section-head + * {
	margin-top: 0 !important;
}

.is-style-l4b-section-head > .wp-block-heading {
	display: flex;
	flex: 1;
	align-items: baseline;
	gap: 10px;
	font-size: 30px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--l4b-brand-900);
}

.is-style-l4b-section-head > .wp-block-heading::after {
	content: "";
	flex: 1;
	min-width: 24px;
	height: 1px;
	background: var(--l4b-rule);
	opacity: 0.85;
}

.is-style-l4b-section-head > h3.wp-block-heading {
	font-size: 21px;
}

.is-style-l4b-section-head > p {
	flex: none;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

.is-style-l4b-section-head > p a {
	color: var(--l4b-brand-700);
	text-decoration: none;
}

.is-style-l4b-section-head > p a:hover {
	text-decoration: underline;
}

/* ---------- Bands (full width) ---------- */

.wp-block-group.is-style-l4b-band-navy {
	position: relative;
	background: var(--l4b-navy-900);
	color: #fff;
	padding: 26px var(--l4b-gutter) 27px;
}

.wp-block-group.is-style-l4b-band-grey {
	background: var(--l4b-surface-2);
	border-top: 1px solid #EDF0F3;
	border-bottom: 1px solid #EDF0F3;
	padding: 21px var(--l4b-gutter) 27px;
}

.is-style-l4b-band-navy h2,
.is-style-l4b-band-navy h3,
.is-style-l4b-band-navy > .wp-block-columns > .wp-block-column > p {
	color: #fff;
}

.is-style-l4b-band-navy .wp-block-heading.is-style-l4b-bar::after {
	width: 79px;
	height: 4px;
	background: var(--l4b-accent);
}

/* Navy panel with rounded corners (About: "Запрашаем да супрацы!"). */
.wp-block-group.is-style-l4b-cta {
	background: var(--l4b-navy-cta);
	color: #fff;
	border-radius: 13px;
	padding: 31px 36px 31px;
}

.is-style-l4b-cta h2,
.is-style-l4b-cta p {
	color: #fff;
}

.is-style-l4b-cta .wp-block-heading.is-style-l4b-bar::after {
	background: #fff;
	width: 76px;
	height: 4px;
	margin-top: 6px;
}

/* ---------- Cards ---------- */

.wp-block-group.is-style-l4b-card,
.wp-block-group.is-style-l4b-card-soft {
	background: #fff;
	border: 1px solid var(--l4b-line);
	border-radius: 10px;
	padding: 26px 30px 30px;
	box-shadow: var(--l4b-shadow-side);
}

.wp-block-group.is-style-l4b-card-soft {
	background: #FAFBFC;
}

/* White card on the navy band, with an illustration on top. */
.wp-block-group.is-style-l4b-feature {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 12px;
	padding: 12px 17px 18px;
	box-shadow: var(--l4b-shadow-feature);
	color: #3E4B59;
}

.is-style-l4b-feature > .wp-block-image {
	margin: 0 0 14px !important;
	text-align: center;
}

.is-style-l4b-feature > .wp-block-image img {
	width: 120px;
	height: 110px;
	object-fit: contain;
}

.is-style-l4b-feature > .wp-block-heading {
	margin: 0 !important;
	font-size: 18.5px;
	font-weight: 700;
	line-height: 1.3;
	color: #1C2635;
}

.is-style-l4b-feature > p {
	margin-top: 21px !important;
	font-size: 13px;
	line-height: 1.35;
	color: #3E4B59;
}

.is-style-l4b-feature > p.is-style-l4b-more {
	margin-top: auto !important;
	padding-top: 16px;
}

.is-style-l4b-feature .is-style-l4b-more a {
	color: #A61D2E;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Sidebar card with a pink header (first heading is the header). */
.wp-block-group.is-style-l4b-card-pink {
	background: #fff;
	border: 1px solid #E0E7EE;
	border-radius: 9px;
	box-shadow: var(--l4b-shadow-side);
	overflow: hidden;
	padding: 0;
}

.wp-block-group.is-style-l4b-card-pink > * {
	margin: 0 !important;
	padding-left: 19px;
	padding-right: 19px;
}

.is-style-l4b-card-pink > .wp-block-heading:first-child {
	background: var(--l4b-tint);
	padding-top: 16px;
	padding-bottom: 14px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: #761817;
}

.is-style-l4b-card-pink > .wp-block-heading.is-style-l4b-plain:first-child,
.is-style-l4b-card-pink.l4b-plain-head > .wp-block-heading:first-child {
	background: #fff;
	padding-top: 16px;
	padding-bottom: 15px;
}

.is-style-l4b-card-pink > p {
	padding-top: 15px;
	padding-bottom: 3px;
	font-size: 12.5px;
	line-height: 1.4;
	color: #657386;
}

.is-style-l4b-card-pink > p.is-style-l4b-more {
	padding-top: 13px;
	padding-bottom: 10px;
	background: var(--l4b-surface-1);
	border-top: 2px solid #E7EBF0;
	font-size: 12px;
}

.is-style-l4b-card-pink > p.is-style-l4b-more a {
	color: #891A1F;
}

/* Query list inside a sidebar card. */
.is-style-l4b-card-pink > .wp-block-query {
	padding: 0;
}

.wp-block-query.is-style-l4b-list .wp-block-post-template {
	margin: 0;
	padding: 0;
	list-style: none;
}

.wp-block-query.is-style-l4b-list .wp-block-post {
	margin: 0;
	padding: 13px 19px 16px;
	border-top: 1px solid #E7EBF0;
}

.wp-block-query.is-style-l4b-list .wp-block-post-title {
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
	color: #25364A;
}

.wp-block-query.is-style-l4b-list .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}

.wp-block-query.is-style-l4b-list .wp-block-post-title a:hover {
	color: var(--l4b-brand-900);
}

.wp-block-query.is-style-l4b-list .wp-block-read-more {
	font-size: 11.5px;
	font-weight: 700;
	color: #9C1B20;
	text-decoration: none;
}

.wp-block-query.is-style-l4b-list .wp-block-post-terms {
	margin-bottom: 1px;
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #9A8790;
}

.wp-block-query.is-style-l4b-list .wp-block-post-terms a {
	color: inherit;
	text-decoration: none;
}

/* Light panel holding an illustration (About). */
.wp-block-group.is-style-l4b-panel {
	position: relative;
	background: #F5F7FA;
	border-radius: 15px;
	padding: 32px 22px 34px;
	overflow: hidden;
	isolation: isolate;
}

.wp-block-group.is-style-l4b-panel::before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 8%;
	right: 8%;
	top: 2%;
	bottom: 2%;
	border-radius: 48% 52% 46% 54% / 55% 50% 50% 45%;
	background: #F8EAED;
}

.wp-block-group.is-style-l4b-panel::after {
	content: "";
	position: absolute;
	right: 14%;
	bottom: 26px;
	width: 104px;
	height: 5px;
	border-radius: 3px;
	background: #8D1C22;
}

/* Tilted white card holding an illustration. */
.wp-block-image.is-style-l4b-tilt-left,
.wp-block-image.is-style-l4b-tilt-right {
	margin: 0;
	background: #fff;
	border-radius: 13px;
	box-shadow: 0 9px 22px rgba(25, 44, 67, 0.13);
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1.03;
}

.wp-block-image.is-style-l4b-tilt-left {
	transform: rotate(-3deg);
}

.wp-block-image.is-style-l4b-tilt-right {
	transform: rotate(3deg);
}

.wp-block-image.is-style-l4b-tilt-left img,
.wp-block-image.is-style-l4b-tilt-right img {
	width: 72%;
	height: auto;
}

/* ---------- Query Loop: article and news cards ---------- */

.wp-block-query.is-style-l4b-cards .wp-block-post-template,
.wp-block-query.is-style-l4b-news .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 15px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wp-block-query.is-style-l4b-cards .wp-block-post,
.wp-block-query.is-style-l4b-news .wp-block-post {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	background: #fff;
	border: 1px solid var(--l4b-line);
	border-radius: 6px;
	overflow: hidden;
}

.wp-block-query.is-style-l4b-cards .wp-block-post > *,
.wp-block-query.is-style-l4b-news .wp-block-post > * {
	margin: 0;
}

.wp-block-query.is-style-l4b-cards .wp-block-post-featured-image,
.wp-block-query.is-style-l4b-news .wp-block-post-featured-image {
	height: 132px;
	background: var(--l4b-surface-3);
	overflow: hidden;
}

.wp-block-query.is-style-l4b-news .wp-block-post-featured-image {
	height: 101px;
	background: #F4F5F6;
}

.wp-block-query.is-style-l4b-cards .wp-block-post-featured-image a,
.wp-block-query.is-style-l4b-news .wp-block-post-featured-image a {
	display: block;
	height: 100%;
}

.wp-block-query.is-style-l4b-cards .wp-block-post-featured-image img,
.wp-block-query.is-style-l4b-news .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
}

/* News images are mostly posters and logos: show them whole. */
.wp-block-query.is-style-l4b-news .wp-block-post-featured-image img {
	object-fit: contain;
}

/* Post without any image: neutral panel instead of a missing block. */
.wp-block-post-featured-image.is-empty {
	background:
		radial-gradient(circle at 80% 30%, rgba(242, 90, 105, 0.13) 0 30px, transparent 31px),
		linear-gradient(135deg, #F5F7FA, #EBEFF4) !important;
}

.wp-block-post-featured-image.is-empty a::after {
	content: "learn4belarus";
	display: flex;
	align-items: flex-end;
	height: 100%;
	padding: 0 0 12px 15px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: rgba(121, 21, 18, 0.35);
}

.wp-block-query.is-style-l4b-cards .wp-block-post-terms {
	padding: 12px 15px 0;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-transform: uppercase;
	color: #7D8996;
}

.wp-block-query.is-style-l4b-cards .wp-block-post-terms a {
	color: inherit;
	text-decoration: none;
}

.wp-block-query.is-style-l4b-cards .wp-block-post-title {
	padding: 4px 15px 0;
	max-height: calc(4px + 3 * 1.33em);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.33;
	color: #273849;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.wp-block-query.is-style-l4b-cards .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}

/* The whole card is the link target. */
.wp-block-query.is-style-l4b-cards .wp-block-post-title a::before,
.wp-block-query.is-style-l4b-news .wp-block-post-title a::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.wp-block-query.is-style-l4b-cards .wp-block-post:hover,
.wp-block-query.is-style-l4b-news .wp-block-post:hover {
	border-color: #CBD3DC;
	box-shadow: var(--l4b-shadow-card);
}

.wp-block-query.is-style-l4b-cards .wp-block-read-more {
	margin: auto 15px 15px !important;
	padding-top: 10px;
	font-size: 12px;
	font-weight: 700;
	color: #861B19;
	text-decoration: none;
}

.wp-block-query.is-style-l4b-news .wp-block-post-date {
	padding: 6px 12px 0;
	font-size: 10px;
	color: #8A98A5;
}

.wp-block-query.is-style-l4b-news .wp-block-post-title {
	padding: 3px 12px 0;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
	color: #981B1B;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.wp-block-query.is-style-l4b-news .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}

.wp-block-query.is-style-l4b-news .is-style-l4b-tag {
	margin: auto 12px 11px !important;
	padding-top: 12px;
}

/* A single row (home): three cards on wide screens, four on phones; equal height as in the design. */
@media (min-width: 601px) {
	.wp-block-query.is-style-l4b-news.l4b-row .wp-block-post {
		min-height: 220px;
	}
}

.wp-block-query.is-style-l4b-news.l4b-row .wp-block-post:nth-child(n+4),
.wp-block-query.is-style-l4b-cards.l4b-row .wp-block-post:nth-child(n+4) {
	display: none;
}

.wp-block-query.is-style-l4b-news .wp-block-read-more {
	margin: auto 12px 13px !important;
	padding-top: 12px;
	font-size: 11px;
	font-weight: 700;
	color: #A82728;
	text-decoration: none;
}

/* Full lists (pages): more breathing room, pagination under the grid. */
.wp-block-query.is-style-l4b-news:not(.l4b-row) .wp-block-post-template,
.wp-block-query.is-style-l4b-cards:not(.l4b-row) .wp-block-post-template {
	row-gap: 18px;
}

.wp-block-query.is-style-l4b-news:not(.l4b-row) .wp-block-post-featured-image {
	height: 140px;
}

.wp-block-query .wp-block-query-pagination {
	margin-top: 30px;
}

/* ---------- Query Loop: course-cover collage (home hero) ---------- */

.wp-block-query.is-style-l4b-collage .wp-block-post-template {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px 16px;
	margin: 0;
	padding: 6px 4px;
	list-style: none;
	align-items: center;
}

.wp-block-query.is-style-l4b-collage .wp-block-post {
	margin: 0;
}

.wp-block-query.is-style-l4b-collage .wp-block-post-featured-image {
	margin: 0;
	border-radius: 7px;
	overflow: hidden;
	box-shadow: var(--l4b-shadow-raised);
	aspect-ratio: 1.6;
	transition: transform 0.2s ease;
}

.wp-block-query.is-style-l4b-collage .wp-block-post-featured-image img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	display: block;
}

.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(1) .wp-block-post-featured-image { transform: rotate(-4deg) scale(1.03); }
.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(2) .wp-block-post-featured-image { transform: rotate(0deg) scale(0.88); }
.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(3) .wp-block-post-featured-image { transform: rotate(2.5deg) scale(0.92); }
.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(4) .wp-block-post-featured-image { transform: rotate(-4deg); }
.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(n+5) { display: none; }

.wp-block-query.is-style-l4b-collage .wp-block-post-featured-image:hover {
	transform: rotate(0deg) scale(1.04);
}

/* Wide screens: each cover at the size, position and tilt of the design (column 545×360). */
@media (min-width: 782px) {
	.wp-block-query.is-style-l4b-collage .wp-block-post-template {
		position: relative;
		display: block;
		aspect-ratio: 545 / 360;
		padding: 0;
	}

	.wp-block-query.is-style-l4b-collage .wp-block-post {
		position: absolute;
	}

	.wp-block-query.is-style-l4b-collage .wp-block-post-featured-image {
		aspect-ratio: 1.6;
		border-radius: 7px;
	}

	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(1) { left: 2.2%; top: 3.2%; width: 45%; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(2) { left: 51.4%; top: 7.2%; width: 40.4%; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(3) { left: 5.8%; top: 54%; width: 40.7%; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(4) { left: 50.6%; top: 50.8%; width: 45%; }

	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(1) .wp-block-post-featured-image { transform: rotate(-4deg); box-shadow: 0 5px 14px rgba(38, 54, 77, 0.25); }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(2) .wp-block-post-featured-image { transform: none; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(3) .wp-block-post-featured-image { transform: rotate(3deg); }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(4) .wp-block-post-featured-image { transform: rotate(-2deg); }
}

/* ---------- FAQ: core/details ---------- */

.wp-block-details {
	margin: 0 0 5px !important;
	background: var(--l4b-surface-3);
	border: 1px solid #E6E9ED;
	border-radius: 3px;
	padding: 0;
}

.wp-block-details > summary {
	position: relative;
	display: block;
	list-style: none;
	min-height: 38px;
	padding: 10px 16px 10px 35px;
	font-size: 12.5px;
	line-height: 1.45;
	color: #394552;
	cursor: pointer;
}

.wp-block-details > summary::-webkit-details-marker {
	display: none;
}

.wp-block-details > summary::before {
	content: "";
	position: absolute;
	left: 14px;
	top: 14px;
	width: 10px;
	height: 10px;
	background: #394552;
	-webkit-mask: var(--l4b-chevron) center / contain no-repeat;
	mask: var(--l4b-chevron) center / contain no-repeat;
	transition: transform 0.15s ease;
}

.wp-block-details[open] > summary::before {
	transform: rotate(90deg);
}

.wp-block-details > summary:hover {
	color: var(--l4b-brand-900);
}

.wp-block-details > :not(summary) {
	margin: 0 !important;
	padding: 0 18px 14px 35px;
	font-size: 13.5px;
	line-height: 1.65;
	color: var(--l4b-ink-600);
}

.l4b-section-head--small > .wp-block-heading {
	font-size: 22.5px;
}

/* ---------- About ---------- */

.l4b-about__intro {
	gap: 12px;
	margin-bottom: 0;
}

@media (min-width: 782px) {
	.l4b-about__intro > .wp-block-column:last-child {
		flex: 0 0 468px !important;
	}

	.l4b-about__intro > .wp-block-column:first-child {
		flex: 1 1 auto !important;
		padding-bottom: 10px;
	}

	.l4b-about__cards > .wp-block-column:first-child {
		flex: 0 0 631px !important;
	}

	.l4b-about__cards > .wp-block-column:last-child {
		flex: 1 1 auto !important;
	}

	.is-style-l4b-cta .wp-block-column:last-child {
		flex: 0 0 301px !important;
	}

	.is-style-l4b-cta .wp-block-column:first-child {
		flex: 1 1 auto !important;
	}
}

.l4b-about__intro h1 {
	margin: 0 0 21px;
	font-size: 47px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--l4b-ink-900);
}

.l4b-about__intro .is-style-l4b-lead {
	margin: 0;
	font-size: 19.5px;
	line-height: 1.5;
	color: #3D4D60;
}

.l4b-about__intro h1.is-style-l4b-bar::after {
	margin-top: 12px;
}

.l4b-about__intro .is-style-l4b-lead a {
	color: var(--l4b-brand-900);
	text-underline-offset: 3px;
}

.l4b-about__intro .is-style-l4b-panel {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	align-items: center;
	gap: 18px;
	min-height: 300px;
	padding: 30px 30px 40px;
}

.l4b-about__intro .is-style-l4b-panel > .wp-block-image {
	margin: 0;
}

.l4b-about__intro .is-style-l4b-panel > .is-style-l4b-tilt-right {
	margin-top: -36px;
	transform: rotate(3deg) scale(0.86);
}

.wp-block-group.is-style-l4b-cta {
	margin-top: 40px;
}

.is-style-l4b-cta .wp-block-columns {
	gap: 40px;
	margin: 0;
}

.is-style-l4b-cta h2 {
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.2;
}

.is-style-l4b-cta p {
	margin: 20px 0 0;
	font-size: 15px;
	line-height: 1.55;
	color: #E8EDF3;
}

.is-style-l4b-cta .wp-block-buttons {
	margin-top: 20px;
}

.wp-block-image.l4b-cta__art {
	margin: 0;
	padding: 18px 24px;
	background: #fff;
	border-radius: 11px;
	text-align: center;
}

.wp-block-image.l4b-cta__art img {
	width: 100%;
	max-width: 240px;
	height: auto;
}

.l4b-about__cards {
	gap: 19px;
	margin-top: 38px;
	align-items: flex-start;
}

.l4b-about__cards .wp-block-heading.is-style-l4b-bar::after {
	margin-top: 20px;
}

.l4b-about__cards .wp-block-group.is-style-l4b-card-soft {
	padding-top: 29px;
}

.l4b-about__cards .is-style-l4b-card-soft > p:not(.l4b-mail-link) {
	line-height: 1.6;
}

.l4b-about__cards .wp-block-heading {
	margin: 0 0 16px;
	font-size: 24px;
	font-weight: 700;
	color: var(--l4b-ink-900);
}

.l4b-about__cards .is-style-l4b-card-soft p {
	font-size: 15.5px !important;
}

.l4b-about__cards .wp-block-group p {
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.7;
	color: #4A5B70;
}

.l4b-about__cards .wp-block-group p:last-child {
	margin-bottom: 0;
}

.wp-block-heading.l4b-icon-mail::before {
	content: "";
	display: block;
	width: 58px;
	height: 58px;
	margin-bottom: 21px;
	border-radius: 10px;
	background:
		var(--l4b-brand-900) center / 26px 26px no-repeat;
	background-color: #F6E5E8;
	box-shadow: inset 0 0 0 999px #F6E5E8;
	-webkit-mask: none;
}

.wp-block-heading.l4b-icon-mail {
	position: relative;
}

.wp-block-heading.l4b-icon-mail::after {
	content: "";
	position: absolute;
	left: 16px;
	top: 16px;
	width: 26px;
	height: 26px;
	background: var(--l4b-brand-900);
	-webkit-mask: var(--l4b-mail) center / contain no-repeat;
	mask: var(--l4b-mail) center / contain no-repeat;
}

.l4b-mail-link {
	margin-top: 19px !important;
	font-size: 15px;
	font-weight: 700;
}

.l4b-mail-link a {
	color: var(--l4b-brand-900);
	text-decoration: underline;
	text-underline-offset: 3px;
	word-break: break-word;
}

/* FAQ page */
.l4b-faq {
	max-width: 820px;
}

.l4b-faq .wp-block-details > summary {
	font-size: 14px;
	padding-top: 12px;
	padding-bottom: 12px;
}

.l4b-faq .wp-block-details > summary::before {
	top: 17px;
}

/* ---------- Empty category placeholder ---------- */

.wp-block-group.is-style-l4b-empty {
	position: relative;
	max-width: 640px;
	margin: 6px auto 0;
	padding: 34px 40px 30px;
	text-align: center;
	background: var(--l4b-surface-1);
	border: 1px solid var(--l4b-line);
	border-radius: 15px;
}

.is-style-l4b-empty > .wp-block-image {
	margin: 0 auto 6px !important;
}

.is-style-l4b-empty > .wp-block-image img {
	width: 150px;
	height: auto;
}

.is-style-l4b-empty > h2 {
	margin-top: 10px !important;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--l4b-ink-900);
}

.is-style-l4b-empty > p {
	max-width: 470px;
	margin-left: auto !important;
	margin-right: auto !important;
	font-size: 14px;
	line-height: 1.65;
	color: var(--l4b-ink-500);
}

.is-style-l4b-empty > .wp-block-buttons {
	justify-content: center;
	gap: 10px;
	margin-top: 24px !important;
}

.is-style-l4b-empty .wp-block-button.is-style-outline .wp-block-button__link {
	background: #fff;
	color: var(--l4b-ink-800);
	border: 1px solid #D5DCE4;
	padding: 11px 18px;
}

.is-style-l4b-empty .wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--l4b-ink-800);
}

.is-style-l4b-empty > .wp-block-separator {
	max-width: 420px;
	margin: 28px auto 0 !important;
	border: 0;
	border-top: 1px solid var(--l4b-line);
	opacity: 1;
}

.is-style-l4b-empty > p.l4b-empty__note {
	margin-top: 14px !important;
	font-size: 12.5px;
	color: var(--l4b-muted);
}

/* ---------- Narrow screens ---------- */

@media (max-width: 900px) {
	.wp-block-query.is-style-l4b-cards .wp-block-post-template,
	.wp-block-query.is-style-l4b-news .wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.wp-block-group.is-style-l4b-section-head {
		gap: 10px;
	}

	.is-style-l4b-section-head > .wp-block-heading {
		gap: 8px;
		font-size: 17px;
		letter-spacing: -0.005em;
	}

	.is-style-l4b-section-head > h3.wp-block-heading,
	.l4b-section-head--small > .wp-block-heading {
		font-size: 14.5px;
	}

	.is-style-l4b-section-head > p {
		font-size: 10.5px;
	}

	/* Article cards in a row: horizontal scroll with the next card peeking. */
	.wp-block-query.is-style-l4b-cards:not(.l4b-row) .wp-block-post-template {
		grid-template-columns: minmax(0, 1fr);
	}

	.wp-block-query.is-style-l4b-cards.l4b-row .wp-block-post-template {
		display: flex;
		gap: 12px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		margin-right: calc(-1 * var(--l4b-gutter));
		padding-right: var(--l4b-gutter);
		scrollbar-width: none;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-post-template::-webkit-scrollbar {
		display: none;
	}

	.wp-block-query.is-style-l4b-cards.l4b-row .wp-block-post {
		flex: 0 0 231px;
		scroll-snap-align: start;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-post-featured-image {
		height: 113px;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-post-title {
		font-size: 14px;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-template {
		gap: 11px;
	}

	.wp-block-query.is-style-l4b-news.l4b-row .wp-block-post:nth-child(4) {
		display: flex;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-featured-image {
		height: 72px;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-date {
		padding: 10px 9px 0;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-title {
		padding: 5px 9px 0;
		font-size: 12px;
		-webkit-line-clamp: 4;
	}

	.wp-block-query.is-style-l4b-news .is-style-l4b-tag {
		margin: auto 9px 12px !important;
	}

	.wp-block-group.is-style-l4b-cta {
		padding: 24px 21px;
	}

	.wp-block-group.is-style-l4b-card,
	.wp-block-group.is-style-l4b-card-soft {
		padding: 22px 21px;
	}

	.wp-block-group.is-style-l4b-empty {
		padding: 26px 20px 24px;
	}

	/* About */
	.l4b-about__intro {
		gap: 22px;
	}

	.l4b-about__intro h1 {
		margin-bottom: 18px;
		font-size: 33px;
	}

	.l4b-about__intro .is-style-l4b-lead {
		font-size: 16px;
		line-height: 1.55;
	}

	.l4b-about__intro .is-style-l4b-panel {
		min-height: 0;
		padding: 22px 22px 30px;
	}

	.l4b-about__intro .is-style-l4b-panel > .is-style-l4b-tilt-right {
		margin-top: -24px;
	}

	.wp-block-group.is-style-l4b-cta {
		margin-top: 24px;
	}

	.is-style-l4b-cta h2 {
		font-size: 23.5px;
	}

	.is-style-l4b-cta .wp-block-columns {
		gap: 24px;
	}

	.l4b-about__cards {
		margin-top: 22px;
	}

	.l4b-about__cards .wp-block-heading {
		font-size: 22px;
	}

	.l4b-about__cards .wp-block-group p {
		font-size: 14px;
	}

	/* Feature cards stack horizontally: text left, illustration right. */
	.wp-block-group.is-style-l4b-feature {
		display: grid;
		grid-template-columns: 1fr 104px;
		grid-template-areas: "title art" "text art" "link art";
		align-items: start;
		column-gap: 10px;
		padding: 16px 17px 18px;
	}

	.is-style-l4b-feature > .wp-block-image {
		grid-area: art;
		align-self: center;
		margin: 0 !important;
	}

	.is-style-l4b-feature > .wp-block-image img {
		width: 100px;
		height: 92px;
	}

	.is-style-l4b-feature > .wp-block-heading {
		grid-area: title;
		font-size: 17px;
	}

	.is-style-l4b-feature > p {
		grid-area: text;
		margin-top: 6px !important;
		font-size: 12px;
	}

	.is-style-l4b-feature > p.is-style-l4b-more {
		grid-area: link;
		margin-top: 8px !important;
	}
}

/* ---------- Phone and small tablet: measured against design/frames/home-mobile.png ---------- */

@media (max-width: 781px) {
	/* Course-cover collage: positions of the mobile frame (column 356×232). */
	.wp-block-query.is-style-l4b-collage .wp-block-post-template {
		position: relative;
		display: block;
		aspect-ratio: 356 / 232;
		padding: 0;
	}

	.wp-block-query.is-style-l4b-collage .wp-block-post {
		position: absolute;
	}

	.wp-block-query.is-style-l4b-collage .wp-block-post-featured-image {
		aspect-ratio: 1.6;
	}

	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(1) { left: 5.3%; top: 6%; width: 44.7%; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(2) { left: 54.2%; top: 9.9%; width: 40.2%; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(3) { left: 8.8%; top: 57.1%; width: 40.5%; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(4) { left: 53.5%; top: 53.8%; width: 44.7%; }

	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(1) .wp-block-post-featured-image { transform: rotate(-4deg); }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(2) .wp-block-post-featured-image { transform: none; }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(3) .wp-block-post-featured-image { transform: rotate(3deg); }
	.wp-block-query.is-style-l4b-collage .wp-block-post:nth-child(4) .wp-block-post-featured-image { transform: rotate(-2deg); }
}

@media (max-width: 600px) {
	.is-style-l4b-section-head > .wp-block-heading {
		font-size: 20px;
	}

	.l4b-section-head--small > .wp-block-heading {
		font-size: 15px;
	}

	.is-style-l4b-section-head > p {
		font-size: 10.7px;
	}

	/* Feature cards on the band: text left, illustration right. */
	.wp-block-group.is-style-l4b-feature {
		grid-template-columns: minmax(0, 1fr) 112px;
		column-gap: 16px;
		min-height: 169px;
		padding: 14px 17px 22px 18px;
	}

	.is-style-l4b-feature > .wp-block-image img {
		width: 108px;
		height: 96px;
	}

	.is-style-l4b-feature > .wp-block-heading {
		font-size: 18px;
		line-height: 1.12;
	}

	.is-style-l4b-feature > p {
		margin-top: 10px !important;
		font-size: 12.5px;
		line-height: 1.32;
	}

	.is-style-l4b-feature > p.is-style-l4b-more {
		margin-top: 12px !important;
		padding-top: 0;
	}

	/* Article cards: 255px wide, 105px image. */
	.wp-block-query.is-style-l4b-cards.l4b-row .wp-block-post-template {
		gap: 10px;
	}

	.wp-block-query.is-style-l4b-cards.l4b-row .wp-block-post {
		flex-basis: 255px;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-post-featured-image {
		height: 105px;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-post-terms {
		padding: 9px 11px 0;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-post-title {
		padding: 6px 11px 0;
		max-height: calc(6px + 4 * 1.25em);
		font-size: 13.5px;
		line-height: 1.25;
		-webkit-line-clamp: 4;
	}

	.wp-block-query.is-style-l4b-cards .wp-block-read-more {
		margin: auto 11px 11px !important;
		padding-top: 14px;
	}

	/* News: 2×2, 173×213 cards, 85px image. */
	.wp-block-query.is-style-l4b-news .wp-block-post-template {
		gap: 10px;
	}

	.wp-block-query.is-style-l4b-news.l4b-row .wp-block-post {
		min-height: 213px;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-featured-image {
		height: 85px;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-date {
		padding: 7px 10px 0;
	}

	.wp-block-query.is-style-l4b-news .wp-block-post-title {
		padding: 5px 10px 0;
		font-size: 12px;
		line-height: 1.32;
	}

	.wp-block-query.is-style-l4b-news .is-style-l4b-tag {
		margin: auto 10px 11px !important;
	}
}
