body:has(.yw-recitation-v2) .entry-title,
body:has(.yw-recitation-v2) .page-title {
	display: none;
}

/* 2026-05-30 execution pass: stronger hero, advanced memory logic, and frontloaded preview. */
.yw-rec-hero {
	min-height: clamp(560px, 68vh, 650px);
}

.yw-rec-hero::before,
.yw-rec-hero::after {
	opacity: 0.5;
}

.yw-rec-hero__grid {
	grid-template-columns: minmax(0, 0.82fr) minmax(500px, 1.18fr);
	min-height: clamp(520px, 62vh, 610px);
}

.yw-rec-hero__copy p,
.yw-rec-head p,
.yw-rec-split-head p {
	color: #3E4655;
}

.yw-rec-portrait {
	height: clamp(520px, 44vw, 610px);
}

.yw-rec-portrait::before {
	left: 55%;
	bottom: -104px;
	width: min(760px, 126%);
	height: clamp(170px, 14vw, 226px);
	border: 1px solid rgba(91, 123, 142, 0.14);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
	background: linear-gradient(135deg, rgba(235, 244, 248, 0.92), rgba(252, 240, 235, 0.88));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.yw-rec-portrait::after {
	left: 55%;
	bottom: -66px;
	width: min(690px, 116%);
	height: clamp(132px, 11vw, 182px);
	border-color: rgba(233, 30, 99, 0.13);
	border-bottom: 0;
	background: transparent;
}

.yw-rec-portrait__rings {
	display: none;
}

.yw-rec-portrait img {
	right: -54px;
	bottom: -96px;
	width: min(650px, 126%);
	max-height: none;
}

.yw-rec-student-card {
	left: 7%;
	bottom: 128px;
	width: min(274px, 54%);
}

.yw-rec-logic-story {
	display: grid;
	grid-template-columns: minmax(280px, 0.74fr) minmax(0, 1.26fr);
	gap: clamp(22px, 3vw, 36px);
	align-items: start;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 30px;
	background:
		radial-gradient(circle at 15% 18%, rgba(233, 30, 99, 0.08), transparent 28%),
		linear-gradient(135deg, #FFFFFF 0%, #FBF7F3 100%);
	padding: clamp(24px, 4vw, 40px);
	box-shadow: 0 24px 62px rgba(23, 32, 51, 0.08);
}

.yw-rec-logic-sticky {
	position: sticky;
	top: 104px;
	min-height: 420px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 28px;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.86)),
		radial-gradient(circle at 80% 18%, rgba(45, 156, 137, 0.12), transparent 30%);
	padding: clamp(24px, 3vw, 34px);
	box-shadow: 0 22px 48px rgba(23, 32, 51, 0.07);
}

.yw-rec-logic-pill {
	display: inline-flex;
	margin-bottom: 18px;
	border-radius: 999px;
	background: rgba(233, 30, 99, 0.10);
	padding: 7px 12px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
}

.yw-rec-logic-sticky h3 {
	margin: 0;
	color: var(--rec-ink);
	font-size: clamp(25px, 2.3vw, 34px);
	line-height: 1.24;
}

.yw-rec-logic-sticky p {
	margin: 18px 0 0;
	color: #3E4655;
	font-size: 16px;
	line-height: 1.78;
}

.yw-rec-logic-progress {
	display: flex;
	gap: 10px;
	margin: 28px 0 24px;
}

.yw-rec-logic-progress i {
	display: block;
	width: 42px;
	height: 8px;
	border-radius: 999px;
	background: rgba(23, 32, 51, 0.10);
	transition: width 240ms ease, background-color 240ms ease, box-shadow 240ms ease;
}

.yw-rec-logic-progress i.is-active {
	width: 70px;
	background: var(--rec-coral-hot);
	box-shadow: 0 8px 18px rgba(245, 0, 87, 0.20);
}

.yw-rec-logic-current {
	display: grid;
	gap: 6px;
	border-radius: 22px;
	background: #172033;
	padding: 20px;
	color: #FFFFFF;
}

.yw-rec-logic-current em {
	color: rgba(255, 255, 255, 0.62);
	font-style: normal;
	font-size: var(--rec-font-meta);
	font-weight: 900;
}

.yw-rec-logic-current strong {
	font-size: 30px;
	line-height: 1.1;
}

.yw-rec-logic-current span {
	color: rgba(255, 255, 255, 0.78);
	line-height: 1.55;
}

.yw-rec-logic-track {
	display: grid;
	gap: 18px;
}

.yw-rec-logic-track .yw-rec-logic-step {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 0 22px;
	min-height: 228px;
	align-items: start;
	border-color: rgba(23, 32, 51, 0.08);
	border-radius: 26px;
	background: rgba(255, 255, 255, 0.84);
	padding: clamp(24px, 3vw, 34px);
	text-align: left;
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.06);
	transition: transform 240ms ease, border-color 240ms ease, box-shadow 240ms ease, background-color 240ms ease;
}

.yw-rec-logic-track .yw-rec-logic-step.is-active {
	border-color: rgba(233, 30, 99, 0.26);
	background: #FFFFFF;
	box-shadow: 0 26px 58px rgba(23, 32, 51, 0.11);
	transform: translateY(-2px);
}

.yw-rec-logic-track .yw-rec-logic-step::after {
	right: 20px;
	bottom: -32px;
	font-size: clamp(94px, 8vw, 132px);
	color: rgba(36, 48, 70, 0.062);
}

.yw-rec-logic-track .yw-rec-logic-step span {
	grid-row: span 3;
	width: 58px;
	height: 58px;
	margin: 0;
	border-radius: 17px;
}

.yw-rec-logic-track .yw-rec-logic-step h3 {
	margin: 0 0 10px;
	font-size: clamp(25px, 2.4vw, 34px);
}

.yw-rec-logic-track .yw-rec-logic-step strong {
	margin: 0 0 10px;
	font-size: 17px;
}

.yw-rec-logic-track .yw-rec-logic-step p {
	margin: 0;
	color: #3E4655;
}

.yw-rec-video-section {
	background:
		linear-gradient(180deg, #FFFFFF 0%, #FAF6F1 100%);
}

.yw-rec-video-section .yw-rec-video-copy {
	max-width: 920px;
	border-color: rgba(23, 32, 51, 0.08);
	box-shadow: 0 22px 52px rgba(23, 32, 51, 0.08);
}

.yw-rec-video-copy > span {
	display: inline-flex;
	margin-bottom: 14px;
	border-radius: 999px;
	background: rgba(233, 30, 99, 0.10);
	padding: 7px 12px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
}

.yw-rec-video-section .yw-rec-video-frame {
	width: min(1040px, 100%);
	margin: 0 auto;
	border: 10px solid #FFFFFF;
	box-shadow: 0 30px 72px rgba(23, 32, 51, 0.18);
}

.yw-rec-proof-card--lesson .yw-rec-lesson-preview {
	background: linear-gradient(135deg, rgba(23, 32, 51, 0.04), rgba(233, 30, 99, 0.06));
}

@media (max-width: 980px) {
	.yw-rec-hero__grid {
		grid-template-columns: 1fr;
	}

	.yw-rec-portrait {
		height: clamp(470px, 65vw, 570px);
		overflow: hidden;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -86px;
		width: min(500px, 90vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		left: 50%;
		bottom: 92px;
		width: min(286px, 76vw);
		transform: translateX(-50%);
	}

	.yw-rec-logic-story {
		grid-template-columns: 1fr;
	}

	.yw-rec-logic-sticky {
		position: relative;
		top: auto;
		min-height: auto;
	}
}

@media (max-width: 640px) {
	.yw-rec-hero {
		min-height: auto;
	}

	.yw-rec-portrait {
		height: 410px;
	}

	.yw-rec-portrait::before {
		left: 50%;
		bottom: -70px;
		width: 420px;
		height: 158px;
	}

	.yw-rec-portrait::after {
		display: block;
		left: 50%;
		bottom: -44px;
		width: 380px;
		height: 126px;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -76px;
		width: min(345px, 92vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		bottom: 76px;
		width: min(268px, 82vw);
	}

	.yw-rec-logic-story {
		border-radius: 24px;
		padding: 18px;
	}

	.yw-rec-logic-track .yw-rec-logic-step {
		grid-template-columns: 1fr;
		min-height: 0;
		text-align: center;
	}

	.yw-rec-logic-track .yw-rec-logic-step span {
		grid-row: auto;
		margin: 0 auto 18px;
	}

	.yw-rec-logic-current strong {
		font-size: 26px;
	}

	.yw-rec-video-section .yw-rec-video-frame {
		border-width: 5px;
		border-radius: 20px;
	}
}

body:has(.yw-recitation-v2) {
	overflow-x: hidden;
}

.yw-recitation-v2 {
	--rec-coral: #E91E63;
	--rec-coral-hot: #F50057;
	--rec-coral-deep: #D81B60;
	--rec-ink: #172033;
	--rec-text: #333333;
	--rec-muted: #505B6A;
	--rec-line: #E8E2DE;
	--rec-cream: #FFFDF6;
	--rec-blush: #FFF4F8;
	--rec-green: #2D9C89;
	--rec-green-soft: #EFFAF6;
	--rec-blue: #2457A6;
	--rec-blue-soft: #EEF5FF;
	--rec-gold: #C7923E;
	--rec-gold-soft: #FFF7E6;
	--rec-card: #FFFFFF;
	--rec-paper: #FFFCF7;
	--rec-line-strong: #DDD5CE;
	--rec-shadow-card: 0 22px 52px rgba(23, 32, 51, 0.085);
	--rec-shadow-soft: 0 16px 38px rgba(23, 32, 51, 0.065);
	--rec-font-hero: clamp(44px, 5.2vw, 70px);
	--rec-font-kicker: clamp(17px, 1.6vw, 22px);
	--rec-font-lead: clamp(18px, 1.6vw, 22px);
	--rec-font-section: clamp(32px, 3.6vw, 46px);
	--rec-font-section-compact: clamp(30px, 3.4vw, 44px);
	--rec-font-card-title: 23px;
	--rec-font-card-title-lg: 24px;
	--rec-font-card-title-xl: 30px;
	--rec-font-body: 16px;
	--rec-font-body-lg: 17px;
	--rec-font-label: 14px;
	--rec-font-meta: 13px;
	--rec-font-small: 12px;
	--rec-font-number: clamp(36px, 4vw, 42px);
	--rec-line-title: 1.25;
	--rec-line-body: 1.72;
	background: #FFFFFF;
	color: var(--rec-text);
	font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
	font-size: var(--rec-font-body);
	line-height: 1.75;
	overflow-x: clip;
}

.yw-recitation-v2 * {
	box-sizing: border-box;
}

.yw-recitation-v2 a {
	color: inherit;
	text-decoration: none !important;
	box-shadow: none !important;
}

.yw-recitation-v2 [id] {
	scroll-margin-top: 96px;
}

.yw-rec-wrap {
	width: min(1160px, calc(100vw - 44px));
	margin: 0 auto;
}

@media (min-width: 981px) and (max-width: 1460px) {
	.yw-rec-wrap {
		width: min(1040px, calc(100vw - 230px));
		margin-left: max(168px, calc((100vw - min(1040px, calc(100vw - 230px))) / 2 + 46px));
		margin-right: 36px;
	}

	.yw-rec-elevator {
		left: 18px;
	}

	.yw-rec-elevator__panel {
		width: 118px;
	}
}

.yw-rec-hero {
	position: relative;
	min-height: min(760px, calc(100vh - 76px));
	padding: clamp(58px, 7vw, 92px) 0 clamp(48px, 6vw, 76px);
	background:
		radial-gradient(circle at 10% 10%, rgba(233, 30, 99, 0.10), transparent 27%),
		radial-gradient(circle at 78% 24%, rgba(45, 156, 137, 0.14), transparent 25%),
		linear-gradient(135deg, #FFFFFF 0%, #FFFDF6 46%, #EEF5FF 100%);
	overflow: hidden;
}

.yw-rec-hero::before,
.yw-rec-hero::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
}

.yw-rec-hero::before {
	width: 460px;
	height: 460px;
	right: max(20px, 9vw);
	top: 66px;
	border: 1px solid rgba(233, 30, 99, 0.18);
}

.yw-rec-hero::after {
	width: 300px;
	height: 300px;
	right: max(98px, 17vw);
	bottom: 70px;
	border: 1px solid rgba(45, 156, 137, 0.18);
}

.yw-rec-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.04fr) minmax(310px, 0.78fr);
	gap: clamp(34px, 6vw, 72px);
	align-items: center;
	min-width: 0;
}

.yw-rec-hero__copy {
	min-width: 0;
}

.yw-rec-kicker {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	color: var(--rec-coral-deep);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0;
}

.yw-rec-kicker::before {
	content: "";
	width: 28px;
	height: 2px;
	border-radius: 999px;
	background: currentColor;
}

.yw-rec-hero .yw-rec-kicker {
	margin-bottom: 18px;
	font-size: var(--rec-font-kicker);
	font-weight: 900;
}

.yw-rec-hero .yw-rec-kicker::before {
	display: none;
}

.yw-rec-hero h1 {
	max-width: 680px;
	margin: 0;
	color: var(--rec-ink);
	font-family: "Montserrat", "PingFang SC", "Noto Sans SC", sans-serif;
	font-size: var(--rec-font-hero);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: 0;
	overflow-wrap: anywhere;
}

.yw-rec-mobile-title-break,
.yw-rec-mobile-lead-break {
	display: none;
}

.yw-rec-lead {
	max-width: 660px;
	margin: 24px 0 0;
	color: #3F4652;
	font-size: var(--rec-font-lead);
	font-weight: 600;
	line-height: 1.72;
	overflow-wrap: anywhere;
}

.yw-rec-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 32px;
}

.yw-rec-btn {
	display: inline-flex;
	min-height: 50px;
	align-items: center;
	justify-content: center;
	border: 1px solid transparent;
	border-radius: 999px;
	padding: 14px 28px;
	font-size: var(--rec-font-body);
	font-weight: 800;
	line-height: 1.1;
	cursor: pointer;
	text-decoration: none !important;
	transition: transform 220ms ease, box-shadow 220ms ease, background-color 220ms ease, border-color 220ms ease;
}

.yw-rec-btn--primary {
	background: var(--rec-coral-hot);
	border-color: var(--rec-coral-hot);
	color: #FFFFFF !important;
	box-shadow: 0 16px 32px rgba(245, 0, 87, 0.18);
}

.yw-rec-btn--primary:hover {
	background: var(--rec-coral-deep);
	border-color: var(--rec-coral-deep);
	color: #FFFFFF !important;
	transform: translateY(-2px);
	box-shadow: 0 20px 40px rgba(216, 27, 96, 0.22);
}

.yw-rec-btn--ghost {
	background: rgba(255, 255, 255, 0.88);
	border-color: rgba(23, 32, 51, 0.12);
	color: var(--rec-ink) !important;
}

.yw-rec-btn--ghost:hover {
	border-color: rgba(233, 30, 99, 0.26);
	background: #FFFFFF;
	transform: translateY(-2px);
	box-shadow: 0 14px 28px rgba(23, 32, 51, 0.08);
}

.yw-rec-btn::before,
.yw-rec-btn::after {
	display: none !important;
}

.yw-rec-hero__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 34px;
}

.yw-rec-hero__chips span {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.78);
	padding: 8px 14px;
	color: #485466;
	font-size: var(--rec-font-label);
	font-weight: 800;
}

.yw-rec-hero__chips span:nth-child(2) {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-hero__chips span:nth-child(3) {
	background: var(--rec-gold-soft);
	color: #7C5718;
}

.yw-rec-hero__chips span:nth-child(4) {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-portrait {
	position: relative;
	min-height: 548px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.yw-rec-portrait__rings {
	position: absolute;
	inset: 42px 8px 36px;
	border: 1px solid rgba(45, 156, 137, 0.18);
	border-radius: 50%;
}

.yw-rec-portrait__rings::before,
.yw-rec-portrait__rings::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	border: 1px solid rgba(233, 30, 99, 0.14);
}

.yw-rec-portrait__rings::before {
	inset: 38px;
}

.yw-rec-portrait__rings::after {
	inset: 86px;
	border-color: rgba(199, 146, 62, 0.18);
}

.yw-rec-portrait img {
	position: relative;
	z-index: 2;
	display: block;
	width: min(430px, 96%);
	max-height: 610px;
	object-fit: contain;
	object-position: center top;
	filter: drop-shadow(0 30px 34px rgba(23, 32, 51, 0.18));
}

.yw-rec-teacher-card,
.yw-rec-student-card {
	position: absolute;
	z-index: 3;
	left: 0;
	bottom: 58px;
	width: min(220px, 48%);
	border: 1px solid rgba(233, 30, 99, 0.16);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.94);
	padding: 18px;
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.10);
	backdrop-filter: blur(12px);
}

.yw-rec-student-card {
	width: min(252px, 56%);
}

.yw-rec-teacher-card strong,
.yw-rec-student-card strong {
	display: block;
	color: var(--rec-ink);
	font-size: 20px;
	line-height: 1.25;
}

.yw-rec-teacher-card span,
.yw-rec-student-card span {
	display: block;
	margin-top: 8px;
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	line-height: 1.55;
}

.yw-rec-nav {
	position: sticky;
	top: 0;
	z-index: 20;
	border-top: 1px solid rgba(23, 32, 51, 0.08);
	border-bottom: 1px solid rgba(23, 32, 51, 0.08);
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: blur(14px);
}

.yw-rec-nav__inner {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	padding-top: 12px;
	padding-bottom: 12px;
	scrollbar-width: none;
}

.yw-rec-nav__inner::-webkit-scrollbar {
	display: none;
}

.yw-rec-nav a {
	flex: 0 0 auto;
	border: 1px solid var(--rec-line);
	border-radius: 999px;
	background: #FFFFFF;
	padding: 8px 13px;
	color: #4A5568;
	font-size: 14px;
	font-weight: 800;
	transition: color 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.yw-rec-nav a:hover,
.yw-rec-nav a.is-active {
	border-color: rgba(233, 30, 99, 0.22);
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
}

.yw-rec-elevator {
	position: fixed;
	left: max(8px, calc((100vw - 1360px) / 2 - 56px));
	top: 188px;
	z-index: 32;
	font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}

.yw-rec-elevator__toggle,
.yw-rec-mobile-menu {
	min-height: 48px;
	border: 1px solid rgba(233, 30, 99, 0.18);
	border-radius: 999px;
	background: #FFFFFF;
	color: var(--rec-coral-deep);
	box-shadow: 0 16px 36px rgba(23, 32, 51, 0.12);
	font-size: 14px;
	font-weight: 900;
	cursor: pointer;
	transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

.yw-rec-elevator__toggle {
	display: none !important;
}

.yw-rec-elevator__toggle:focus-visible,
.yw-rec-mobile-menu:focus-visible {
	outline: 3px solid rgba(233, 30, 99, 0.18);
	outline-offset: 3px;
}

.yw-rec-elevator__panel {
	width: 128px;
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.94);
	padding: 12px;
	box-shadow: 0 22px 54px rgba(23, 32, 51, 0.14);
	backdrop-filter: blur(14px);
}

.yw-rec-elevator__panel[hidden] {
	display: none !important;
}

.yw-rec-elevator__title {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	border-bottom: 0;
	padding: 4px;
	color: var(--rec-muted);
	font-size: 12px;
	font-weight: 900;
}

.yw-rec-elevator__title span:last-child {
	color: var(--rec-coral-deep);
}

.yw-rec-elevator__panel a {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 42px;
	border-radius: 12px;
	padding: 9px 10px 9px 17px;
	color: #4A5568;
	font-size: 13px;
	font-weight: 850;
	line-height: 1.25;
	transition: color 180ms ease, background-color 180ms ease, transform 180ms ease;
}

.yw-rec-elevator__panel a::before {
	content: "";
	position: absolute;
	left: 7px;
	top: 50%;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: rgba(233, 30, 99, 0.24);
	transform: translateY(-50%);
	transition: transform 180ms ease, background-color 180ms ease;
}

.yw-rec-elevator__panel a:hover,
.yw-rec-elevator__panel a:focus-visible,
.yw-rec-elevator__panel a.is-active {
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	outline: none;
}

.yw-rec-elevator__panel a:hover,
.yw-rec-elevator__panel a:focus-visible {
	transform: translateX(2px);
}

.yw-rec-elevator__panel a.is-active::before {
	background: var(--rec-coral-hot);
	transform: translateY(-50%) scale(1.7);
}

.yw-rec-section {
	padding: clamp(62px, 7vw, 96px) 0;
	background: #FFFFFF;
}

.yw-rec-section--cream {
	background: var(--rec-cream);
}

.yw-rec-section--mint {
	background: var(--rec-green-soft);
}

.yw-rec-section--blue {
	background: var(--rec-blue-soft);
}

.yw-rec-head {
	max-width: 780px;
	margin: 0 auto 38px;
	text-align: center;
}

.yw-rec-split-head {
	display: block;
	max-width: 880px;
	margin: 0 auto 38px;
	text-align: center;
}

.yw-rec-head h2,
.yw-rec-split-head h2,
.yw-rec-video-copy h2,
.yw-rec-proof-band h2,
.yw-rec-signup h2 {
	margin: 0;
	color: var(--rec-ink);
	font-family: "Montserrat", "PingFang SC", "Noto Sans SC", sans-serif;
	font-size: var(--rec-font-section);
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0;
}

.yw-rec-head p:not(.yw-rec-kicker),
.yw-rec-split-head p,
.yw-rec-video-copy p,
.yw-rec-signup__main > p,
.yw-rec-proof-band > div:first-child p:not(.yw-rec-kicker) {
	margin: 16px 0 0;
	color: var(--rec-muted);
	font-size: var(--rec-font-body-lg);
	line-height: 1.78;
}

.yw-rec-split-head p {
	max-width: 760px;
	margin-right: auto;
	margin-left: auto;
}

.yw-rec-pain-grid,
.yw-rec-system-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.yw-rec-card,
.yw-rec-method-card,
.yw-rec-map-card,
.yw-rec-system-card,
.yw-rec-subject,
.yw-rec-fit-card,
.yw-rec-price-grid article,
.yw-rec-proof-grid article,
.yw-rec-faq details {
	border: 1px solid var(--rec-line);
	border-radius: 22px;
	background: #FFFFFF;
	box-shadow: var(--rec-shadow-soft);
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}

.yw-rec-card:hover,
.yw-rec-method-card:hover,
.yw-rec-map-card:hover,
.yw-rec-system-card:hover,
.yw-rec-subject:hover,
.yw-rec-fit-card:hover,
.yw-rec-price-grid article:hover,
.yw-rec-proof-grid article:hover {
	transform: translateY(-5px);
	border-color: rgba(233, 30, 99, 0.22);
	box-shadow: 0 24px 54px rgba(23, 32, 51, 0.10);
}

.yw-rec-pain-card {
	min-height: 232px;
	padding: 26px;
}

.yw-rec-pain-card span,
.yw-rec-system-card em {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-style: normal;
	font-size: var(--rec-font-label);
	font-weight: 900;
}

.yw-rec-pain-card:nth-child(2) span,
.yw-rec-system-card:nth-child(2) em,
.yw-rec-system-card:nth-child(5) em {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-pain-card:nth-child(3) span,
.yw-rec-system-card:nth-child(3) em,
.yw-rec-system-card:nth-child(6) em {
	background: var(--rec-gold-soft);
	color: #7C5718;
}

.yw-rec-pain-card:nth-child(4) span,
.yw-rec-system-card:nth-child(4) em {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-pain-card h3,
.yw-rec-method-card h3,
.yw-rec-map-card h3,
.yw-rec-system-card h3,
.yw-rec-guide h3,
.yw-rec-subject h3,
.yw-rec-fit-card h3,
.yw-rec-proof-grid h3 {
	margin: 18px 0 10px;
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title);
	line-height: var(--rec-line-title);
}

.yw-rec-pain-card p,
.yw-rec-method-card p,
.yw-rec-map-card p,
.yw-rec-system-card p,
.yw-rec-guide p,
.yw-rec-subject p,
.yw-rec-fit-card p,
.yw-rec-fit-card li,
.yw-rec-proof-grid p,
.yw-rec-price-grid p {
	margin: 0;
	color: var(--rec-muted);
	line-height: var(--rec-line-body);
}

.yw-rec-subject p {
	position: relative;
	z-index: 1;
}

.yw-rec-method-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.yw-rec-method-card {
	position: relative;
	min-height: 286px;
	padding: 26px;
	overflow: hidden;
}

.yw-rec-method-card::after {
	content: "";
	position: absolute;
	width: 148px;
	height: 148px;
	right: -62px;
	bottom: -62px;
	border: 1px solid rgba(233, 30, 99, 0.12);
	border-radius: 50%;
}

.yw-rec-method-card span {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-label);
	font-weight: 900;
}

.yw-rec-method-card:nth-child(2) span {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-method-card:nth-child(3) span {
	background: var(--rec-gold-soft);
	color: #7C5718;
}

.yw-rec-method-card:nth-child(4) span {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-method-card strong {
	display: block;
	margin: -2px 0 12px;
	color: var(--rec-coral-deep);
	font-size: 15px;
	line-height: 1.45;
}

.yw-rec-note {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin-top: 22px;
	border: 1px solid rgba(199, 146, 62, 0.18);
	border-radius: 22px;
	background: #FFF9EA;
	padding: 20px 22px;
	color: #66512A;
	box-shadow: 0 16px 34px rgba(199, 146, 62, 0.08);
}

.yw-rec-note strong {
	flex: 0 0 auto;
	color: #7C5718;
	font-weight: 900;
}

.yw-rec-note span {
	line-height: 1.72;
}

.yw-rec-logic-flow {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.yw-rec-logic-flow::before {
	content: "";
	position: absolute;
	left: 8%;
	right: 8%;
	top: 36px;
	height: 2px;
	background: linear-gradient(90deg, rgba(233, 30, 99, 0.24), rgba(45, 156, 137, 0.22), rgba(199, 146, 62, 0.22), rgba(36, 87, 166, 0.20));
}

.yw-rec-logic-step {
	position: relative;
	z-index: 1;
	border: 1px solid var(--rec-line);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.86);
	padding: 24px;
	box-shadow: var(--rec-shadow-soft);
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}

.yw-rec-logic-step:hover,
.yw-rec-delivery-card:hover {
	transform: translateY(-5px);
	border-color: rgba(233, 30, 99, 0.22);
	box-shadow: 0 24px 54px rgba(23, 32, 51, 0.10);
}

.yw-rec-logic-step span {
	display: inline-flex;
	width: 50px;
	height: 50px;
	align-items: center;
	justify-content: center;
	border: 2px solid rgba(233, 30, 99, 0.16);
	border-radius: 50%;
	background: #FFFFFF;
	color: var(--rec-coral-deep);
	font-weight: 900;
}

.yw-rec-logic-step:nth-child(2) span {
	border-color: rgba(45, 156, 137, 0.22);
	color: #236B5E;
}

.yw-rec-logic-step:nth-child(3) span {
	border-color: rgba(199, 146, 62, 0.24);
	color: #7C5718;
}

.yw-rec-logic-step:nth-child(4) span {
	border-color: rgba(36, 87, 166, 0.22);
	color: #245080;
}

.yw-rec-logic-step h3 {
	margin: 20px 0 8px;
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title-lg);
	line-height: var(--rec-line-title);
}

.yw-rec-logic-step strong {
	display: block;
	margin-bottom: 10px;
	color: var(--rec-coral-deep);
	font-size: 15px;
	line-height: 1.5;
}

.yw-rec-logic-step p,
.yw-rec-delivery-card p {
	margin: 0;
	color: var(--rec-muted);
	line-height: 1.7;
}

.yw-rec-logic-summary {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin-top: 22px;
	border: 1px solid rgba(45, 156, 137, 0.18);
	border-radius: 22px;
	background: #F3FCF8;
	padding: 20px 22px;
	color: #245F55;
	box-shadow: 0 16px 34px rgba(45, 156, 137, 0.08);
}

.yw-rec-logic-summary strong {
	flex: 0 0 auto;
	color: #236B5E;
	font-weight: 900;
}

.yw-rec-delivery-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.yw-rec-delivery-card {
	border: 1px solid var(--rec-line-strong);
	border-radius: 24px;
	background: #FFFFFF;
	padding: 22px;
	box-shadow: var(--rec-shadow-soft);
	transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}

.yw-rec-delivery-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 16px;
}

.yw-rec-delivery-card__top em {
	display: inline-flex;
	width: 38px;
	height: 38px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-style: normal;
	font-size: var(--rec-font-meta);
	font-weight: 900;
}

.yw-rec-delivery-card__top strong {
	border-radius: 999px;
	background: #F8F8F8;
	padding: 6px 10px;
	color: #4A5568;
	font-size: var(--rec-font-meta);
	line-height: 1.2;
}

.yw-rec-delivery-visual {
	min-height: 128px;
	border: 1px solid rgba(23, 32, 51, 0.06);
	border-radius: 18px;
	background: linear-gradient(135deg, #FFF8FB, #F7FFFC);
	padding: 16px;
	overflow: hidden;
}

.yw-rec-delivery-card h3 {
	margin: 18px 0 8px;
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title);
	line-height: var(--rec-line-title);
}

.yw-rec-delivery-card ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}

.yw-rec-delivery-card li {
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 6px 10px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 850;
	line-height: 1.25;
}

.yw-rec-delivery-card:nth-child(2) .yw-rec-delivery-card__top em,
.yw-rec-delivery-card:nth-child(5) .yw-rec-delivery-card__top em,
.yw-rec-delivery-card:nth-child(2) li,
.yw-rec-delivery-card:nth-child(5) li {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-delivery-card:nth-child(3) .yw-rec-delivery-card__top em,
.yw-rec-delivery-card:nth-child(3) li {
	background: var(--rec-gold-soft);
	color: #7C5718;
}

.yw-rec-delivery-card:nth-child(4) .yw-rec-delivery-card__top em,
.yw-rec-delivery-card:nth-child(6) .yw-rec-delivery-card__top em,
.yw-rec-delivery-card:nth-child(4) li,
.yw-rec-delivery-card:nth-child(6) li {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-visual-chain,
.yw-rec-visual-lesson,
.yw-rec-visual-works {
	display: grid;
	gap: 8px;
}

.yw-rec-visual-chain span,
.yw-rec-visual-lesson span,
.yw-rec-visual-works span,
.yw-rec-visual-map span,
.yw-rec-visual-map b,
.yw-rec-visual-task span,
.yw-rec-visual-task b,
.yw-rec-visual-chat span {
	display: flex;
	align-items: center;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.84);
	padding: 8px 10px;
	color: var(--rec-ink);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1.2;
	box-shadow: 0 10px 22px rgba(23, 32, 51, 0.055);
}

.yw-rec-visual-chain i {
	width: 2px;
	height: 10px;
	margin-left: 18px;
	border-radius: 999px;
	background: rgba(233, 30, 99, 0.28);
}

.yw-rec-visual-map {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	padding-top: 54px;
}

.yw-rec-visual-map span {
	position: absolute;
	left: 50%;
	top: 0;
	width: 148px;
	justify-content: center;
	background: #172033;
	color: #FFFFFF;
	transform: translateX(-50%);
}

.yw-rec-visual-map b {
	justify-content: center;
	color: #236B5E;
}

.yw-rec-visual-task {
	display: grid;
	gap: 10px;
}

.yw-rec-visual-task span {
	width: max-content;
	background: var(--rec-gold-soft);
	color: #7C5718;
}

.yw-rec-visual-task i {
	display: block;
	width: var(--w);
	height: 8px;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--rec-coral), var(--rec-gold));
}

.yw-rec-visual-chat {
	display: grid;
	gap: 10px;
}

.yw-rec-visual-chat span:nth-child(1) {
	justify-self: start;
	max-width: 78%;
	background: #FFFFFF;
}

.yw-rec-visual-chat span:nth-child(2) {
	justify-self: end;
	max-width: 82%;
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-relation {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	align-items: stretch;
	margin-bottom: 24px;
	border: 1px solid var(--rec-line-strong);
	border-radius: 26px;
	background: linear-gradient(135deg, #FFFFFF 0%, var(--rec-paper) 52%, #F5FFFB 100%);
	padding: clamp(24px, 4vw, 34px);
	box-shadow: var(--rec-shadow-card);
}

.yw-rec-relation h3,
.yw-rec-proof-card h3,
.yw-rec-price-table-wrap h3 {
	margin: 0;
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title-lg);
	line-height: 1.32;
}

.yw-rec-relation p,
.yw-rec-proof-card p {
	margin: 12px 0 0;
	color: var(--rec-muted);
	line-height: 1.75;
}

.yw-rec-relation__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.yw-rec-relation__grid span {
	display: grid;
	align-content: start;
	gap: 6px;
	border: 1px solid rgba(23, 32, 51, 0.06);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.82);
	padding: 16px;
	color: var(--rec-muted);
	font-size: 14px;
	line-height: 1.55;
}

.yw-rec-relation__grid strong {
	display: block;
	color: var(--rec-coral-deep);
	font-size: 17px;
	line-height: 1.25;
}

.yw-rec-delivery-shell {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	align-items: start;
}

.yw-rec-delivery-steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 12px;
	overflow: visible;
}

.yw-rec-delivery-steps a {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
	align-content: start;
	border: 1px solid rgba(23, 32, 51, 0.10);
	border-radius: 22px;
	background: #FFFFFF;
	padding: 16px;
	box-shadow: var(--rec-shadow-soft);
	transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease, background-color 220ms ease;
	isolation: isolate;
}

.yw-rec-delivery-steps a::after {
	content: "";
	position: absolute;
	z-index: 4;
	right: -15px;
	top: 33px;
	width: 20px;
	height: 20px;
	border-top: 2px solid rgba(233, 30, 99, 0.28);
	border-right: 2px solid rgba(233, 30, 99, 0.28);
	transform: rotate(45deg);
	pointer-events: none;
	transition: border-color 220ms ease, transform 220ms ease;
}

.yw-rec-delivery-steps a:last-child::after {
	display: none;
}

.yw-rec-delivery-steps a:hover,
.yw-rec-delivery-steps a:focus-visible,
.yw-rec-delivery-steps a.is-active {
	border-color: rgba(233, 30, 99, 0.22);
	background: #FFFFFF;
	transform: translateY(-4px);
	box-shadow: 0 24px 52px rgba(23, 32, 51, 0.12);
	outline: 0;
}

.yw-rec-delivery-steps a:hover::after,
.yw-rec-delivery-steps a:focus-visible::after,
.yw-rec-delivery-steps a.is-active::after {
	border-color: var(--rec-coral-hot);
	transform: translateX(2px) rotate(45deg);
}

.yw-rec-delivery-steps em {
	display: inline-flex;
	width: 34px;
	height: 34px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-style: normal;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	transition: background-color 220ms ease, color 220ms ease, box-shadow 220ms ease;
}

.yw-rec-delivery-steps span {
	color: var(--rec-ink);
	font-size: 15px;
	font-weight: 900;
	line-height: 1.25;
	transition: color 220ms ease;
}

.yw-rec-delivery-steps strong {
	color: var(--rec-muted);
	font-size: var(--rec-font-small);
	line-height: 1.25;
}

.yw-rec-delivery-steps a.is-active em {
	background: var(--rec-coral-hot);
	color: #FFFFFF;
	box-shadow: 0 10px 20px rgba(245, 0, 87, 0.18);
}

.yw-rec-delivery-steps a.is-active span {
	color: var(--rec-coral-deep);
}

.yw-rec-delivery-steps a:nth-child(2),
.yw-rec-delivery-steps a:nth-child(5) {
	background: linear-gradient(180deg, #FFFFFF 0%, #F4FCF8 100%);
}

.yw-rec-delivery-steps a:nth-child(3) {
	background: linear-gradient(180deg, #FFFFFF 0%, #FFF8EC 100%);
}

.yw-rec-delivery-steps a:nth-child(4),
.yw-rec-delivery-steps a:nth-child(6) {
	background: linear-gradient(180deg, #FFFFFF 0%, #F3F8FF 100%);
}

.yw-rec-delivery-steps a.is-active {
	background: #FFFFFF;
}

.yw-rec-delivery-detail {
	display: grid;
	gap: 18px;
	min-width: 0;
}

.yw-rec-proof-card {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(260px, 0.82fr);
	gap: 24px;
	align-items: center;
	border: 1px solid var(--rec-line-strong);
	border-radius: 26px;
	background: #FFFFFF;
	padding: clamp(22px, 3.6vw, 34px);
	box-shadow: var(--rec-shadow-card);
	overflow: hidden;
}

.yw-rec-proof-card--full {
	grid-template-columns: 1fr;
}

.yw-rec-proof-card > div > span {
	display: inline-flex;
	margin-bottom: 12px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 6px 10px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1.2;
}

.yw-rec-proof-card ul {
	display: grid;
	gap: 8px;
	margin: 16px 0 0;
	padding-left: 20px;
	color: var(--rec-muted);
	line-height: 1.65;
}

.yw-rec-inline-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	margin-top: 18px;
	border-radius: 999px;
	background: var(--rec-ink);
	padding: 10px 16px;
	color: #FFFFFF !important;
	font-size: var(--rec-font-label);
	font-weight: 900;
	text-decoration: none !important;
}

.yw-rec-inline-link:hover,
.yw-rec-inline-link:focus-visible {
	background: var(--rec-coral-deep);
	outline: 0;
}

.yw-rec-note-previews {
	position: relative;
	display: flex;
	min-height: 260px;
	align-items: flex-end;
	justify-content: center;
	padding: 18px;
}

.yw-rec-note-previews img {
	width: 36%;
	max-width: 150px;
	aspect-ratio: 0.72;
	object-fit: cover;
	object-position: top;
	border-radius: 14px;
	box-shadow: 0 18px 34px rgba(23, 32, 51, 0.18);
	transform: rotate(-4deg);
}

.yw-rec-note-previews img:nth-child(2) {
	z-index: 2;
	width: 42%;
	max-width: 176px;
	transform: translateY(-12px);
}

.yw-rec-note-previews img:nth-child(3) {
	transform: rotate(4deg);
}

.yw-rec-proof-image,
.yw-rec-plan-gallery img,
.yw-rec-price-image img {
	display: block;
	width: 100%;
	border-radius: 18px;
	box-shadow: 0 18px 36px rgba(23, 32, 51, 0.10);
}

.yw-rec-proof-image {
	max-height: 340px;
	object-fit: contain;
	background: #FFFFFF;
}

.yw-rec-plan-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.yw-rec-plan-gallery figure {
	display: grid;
	gap: 12px;
	margin: 0;
	border: 1px solid var(--rec-line);
	border-radius: 22px;
	background: #FFFFFF;
	padding: 14px;
	box-shadow: 0 14px 30px rgba(23, 32, 51, 0.05);
}

.yw-rec-plan-gallery img {
	height: 380px;
	object-fit: contain;
	object-position: top center;
	background: #FFFFFF;
}

.yw-rec-plan-gallery figcaption {
	display: grid;
	gap: 4px;
}

.yw-rec-plan-gallery figcaption strong {
	color: var(--rec-ink);
	font-size: var(--rec-font-body-lg);
	line-height: 1.3;
}

.yw-rec-plan-gallery figcaption span {
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	line-height: 1.55;
}

.yw-rec-lesson-preview {
	display: grid;
	align-content: center;
	gap: 12px;
	border-radius: 22px;
	background:
		radial-gradient(circle at 88% 14%, rgba(36, 87, 166, 0.14), transparent 34%),
		linear-gradient(135deg, var(--rec-blue-soft), #FFFFFF);
	padding: 24px;
	min-height: 220px;
}

.yw-rec-lesson-preview strong {
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title);
	line-height: 1.35;
}

.yw-rec-lesson-preview span {
	color: var(--rec-muted);
	line-height: 1.72;
}

.yw-rec-works-mini {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	border-radius: 22px;
	background: linear-gradient(135deg, var(--rec-cream), var(--rec-blue-soft));
	padding: 22px;
}

.yw-rec-works-mini strong {
	display: inline-flex;
	width: 56px;
	height: 56px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #FFFFFF;
	color: var(--rec-coral-deep);
	font-size: 22px;
}

.yw-rec-works-mini span {
	color: var(--rec-ink);
	font-weight: 850;
	line-height: 1.55;
}

.yw-rec-qa-mini {
	display: grid;
	justify-items: center;
	gap: 12px;
	border-radius: 22px;
	background: var(--rec-blush);
	padding: 22px;
	text-align: center;
}

.yw-rec-qa-mini img {
	width: min(220px, 100%);
	border-radius: 18px;
	background: #FFFFFF;
	box-shadow: 0 16px 34px rgba(23, 32, 51, 0.10);
}

.yw-rec-qa-mini span {
	color: var(--rec-coral-deep);
	font-weight: 900;
}

.yw-rec-map-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.yw-rec-map-card {
	position: relative;
	min-height: 330px;
	padding: 26px;
	overflow: hidden;
}

.yw-rec-map-card::before {
	content: "";
	position: absolute;
	left: 50px;
	top: 150px;
	bottom: 34px;
	width: 2px;
	background: linear-gradient(180deg, rgba(233, 30, 99, 0.28), rgba(45, 156, 137, 0.22), rgba(36, 87, 166, 0.18));
}

.yw-rec-map-card__root {
	position: relative;
	z-index: 1;
	border-radius: 18px;
	background: #172033;
	padding: 20px;
	color: #FFFFFF;
}

.yw-rec-map-card__root span {
	display: inline-flex;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.14);
	padding: 5px 10px;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 900;
}

.yw-rec-map-card__root h3 {
	margin: 12px 0 8px;
	color: #FFFFFF;
	font-size: 24px;
}

.yw-rec-map-card__root p {
	color: rgba(255, 255, 255, 0.78);
	font-size: 14px;
}

.yw-rec-map-card ul {
	position: relative;
	z-index: 1;
	display: grid;
	gap: 12px;
	margin: 18px 0 0;
	padding: 0 0 0 36px;
	list-style: none;
}

.yw-rec-map-card li {
	position: relative;
	border: 1px solid var(--rec-line);
	border-radius: 14px;
	background: #FFF8EC;
	padding: 12px 14px;
	color: #5C4A2A;
	font-size: 15px;
	font-weight: 800;
	line-height: 1.45;
}

.yw-rec-map-card li::before {
	content: "";
	position: absolute;
	left: -28px;
	top: 50%;
	width: 28px;
	height: 2px;
	background: rgba(199, 146, 62, 0.32);
}

.yw-rec-map-card:nth-child(2) .yw-rec-map-card__root {
	background: #2457A6;
}

.yw-rec-map-card:nth-child(2) li {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-map-card:nth-child(3) .yw-rec-map-card__root {
	background: #2D9C89;
}

.yw-rec-map-card:nth-child(3) li {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-plan-grid {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.yw-rec-plan-grid::before {
	content: "";
	position: absolute;
	left: 7%;
	right: 7%;
	top: 36px;
	height: 2px;
	background: linear-gradient(90deg, rgba(233, 30, 99, 0.18), rgba(45, 156, 137, 0.18), rgba(36, 87, 166, 0.18));
}

.yw-rec-plan-grid article {
	position: relative;
	z-index: 1;
	padding: 0 8px;
}

.yw-rec-plan-grid span {
	display: inline-flex;
	min-width: 74px;
	height: 74px;
	align-items: center;
	justify-content: center;
	border: 2px solid rgba(233, 30, 99, 0.20);
	border-radius: 50%;
	background: #FFFFFF;
	color: var(--rec-coral-deep);
	font-weight: 900;
}

.yw-rec-plan-grid article:nth-child(2) span {
	border-color: rgba(45, 156, 137, 0.24);
	color: #236B5E;
}

.yw-rec-plan-grid article:nth-child(3) span {
	border-color: rgba(199, 146, 62, 0.26);
	color: #7C5718;
}

.yw-rec-plan-grid article:nth-child(4) span {
	border-color: rgba(36, 87, 166, 0.22);
	color: #245080;
}

.yw-rec-plan-grid h3 {
	margin: 18px 0 8px;
	color: var(--rec-ink);
	font-size: 22px;
	line-height: 1.32;
}

.yw-rec-plan-grid p {
	margin: 0;
	color: var(--rec-muted);
	line-height: 1.7;
}

.yw-rec-video-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 26px;
	align-items: stretch;
}

.yw-rec-video-copy {
	max-width: 840px;
	margin: 0 auto;
	border: 1px solid rgba(36, 87, 166, 0.12);
	border-radius: 24px;
	background: #FFFFFF;
	padding: clamp(28px, 4vw, 42px);
	box-shadow: 0 20px 48px rgba(23, 32, 51, 0.07);
	text-align: center;
}

.yw-rec-video-points {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	margin-top: 24px;
}

.yw-rec-video-points span {
	border-radius: 999px;
	background: var(--rec-blue-soft);
	padding: 8px 12px;
	color: #245080;
	font-size: var(--rec-font-label);
	font-weight: 800;
}

.yw-rec-video-frame {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 26px;
	background: #111827;
	box-shadow: 0 26px 62px rgba(17, 24, 39, 0.18);
}

.yw-rec-video-frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.yw-rec-video-fullscreen {
	position: absolute;
	z-index: 3;
	right: 16px;
	bottom: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	border: 1px solid rgba(255, 255, 255, 0.42);
	border-radius: 999px;
	background: rgba(23, 32, 51, 0.76);
	padding: 9px 15px;
	color: #FFFFFF;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
	cursor: pointer;
	backdrop-filter: blur(10px);
	transition: transform 180ms ease, background-color 180ms ease;
}

.yw-rec-video-fullscreen:hover,
.yw-rec-video-fullscreen:focus-visible {
	background: rgba(233, 30, 99, 0.88);
	transform: translateY(-1px);
	outline: 0;
}

.yw-rec-guide {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
	counter-reset: guide;
}

.yw-rec-guide article {
	position: relative;
	min-height: 242px;
	border: 1px solid rgba(36, 87, 166, 0.12);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.88);
	padding: 26px;
	overflow: hidden;
}

.yw-rec-guide article::after {
	counter-increment: guide;
	content: counter(guide);
	position: absolute;
	right: 18px;
	bottom: -8px;
	color: rgba(36, 87, 166, 0.10);
	font-size: 88px;
	font-weight: 900;
	line-height: 1;
}

.yw-rec-guide span {
	display: inline-flex;
	border-radius: 999px;
	background: #FFFFFF;
	padding: 6px 11px;
	color: var(--rec-blue);
	font-size: 13px;
	font-weight: 900;
}

.yw-rec-system-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.yw-rec-system-card {
	min-height: 252px;
	padding: 28px;
}

.yw-rec-subject-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.yw-rec-subject {
	position: relative;
	min-height: 334px;
	padding: 30px;
	overflow: hidden;
}

.yw-rec-subject::after {
	content: "";
	position: absolute;
	width: 176px;
	height: 176px;
	right: -70px;
	top: -70px;
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 50%;
}

.yw-rec-subject--green::after {
	border-color: rgba(45, 156, 137, 0.18);
}

.yw-rec-subject--blue::after {
	border-color: rgba(36, 87, 166, 0.18);
}

.yw-rec-subject__icon {
	position: absolute;
	z-index: 1;
	right: 24px;
	top: 22px;
	width: 62px;
	height: 62px;
	color: var(--rec-coral-deep);
	opacity: 0.92;
}

.yw-rec-subject__icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.yw-rec-subject--green .yw-rec-subject__icon {
	color: #236B5E;
}

.yw-rec-subject--blue .yw-rec-subject__icon {
	color: #245080;
}

.yw-rec-subject span {
	position: relative;
	z-index: 1;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-label);
	font-weight: 900;
}

.yw-rec-subject--green span {
	color: #236B5E;
}

.yw-rec-subject--blue span {
	color: #245080;
}

.yw-rec-subject h3 {
	position: relative;
	z-index: 1;
	margin-top: 14px;
	font-size: var(--rec-font-card-title-xl);
}

.yw-rec-subject strong {
	position: relative;
	z-index: 1;
	display: block;
	margin: 20px 0 12px;
	color: var(--rec-ink);
	font-size: var(--rec-font-number);
	line-height: 1;
}

.yw-rec-subject a {
	position: relative;
	z-index: 1;
	display: inline-flex;
	margin-top: 18px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 9px 13px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-label);
	font-weight: 900;
	text-decoration: none !important;
}

.yw-rec-subject em {
	position: relative;
	z-index: 1;
	display: inline-flex;
	margin-top: 18px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.78);
	padding: 9px 13px;
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	font-style: normal;
	font-weight: 900;
}

.yw-rec-subject--green a {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-subject--blue a {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-topic-panels {
	display: grid;
	gap: 16px;
	margin-top: 24px;
}

.yw-rec-topic-panel {
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 26px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.055);
	overflow: hidden;
}

.yw-rec-topic-panel > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 22px 24px;
	cursor: pointer;
	list-style: none;
}

.yw-rec-topic-panel > summary::-webkit-details-marker,
.yw-rec-topic-group > summary::-webkit-details-marker {
	display: none;
}

.yw-rec-topic-panel > summary span {
	display: grid;
	gap: 5px;
}

.yw-rec-topic-panel > summary strong {
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title-lg);
	line-height: 1.3;
}

.yw-rec-topic-panel > summary em {
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	font-style: normal;
	line-height: 1.55;
}

.yw-rec-topic-panel > summary b {
	flex: 0 0 auto;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 8px 13px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	line-height: 1;
}

.yw-rec-topic-panel[open] > summary b {
	background: var(--rec-ink);
	color: #FFFFFF;
}

.yw-rec-topic-groups {
	display: grid;
	gap: 12px;
	border-top: 1px solid var(--rec-line);
	padding: 0 24px 24px;
}

.yw-rec-topic-group {
	border: 1px solid var(--rec-line);
	border-radius: 18px;
	background: #FFFFFF;
	overflow: hidden;
}

.yw-rec-topic-group > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 18px;
	cursor: pointer;
	list-style: none;
}

.yw-rec-topic-group > summary strong {
	color: var(--rec-ink);
	font-size: 17px;
	line-height: 1.35;
}

.yw-rec-topic-group > summary em {
	flex: 0 0 auto;
	border-radius: 999px;
	background: var(--rec-green-soft);
	padding: 5px 10px;
	color: #236B5E;
	font-size: 12px;
	font-style: normal;
	font-weight: 900;
}

.yw-rec-topic-group ol {
	display: grid;
	gap: 8px;
	max-height: min(560px, 62vh);
	margin: 0;
	padding: 0 18px 18px;
	overflow: auto;
	list-style: none;
	counter-reset: topic;
}

.yw-rec-topic-group li {
	position: relative;
	display: grid;
	gap: 4px;
	border-radius: 14px;
	background: #FAFAFA;
	padding: 12px 14px 12px 48px;
	color: var(--rec-text);
	line-height: 1.55;
	counter-increment: topic;
}

.yw-rec-topic-group li::before {
	content: counter(topic, decimal-leading-zero);
	position: absolute;
	left: 14px;
	top: 13px;
	color: var(--rec-coral-deep);
	font-size: 12px;
	font-weight: 900;
}

.yw-rec-topic-group li span {
	color: var(--rec-muted);
	font-size: 12px;
	font-weight: 800;
}

.yw-rec-topic-group li strong {
	color: var(--rec-ink);
	font-size: 15px;
	font-weight: 800;
	line-height: 1.55;
}

.yw-rec-proof-band {
	display: grid;
	grid-template-columns: minmax(280px, 0.58fr) minmax(0, 1fr);
	gap: 30px;
	align-items: stretch;
	border-radius: 28px;
	background: #1E293B;
	padding: clamp(30px, 5vw, 54px);
	color: #FFFFFF;
	overflow: hidden;
}

.yw-rec-proof-band .yw-rec-kicker,
.yw-rec-proof-band h2 {
	color: #FFFFFF;
}

.yw-rec-proof-band .yw-rec-kicker::before {
	background: #FDD7E5;
}

.yw-rec-proof-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.yw-rec-proof-grid article {
	background: rgba(255, 255, 255, 0.10);
	border-color: rgba(255, 255, 255, 0.16);
	box-shadow: none;
	padding: 22px;
}

.yw-rec-proof-grid strong {
	display: block;
	color: #FFFFFF;
	font-size: 34px;
	line-height: 1;
}

.yw-rec-proof-grid h3 {
	color: #FFFFFF;
	font-size: 20px;
}

.yw-rec-proof-grid p {
	color: rgba(255, 255, 255, 0.76);
	font-size: 15px;
}

.yw-rec-teacher-intro {
	display: grid;
	grid-template-columns: minmax(260px, 0.42fr) minmax(0, 1fr);
	gap: clamp(24px, 4vw, 46px);
	align-items: center;
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 30px;
	background: #FFFFFF;
	padding: clamp(24px, 4.5vw, 46px);
	box-shadow: 0 22px 54px rgba(23, 32, 51, 0.08);
	overflow: hidden;
}

.yw-rec-teacher-intro__photo {
	position: relative;
	border-radius: 26px;
	background: linear-gradient(135deg, var(--rec-blush), var(--rec-blue-soft));
	padding: 14px;
	overflow: hidden;
}

.yw-rec-teacher-intro__photo::after {
	content: "";
	position: absolute;
	width: 180px;
	height: 180px;
	right: -58px;
	top: -58px;
	border: 1px solid rgba(233, 30, 99, 0.18);
	border-radius: 50%;
}

.yw-rec-teacher-intro__photo img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	border-radius: 20px;
	object-fit: cover;
	object-position: center top;
	box-shadow: 0 18px 38px rgba(23, 32, 51, 0.12);
}

.yw-rec-teacher-intro__copy span {
	display: inline-flex;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 7px 12px;
	color: var(--rec-coral-deep);
	font-size: 13px;
	font-weight: 900;
}

.yw-rec-teacher-intro__copy h2 {
	margin: 18px 0 0;
	color: var(--rec-ink);
	font-family: "Montserrat", "PingFang SC", "Noto Sans SC", sans-serif;
	font-size: var(--rec-font-section-compact);
	font-weight: 900;
	line-height: 1.22;
	letter-spacing: 0;
}

.yw-rec-teacher-intro__copy p {
	margin: 16px 0 0;
	color: var(--rec-muted);
	font-size: var(--rec-font-body-lg);
	line-height: 1.78;
}

.yw-rec-teacher-intro__copy ul {
	display: grid;
	gap: 10px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.yw-rec-teacher-intro__copy li {
	position: relative;
	border-radius: 16px;
	background: #FAFAFA;
	padding: 12px 14px 12px 36px;
	color: #3F4652;
	line-height: 1.65;
}

.yw-rec-teacher-intro__copy li::before {
	content: "";
	position: absolute;
	left: 16px;
	top: 22px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--rec-coral-hot);
}

.yw-rec-fit-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
}

.yw-rec-fit-card {
	min-height: 260px;
	padding: 26px;
}

.yw-rec-fit-card span {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-label);
	font-weight: 900;
}

.yw-rec-fit-card:nth-child(2) span {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-fit-card:nth-child(3) span {
	background: var(--rec-gold-soft);
	color: #7C5718;
}

.yw-rec-fit-card:nth-child(4) span {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-fit-card strong {
	display: block;
	margin: -2px 0 12px;
	color: var(--rec-coral-deep);
	font-size: 15px;
	line-height: 1.45;
}

.yw-rec-signup {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 0.42fr);
	gap: 26px;
	align-items: stretch;
}

.yw-rec-signup__main,
.yw-rec-consult {
	min-width: 0;
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 28px;
	background: #FFFFFF;
	padding: clamp(28px, 4vw, 44px);
	box-shadow: var(--rec-shadow-card);
}

.yw-rec-price-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin-top: 28px;
}

.yw-rec-price-grid article {
	padding: 22px;
}

.yw-rec-price-grid span {
	display: block;
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	font-weight: 800;
}

.yw-rec-price-grid strong {
	display: block;
	margin-top: 8px;
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title-xl);
	line-height: 1.1;
}

.yw-rec-price-grid em {
	display: block;
	margin: 8px 0 12px;
	color: var(--rec-coral-deep);
	font-style: normal;
	font-weight: 900;
}

.yw-rec-price-grid article:nth-child(2) {
	border-color: rgba(233, 30, 99, 0.24);
	background: var(--rec-blush);
}

.yw-rec-price-grid article:nth-child(3) {
	border-color: rgba(45, 156, 137, 0.20);
	background: var(--rec-green-soft);
}

.yw-rec-price-relation {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
	gap: 12px;
	align-items: stretch;
	margin-top: 28px;
}

.yw-rec-price-relation article,
.yw-rec-price-scenarios article {
	border: 1px solid var(--rec-line);
	border-radius: 20px;
	background: #FFFFFF;
	padding: 20px;
	box-shadow: 0 14px 30px rgba(23, 32, 51, 0.045);
}

.yw-rec-price-relation article:nth-of-type(2) {
	background: var(--rec-blush);
}

.yw-rec-price-relation article:nth-of-type(3) {
	background: var(--rec-green-soft);
}

.yw-rec-price-relation b {
	display: inline-flex;
	width: 34px;
	height: 34px;
	align-self: center;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-ink);
	color: #FFFFFF;
	font-size: 18px;
	line-height: 1;
}

.yw-rec-price-relation span,
.yw-rec-price-scenarios em {
	display: inline-flex;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.76);
	padding: 5px 10px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-small);
	font-style: normal;
	font-weight: 900;
	line-height: 1;
}

.yw-rec-price-relation strong,
.yw-rec-price-scenarios strong {
	display: block;
	margin-top: 12px;
	color: var(--rec-ink);
	font-size: 20px;
	line-height: 1.35;
}

.yw-rec-price-relation p,
.yw-rec-price-scenarios p {
	margin: 10px 0 0;
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	line-height: 1.68;
}

.yw-rec-price-scenarios {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin-top: 16px;
}

.yw-rec-price-scenarios article:nth-child(2) em {
	color: #245080;
}

.yw-rec-price-scenarios article:nth-child(3) em {
	color: #236B5E;
}

.yw-rec-price-image {
	max-width: 100%;
	max-height: 620px;
	margin-top: 28px;
	border: 1px solid var(--rec-line);
	border-radius: 24px;
	background: #FFFFFF;
	padding: 12px;
	overflow: hidden;
	box-shadow: 0 16px 34px rgba(23, 32, 51, 0.06);
}

.yw-rec-price-image img {
	height: 596px;
	object-fit: cover;
	object-position: top;
}

.yw-rec-price-table-wrap {
	max-width: 100%;
	min-width: 0;
	margin-top: 24px;
	border: 1px solid var(--rec-line);
	border-radius: 22px;
	background: #FFFFFF;
	padding: 20px;
	overflow-x: auto;
	box-shadow: 0 14px 30px rgba(23, 32, 51, 0.05);
}

.yw-rec-price-table-wrap h3 {
	margin-bottom: 14px;
	font-size: var(--rec-font-card-title);
}

.yw-rec-price-table {
	width: 100%;
	min-width: 640px;
	border-collapse: collapse;
	color: var(--rec-text);
	font-size: 15px;
	line-height: 1.45;
}

.yw-rec-price-table th,
.yw-rec-price-table td {
	border: 1px solid #E6E6E6;
	padding: 12px 14px;
	text-align: left;
	vertical-align: middle;
}

.yw-rec-price-table th {
	background: #4A4A4A;
	color: #FFFFFF;
	font-weight: 900;
}

.yw-rec-price-table tr:nth-child(even) td {
	background: #FAFAFA;
}

.yw-rec-price-table td strong {
	color: var(--rec-coral-deep);
	font-weight: 950;
}

.yw-rec-price-table td span {
	display: inline-flex;
	margin-left: 8px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 3px 8px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-small);
	font-weight: 900;
	white-space: nowrap;
}

.yw-rec-consult {
	text-align: center;
}

.yw-rec-consult img {
	display: block;
	width: min(220px, 100%);
	margin: 0 auto 22px;
	border-radius: 20px;
	box-shadow: 0 16px 34px rgba(23, 32, 51, 0.10);
}

.yw-rec-consult h3 {
	margin: 0;
	color: var(--rec-ink);
	font-size: 26px;
	line-height: 1.25;
}

.yw-rec-consult p {
	margin: 14px 0 0;
	color: var(--rec-muted);
	line-height: 1.72;
}

.yw-rec-consult strong {
	color: var(--rec-coral-deep);
}

.yw-rec-consult__hint {
	margin-top: 18px;
	border-radius: 16px;
	background: var(--rec-cream);
	padding: 14px;
	color: #66512A;
	font-size: var(--rec-font-label);
	font-weight: 800;
	line-height: 1.6;
}

.yw-rec-faq {
	display: grid;
	gap: 12px;
	max-width: 900px;
	margin: 0 auto;
}

.yw-rec-faq details {
	padding: 0 24px;
	box-shadow: none;
}

.yw-rec-faq summary {
	cursor: pointer;
	padding: 22px 0;
	color: var(--rec-ink);
	font-size: 20px;
	font-weight: 900;
	line-height: 1.35;
}

.yw-rec-faq p {
	margin: 0;
	padding: 0 0 22px;
	color: var(--rec-muted);
	line-height: 1.78;
}

.yw-rec-hero__grid {
	align-items: stretch;
}

.yw-rec-hero__copy {
	align-self: center;
}

.yw-rec-portrait {
	align-self: stretch;
	min-height: clamp(610px, 54vw, 680px);
}

.yw-rec-portrait::after {
	content: "";
	position: absolute;
	z-index: 1;
	left: 50%;
	bottom: 0;
	width: min(420px, 88%);
	height: 82px;
	border-radius: 999px 999px 28px 28px;
	background: linear-gradient(135deg, rgba(255, 244, 248, 0.92), rgba(238, 245, 255, 0.96));
	box-shadow: 0 20px 48px rgba(23, 32, 51, 0.10);
	transform: translateX(-50%);
}

.yw-rec-portrait img {
	align-self: flex-end;
	margin-bottom: -1px;
}

.yw-rec-pain-card span,
.yw-rec-fit-card span {
	width: 54px;
	height: 54px;
}

.yw-rec-pain-card span svg,
.yw-rec-fit-card span svg {
	display: block;
	width: 32px;
	height: 32px;
}

.yw-rec-relation-flow {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr) 34px minmax(0, 1fr);
	gap: 12px;
	align-items: stretch;
}

.yw-rec-relation-flow article {
	position: relative;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.86);
	padding: 18px;
	box-shadow: 0 14px 30px rgba(23, 32, 51, 0.045);
}

.yw-rec-relation-flow article span {
	display: inline-flex;
	margin-bottom: 12px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 6px 10px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-relation-flow article:nth-of-type(2) span {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-relation-flow article:nth-of-type(3) span {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-relation-flow strong {
	display: block;
	color: var(--rec-ink);
	font-size: 21px;
	line-height: 1.25;
}

.yw-rec-relation-flow p {
	margin-top: 8px;
}

.yw-rec-relation-flow i {
	position: relative;
	align-self: center;
	height: 2px;
	border-radius: 999px;
	background: linear-gradient(90deg, rgba(233, 30, 99, 0.26), rgba(45, 156, 137, 0.26));
}

.yw-rec-relation-flow i::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	width: 12px;
	height: 12px;
	border-top: 2px solid rgba(45, 156, 137, 0.44);
	border-right: 2px solid rgba(45, 156, 137, 0.44);
	transform: translateY(-50%) rotate(45deg);
}

.yw-rec-delivery-steps {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.yw-rec-delivery-steps a {
	min-height: 132px;
	padding: 18px 20px;
}

.yw-rec-delivery-steps a:nth-child(3)::after {
	display: none;
}

.yw-rec-note-rules {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin-top: 18px;
}

.yw-rec-note-rules span {
	display: grid;
	gap: 6px;
	border: 1px solid rgba(23, 32, 51, 0.07);
	border-radius: 16px;
	background: #FAFAFA;
	padding: 14px;
	color: var(--rec-muted);
	font-size: var(--rec-font-label);
	line-height: 1.5;
}

.yw-rec-note-rules strong {
	color: var(--rec-ink);
	font-size: 15px;
	line-height: 1.25;
}

.yw-rec-lesson-preview {
	align-content: start;
}

.yw-rec-lesson-frame {
	position: relative;
	aspect-ratio: 16 / 9;
	margin-top: 8px;
	overflow: hidden;
	border-radius: 18px;
	background: #111827;
	box-shadow: 0 18px 40px rgba(17, 24, 39, 0.16);
}

.yw-rec-lesson-frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.yw-rec-works-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.yw-rec-works-gallery a {
	position: relative;
	display: grid;
	min-height: 154px;
	align-content: end;
	gap: 8px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 20px;
	background:
		linear-gradient(180deg, rgba(23, 32, 51, 0.02), rgba(23, 32, 51, 0.70)),
		linear-gradient(135deg, #FFF4F8 0%, #EEF5FF 100%);
	padding: 18px;
	overflow: hidden;
	box-shadow: 0 16px 34px rgba(23, 32, 51, 0.08);
}

.yw-rec-works-gallery a::before {
	content: "";
	position: absolute;
	right: -24px;
	top: -24px;
	width: 92px;
	height: 92px;
	border: 1px solid rgba(233, 30, 99, 0.20);
	border-radius: 50%;
}

.yw-rec-works-gallery strong,
.yw-rec-works-gallery span {
	position: relative;
	z-index: 1;
	color: #FFFFFF;
}

.yw-rec-works-gallery strong {
	font-size: 20px;
	line-height: 1.2;
}

.yw-rec-works-gallery span {
	font-size: var(--rec-font-label);
	line-height: 1.45;
	opacity: 0.88;
}

.yw-rec-mindmap-link {
	display: grid;
	grid-template-columns: auto minmax(0, 0.7fr) minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	margin-top: 22px;
	border: 1px solid rgba(233, 30, 99, 0.18);
	border-radius: 24px;
	background: linear-gradient(135deg, #FFFFFF 0%, #FFF4F8 50%, #EEF5FF 100%);
	padding: 22px 24px;
	box-shadow: var(--rec-shadow-card);
}

.yw-rec-mindmap-link span {
	border-radius: 999px;
	background: var(--rec-coral-hot);
	padding: 8px 12px;
	color: #FFFFFF;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-mindmap-link strong {
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title);
	line-height: 1.25;
}

.yw-rec-mindmap-link em {
	color: var(--rec-muted);
	font-size: var(--rec-font-body);
	font-style: normal;
	line-height: 1.55;
}

.yw-rec-proof-band--teacher {
	margin-top: 26px;
}

.yw-rec-price-choice {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin-top: 28px;
}

.yw-rec-price-choice article {
	position: relative;
	border: 1px solid var(--rec-line);
	border-radius: 22px;
	background: #FFFFFF;
	padding: 22px;
	box-shadow: 0 16px 34px rgba(23, 32, 51, 0.055);
}

.yw-rec-price-choice article.is-recommended {
	border-color: rgba(245, 0, 87, 0.28);
	background: linear-gradient(180deg, #FFFFFF 0%, #FFF4F8 100%);
	box-shadow: 0 24px 52px rgba(245, 0, 87, 0.12);
}

.yw-rec-price-choice span {
	display: inline-flex;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 6px 10px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-price-choice article:nth-child(2) span {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-price-choice article:nth-child(3) span {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-price-choice h3 {
	margin: 16px 0 8px;
	color: var(--rec-ink);
	font-size: var(--rec-font-card-title);
	line-height: 1.25;
}

.yw-rec-price-choice strong {
	display: block;
	color: var(--rec-coral-deep);
	font-size: 17px;
	line-height: 1.35;
}

.yw-rec-price-choice p {
	margin: 10px 0 0;
	color: var(--rec-muted);
	line-height: var(--rec-line-body);
}

.yw-rec-price-alert {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin-top: 18px;
	border: 1px solid rgba(199, 146, 62, 0.20);
	border-radius: 18px;
	background: #FFF9EA;
	padding: 16px 18px;
	color: #66512A;
	line-height: 1.65;
}

.yw-rec-price-alert strong {
	flex: 0 0 auto;
	color: #7C5718;
}

.yw-rec-price-details {
	margin-top: 18px;
	border: 1px solid var(--rec-line);
	border-radius: 20px;
	background: #FFFFFF;
	padding: 0 18px;
	box-shadow: 0 12px 26px rgba(23, 32, 51, 0.04);
}

.yw-rec-price-details > summary {
	cursor: pointer;
	padding: 18px 0;
	color: var(--rec-ink);
	font-weight: 900;
	list-style: none;
}

.yw-rec-price-details > summary::-webkit-details-marker {
	display: none;
}

.yw-rec-price-details > summary::after {
	content: " +";
	color: var(--rec-coral-deep);
}

.yw-rec-price-details[open] > summary::after {
	content: " -";
}

body.yw-reveal-ready .yw-recitation-v2 [data-yw-reveal] {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition: opacity 560ms cubic-bezier(0.22, 1, 0.36, 1), transform 560ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}

body.yw-reveal-ready .yw-recitation-v2 [data-yw-reveal].is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.yw-rec-mobile-cta {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.yw-recitation-v2 *,
	body.yw-reveal-ready .yw-recitation-v2 [data-yw-reveal] {
		transition: none !important;
	}
}

@media (max-width: 980px) {
	.yw-rec-hero__grid,
	.yw-rec-split-head,
		.yw-rec-video-layout,
			.yw-rec-relation,
			.yw-rec-delivery-shell,
			.yw-rec-proof-card,
			.yw-rec-proof-band,
			.yw-rec-teacher-intro,
			.yw-rec-signup {
				grid-template-columns: 1fr;
			}

	.yw-rec-portrait {
		min-height: 500px;
	}

	.yw-rec-pain-grid,
	.yw-rec-method-grid,
	.yw-rec-map-grid,
	.yw-rec-plan-grid,
	.yw-rec-logic-flow,
	.yw-rec-delivery-grid,
	.yw-rec-guide,
	.yw-rec-system-grid,
	.yw-rec-subject-grid,
		.yw-rec-proof-grid,
			.yw-rec-fit-grid,
			.yw-rec-relation__grid,
			.yw-rec-plan-gallery,
			.yw-rec-price-scenarios {
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}

			.yw-rec-delivery-steps {
				position: static;
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}

			.yw-rec-delivery-steps a::after {
				display: none;
			}

			.yw-rec-relation-flow,
			.yw-rec-price-choice {
				grid-template-columns: 1fr;
			}

			.yw-rec-relation-flow i {
				justify-self: center;
				width: 2px;
				height: 30px;
			}

			.yw-rec-relation-flow i::after {
				right: 50%;
				top: auto;
				bottom: 0;
				transform: translateX(50%) rotate(135deg);
			}

			.yw-rec-note-rules,
			.yw-rec-works-gallery {
				grid-template-columns: 1fr;
			}

			.yw-rec-mindmap-link {
				grid-template-columns: 1fr;
			}

		.yw-rec-price-grid {
			grid-template-columns: 1fr;
		}

		.yw-rec-price-relation {
			grid-template-columns: 1fr;
		}

		.yw-rec-price-relation b {
			justify-self: center;
			transform: rotate(90deg);
		}

		.yw-rec-logic-flow::before,
		.yw-rec-plan-grid::before {
		display: none;
	}
}

	@media (max-width: 640px) {
		.yw-recitation-v2 {
			--rec-font-hero: 31px;
			--rec-font-lead: 15.5px;
			--rec-font-section: 28px;
			--rec-font-section-compact: 28px;
			--rec-font-card-title-xl: 26px;
			--rec-font-number: 32px;
		}

		body:has(.yw-recitation-v2) header.elementor-location-header {
			display: none !important;
		}

	body:has(.yw-recitation-v2),
	.yw-recitation-v2 {
		max-width: 100vw;
		overflow-x: hidden;
	}

	.yw-rec-wrap {
		width: calc(100vw - 34px);
		max-width: 356px;
		margin-left: 17px;
		margin-right: auto;
	}

	.yw-rec-section {
		overflow: hidden;
	}

	.yw-rec-hero {
		min-height: auto;
		padding-top: 46px;
	}

	.yw-rec-hero::before {
		width: 340px;
		height: 340px;
		right: -130px;
		top: 168px;
	}

	.yw-rec-hero::after {
		width: 220px;
		height: 220px;
		right: 42px;
		bottom: 60px;
	}

		.yw-rec-hero h1 {
			max-width: 100%;
			font-size: var(--rec-font-hero);
			line-height: 1.16;
		word-break: break-all;
		overflow-wrap: anywhere;
	}

	.yw-rec-mobile-title-break,
	.yw-rec-mobile-lead-break {
		display: block;
	}

		.yw-rec-lead {
			max-width: 100%;
			font-size: var(--rec-font-lead);
		line-height: 1.65;
		word-break: break-all;
		overflow-wrap: anywhere;
		line-break: anywhere;
	}

	.yw-rec-actions {
		display: none;
	}

	.yw-rec-hero__chips {
		display: grid;
		grid-template-columns: 1fr;
		gap: 9px;
		margin-top: 24px;
		max-width: 100%;
	}

		.yw-rec-hero__chips span {
		justify-content: center;
		min-width: 0;
		min-height: 36px;
		padding: 7px 8px;
			font-size: var(--rec-font-meta);
		text-align: center;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	.yw-rec-nav {
		position: static;
	}

	.yw-rec-nav__inner {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 8px;
		overflow: visible;
		padding-top: 10px;
		padding-bottom: 10px;
	}

		.yw-rec-nav a {
		min-width: 0;
		padding: 7px 6px;
		text-align: center;
			font-size: var(--rec-font-small);
		white-space: normal;
		overflow-wrap: anywhere;
	}

	.yw-rec-elevator {
		left: auto;
		right: 14px;
		top: auto;
		bottom: 86px;
		z-index: 45;
	}

	.yw-rec-elevator__panel {
		position: fixed;
		left: 14px;
		right: 14px;
		bottom: 86px;
		width: auto;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		border-radius: 22px;
		padding: 14px;
	}

	.yw-rec-elevator__title {
		grid-column: 1 / -1;
	}

		.yw-rec-elevator__panel a {
		min-height: 40px;
		border: 1px solid var(--rec-line);
		border-radius: 14px;
		padding: 9px 10px;
		justify-content: center;
		text-align: center;
			font-size: var(--rec-font-meta);
	}

	.yw-rec-elevator__panel a::before {
		display: none;
	}

		.yw-rec-head h2,
		.yw-rec-split-head h2,
		.yw-rec-video-copy h2,
		.yw-rec-proof-band h2,
		.yw-rec-signup h2 {
			font-size: var(--rec-font-section);
		word-break: break-all;
		overflow-wrap: anywhere;
	}

		.yw-rec-portrait {
			min-height: 430px;
			margin-top: 12px;
			padding-bottom: 78px;
		}

		.yw-rec-portrait img {
			width: min(292px, 78vw);
			margin-bottom: 0;
		}

		.yw-rec-portrait::after {
			bottom: 70px;
			width: min(320px, 84vw);
			height: 58px;
		}

	.yw-rec-teacher-card,
	.yw-rec-student-card {
		display: none;
	}

	.yw-rec-section {
		padding: 58px 0;
	}

	.yw-rec-head,
	.yw-rec-split-head {
		margin-bottom: 26px;
	}

	.yw-rec-head {
		text-align: left;
	}

		.yw-rec-pain-grid,
		.yw-rec-method-grid,
		.yw-rec-map-grid,
		.yw-rec-plan-grid,
		.yw-rec-logic-flow,
		.yw-rec-delivery-grid,
		.yw-rec-guide,
		.yw-rec-system-grid,
		.yw-rec-subject-grid,
		.yw-rec-proof-grid,
		.yw-rec-fit-grid,
			.yw-rec-relation__grid,
			.yw-rec-delivery-steps,
			.yw-rec-plan-gallery,
			.yw-rec-price-scenarios,
			.yw-rec-price-grid {
				grid-template-columns: 1fr;
			}

		.yw-rec-pain-card,
		.yw-rec-method-card,
		.yw-rec-map-card,
		.yw-rec-logic-step,
		.yw-rec-delivery-card,
		.yw-rec-relation,
		.yw-rec-proof-card,
		.yw-rec-system-card,
			.yw-rec-subject,
			.yw-rec-fit-card,
			.yw-rec-price-relation article,
			.yw-rec-price-scenarios article,
			.yw-rec-price-grid article {
				min-height: auto;
				padding: 22px;
			}

				.yw-rec-topic-panel > summary {
					display: grid;
					gap: 12px;
					padding: 20px;
				}

				.yw-rec-delivery-steps {
					gap: 18px;
				}

				.yw-rec-delivery-steps a::after {
					display: block;
					left: calc(50% - 10px);
					right: auto;
					top: auto;
					bottom: -18px;
					transform: rotate(135deg);
				}

				.yw-rec-delivery-steps a:nth-child(3)::after {
					display: block;
				}

				.yw-rec-delivery-steps a.is-active::after,
				.yw-rec-delivery-steps a:hover::after,
				.yw-rec-delivery-steps a:focus-visible::after {
					transform: translateY(2px) rotate(135deg);
				}

			.yw-rec-topic-panel > summary b {
				justify-self: start;
			}

			.yw-rec-topic-groups {
				padding: 0 14px 18px;
			}

			.yw-rec-topic-group > summary {
				align-items: flex-start;
			}

			.yw-rec-topic-group ol {
				max-height: 460px;
			}

		.yw-rec-note-previews {
			min-height: 220px;
			padding: 8px;
		}

		.yw-rec-plan-gallery img {
			height: 300px;
		}

		.yw-rec-price-image {
			max-height: 460px;
			padding: 8px;
		}

		.yw-rec-price-image img {
			height: 442px;
		}

		.yw-rec-price-table-wrap {
			padding: 14px;
		}

	.yw-rec-note {
		display: block;
		padding: 18px;
	}

	.yw-rec-logic-summary {
		display: block;
		padding: 18px;
	}

	.yw-rec-note strong {
		display: block;
		margin-bottom: 8px;
	}

	.yw-rec-logic-summary strong {
		display: block;
		margin-bottom: 8px;
	}

	.yw-rec-map-card::before {
		left: 40px;
	}

	.yw-rec-map-card ul {
		padding-left: 30px;
	}

	.yw-rec-video-copy {
		padding: 24px;
	}

	.yw-rec-video-frame {
		border-radius: 20px;
	}

	.yw-rec-guide article {
		min-height: 210px;
	}

	.yw-rec-proof-band {
		padding: 28px 22px;
	}

	.yw-rec-proof-grid article {
		padding: 20px;
	}

	.yw-rec-signup__main,
	.yw-rec-consult {
		padding: 24px;
		border-radius: 22px;
	}

		.yw-rec-faq summary {
			font-size: 18px;
		}

	.yw-rec-mobile-cta {
		position: fixed;
		left: 14px;
		right: auto;
		width: calc(100vw - 28px);
		max-width: 356px;
		bottom: 14px;
		z-index: 40;
		display: grid;
		grid-template-columns: 0.78fr 1fr 1fr;
		gap: 10px;
		border: 1px solid rgba(233, 30, 99, 0.16);
		border-radius: 20px;
		background: rgba(255, 255, 255, 0.96);
		padding: 10px;
		box-shadow: 0 18px 42px rgba(23, 32, 51, 0.18);
		backdrop-filter: blur(14px);
	}

		.yw-rec-mobile-menu,
		.yw-rec-mobile-cta .yw-rec-btn {
		min-width: 0;
		min-height: 46px;
		padding: 12px 14px;
			font-size: var(--rec-font-label);
		}

	.yw-rec-mobile-menu {
		box-shadow: none;
	}
}

/* 2026-05-29 refinement: EleCourse-style visual crop and airier service modules. */
.yw-rec-hero {
	min-height: clamp(620px, 78vh, 700px);
	padding: clamp(46px, 6vw, 76px) 0 clamp(38px, 5vw, 60px);
}

.yw-rec-hero__grid {
	align-items: center;
	min-height: 560px;
}

.yw-rec-portrait {
	height: clamp(500px, 44vw, 560px);
	min-height: 0;
	align-self: center;
	padding: 0;
}

.yw-rec-portrait__rings {
	display: none;
}

.yw-rec-portrait::before {
	content: "";
	position: absolute;
	z-index: 0;
	left: 0;
	right: 18px;
	bottom: 46px;
	height: min(390px, 78%);
	border: 1px solid rgba(23, 32, 51, 0.07);
	border-radius: 28px;
	background:
		radial-gradient(circle at 32px 22px, #FFFFFF 0 5px, transparent 6px),
		radial-gradient(circle at 54px 22px, #FFFFFF 0 5px, transparent 6px),
		radial-gradient(circle at 76px 22px, #FFFFFF 0 5px, transparent 6px),
		linear-gradient(180deg, rgba(217, 216, 255, 0.94) 0 44px, transparent 44px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.95) 0 23%, rgba(255, 248, 225, 0.92) 23% 100%);
	box-shadow: 0 26px 60px rgba(23, 32, 51, 0.10);
}

.yw-rec-portrait::after {
	content: "";
	position: absolute;
	z-index: 4;
	left: 0;
	right: 18px;
	bottom: 46px;
	width: auto;
	height: 118px;
	border-radius: 0 0 28px 28px;
	background:
		linear-gradient(90deg, rgba(149, 166, 178, 0.46) 18%, transparent 18% 28%, rgba(149, 166, 178, 0.30) 28% 70%, transparent 70%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.94), #FFFFFF);
	box-shadow: inset 0 1px 0 rgba(23, 32, 51, 0.04);
	transform: none;
}

.yw-rec-portrait img {
	position: absolute;
	z-index: 3;
	left: 50%;
	bottom: 36px;
	width: min(360px, 76%);
	max-height: 560px;
	margin: 0;
	object-fit: contain;
	transform: translateX(-43%);
	filter: drop-shadow(0 28px 34px rgba(23, 32, 51, 0.18));
}

.yw-rec-student-card {
	z-index: 5;
	left: 50%;
	bottom: 58px;
	width: min(262px, 68%);
	transform: translateX(-42%);
}

.yw-rec-relation {
	grid-template-columns: minmax(280px, 0.92fr) minmax(0, 1fr);
	grid-template-areas:
		"visual copy"
		"flow flow";
	gap: clamp(24px, 4vw, 44px);
	align-items: center;
	padding: clamp(30px, 5vw, 52px);
	background:
		radial-gradient(circle at 8% 88%, rgba(255, 216, 140, 0.28), transparent 26%),
		linear-gradient(135deg, #FFFFFF 0%, #F8FCFF 54%, #FFFDF6 100%);
}

.yw-rec-system-visual {
	position: relative;
	grid-area: visual;
	min-height: 360px;
}

.yw-rec-system-browser {
	position: absolute;
	inset: 20px 0 26px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 28px;
	background: #FFFFFF;
	box-shadow: 0 26px 58px rgba(23, 32, 51, 0.10);
	overflow: hidden;
}

.yw-rec-system-browser__top {
	display: flex;
	gap: 9px;
	align-items: center;
	height: 48px;
	padding: 0 22px;
	background: rgba(217, 216, 255, 0.72);
}

.yw-rec-system-browser__top i {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #FFFFFF;
}

.yw-rec-system-browser__body {
	position: relative;
	display: grid;
	gap: 16px;
	padding: 30px 30px 34px;
}

.yw-rec-system-browser__body span {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 62px;
	border-radius: 18px;
	padding: 16px 18px;
	color: var(--rec-ink);
	font-size: 19px;
	font-weight: 900;
	box-shadow: 0 14px 30px rgba(23, 32, 51, 0.06);
}

.yw-rec-system-browser__body span::after {
	content: "";
	width: 36px;
	height: 8px;
	border-radius: 999px;
	background: currentColor;
	opacity: 0.24;
}

.yw-rec-system-browser__body .is-note {
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
}

.yw-rec-system-browser__body .is-map {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-system-browser__body .is-lesson {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-system-browser__body b {
	display: block;
	width: var(--w, 72%);
	height: 9px;
	border-radius: 999px;
	background: rgba(149, 166, 178, 0.25);
}

.yw-rec-system-browser__body b:nth-of-type(2) {
	--w: 56%;
}

.yw-rec-system-browser__body b:nth-of-type(3) {
	--w: 82%;
}

.yw-rec-system-float {
	position: absolute;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	min-height: 54px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.92);
	padding: 0 18px;
	color: var(--rec-ink);
	font-weight: 900;
	box-shadow: 0 18px 36px rgba(23, 32, 51, 0.12);
	backdrop-filter: blur(10px);
}

.yw-rec-system-float--plan {
	right: -10px;
	top: 58px;
	color: #7C5718;
}

.yw-rec-system-float--qa {
	left: -8px;
	bottom: 24px;
	color: var(--rec-coral-deep);
}

.yw-rec-system-copy {
	grid-area: copy;
}

.yw-rec-relation-flow {
	grid-area: flow;
}

.yw-rec-proof-card--lesson {
	grid-template-columns: 1fr;
}

.yw-rec-proof-card--lesson > div:first-child {
	max-width: 780px;
}

.yw-rec-proof-card--lesson .yw-rec-lesson-preview {
	width: 100%;
	min-height: auto;
	padding: clamp(22px, 4vw, 34px);
}

.yw-rec-proof-card--lesson .yw-rec-lesson-frame {
	max-width: 900px;
	margin-top: 18px;
}

.yw-rec-proof-card--works {
	grid-template-columns: minmax(0, 0.62fr) minmax(500px, 1.38fr);
	background:
		linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.94) 42%, rgba(255, 255, 255, 0.72) 56%, transparent 100%),
		linear-gradient(135deg, #FFFFFF 0%, #F6FBFF 52%, #FFF6F9 100%);
}

.yw-rec-proof-card--works .yw-rec-works-gallery {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(92px, 1fr));
	gap: 14px;
	align-items: end;
	min-height: 310px;
}

.yw-rec-work-cover {
	position: relative;
	display: grid;
	align-content: end;
	min-height: 255px;
	border: 1px solid rgba(255, 255, 255, 0.62);
	border-radius: 22px;
	padding: 18px;
	overflow: hidden;
	box-shadow: 0 20px 42px rgba(23, 32, 51, 0.16);
	transform: rotate(var(--r, -3deg)) translateY(var(--y, 0));
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.yw-rec-work-cover:hover,
.yw-rec-work-cover:focus-visible {
	transform: rotate(0deg) translateY(-6px);
	box-shadow: 0 26px 54px rgba(23, 32, 51, 0.20);
	outline: 0;
}

.yw-rec-works-gallery .yw-rec-work-cover::before {
	content: "";
	position: absolute;
	inset: 0;
	left: 0;
	right: auto;
	top: 0;
	width: auto;
	height: auto;
	border: 0;
	border-radius: 0;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(23, 32, 51, 0.30)),
		radial-gradient(circle at 78% 18%, rgba(255, 255, 255, 0.50), transparent 22%);
}

.yw-rec-works-gallery .yw-rec-work-cover::after {
	content: "";
	position: absolute;
	left: 14px;
	top: 16px;
	bottom: 16px;
	width: 4px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.58);
}

.yw-rec-work-cover em,
.yw-rec-work-cover strong,
.yw-rec-work-cover span,
.yw-rec-work-cover b {
	position: relative;
	z-index: 1;
	color: #FFFFFF;
	text-shadow: 0 1px 10px rgba(23, 32, 51, 0.18);
}

.yw-rec-work-cover em {
	align-self: start;
	margin-bottom: auto;
	font-style: normal;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	opacity: 0.88;
}

.yw-rec-work-cover strong {
	margin-top: auto;
	font-size: 22px;
	line-height: 1.18;
}

.yw-rec-work-cover span {
	margin-top: 10px;
	font-size: var(--rec-font-meta);
	line-height: 1.45;
	opacity: 0.90;
}

.yw-rec-work-cover b {
	display: inline-flex;
	width: fit-content;
	margin-top: 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.18);
	padding: 6px 10px;
	font-size: var(--rec-font-small);
	line-height: 1;
}

.yw-rec-works-gallery .yw-rec-work-cover--gudai {
	--r: -5deg;
	--y: 8px;
	background: linear-gradient(145deg, #B64B58, #F0A36E);
}

.yw-rec-works-gallery .yw-rec-work-cover--modern {
	--r: 3deg;
	--y: -16px;
	background: linear-gradient(145deg, #2D9C89, #88C7B8);
}

.yw-rec-works-gallery .yw-rec-work-cover--latin {
	--r: -2deg;
	--y: 16px;
	background: linear-gradient(145deg, #7B69A8, #E0A7B9);
}

.yw-rec-works-gallery .yw-rec-work-cover--foreign {
	--r: 4deg;
	--y: -6px;
	background: linear-gradient(145deg, #2457A6, #7FB1E8);
}

@media (max-width: 980px) {
	.yw-rec-hero {
		min-height: auto;
	}

	.yw-rec-hero__grid {
		min-height: 0;
	}

	.yw-rec-portrait {
		height: 470px;
		min-height: 0;
	}

	.yw-rec-relation {
		grid-template-columns: 1fr;
		grid-template-areas:
			"visual"
			"copy"
			"flow";
	}

	.yw-rec-proof-card--works {
		grid-template-columns: 1fr;
	}

	.yw-rec-system-visual {
		min-height: 330px;
	}

	.yw-rec-proof-card--works .yw-rec-works-gallery {
		grid-template-columns: repeat(4, minmax(118px, 1fr));
		overflow-x: auto;
		padding: 8px 4px 16px;
	}

	.yw-rec-work-cover {
		min-height: 230px;
	}
}

@media (max-width: 640px) {
	.yw-rec-hero {
		padding-top: 42px;
		padding-bottom: 36px;
	}

	.yw-rec-portrait {
		height: 390px;
		margin-top: 10px;
		padding-bottom: 0;
	}

	.yw-rec-portrait::before {
		left: 0;
		right: 0;
		bottom: 24px;
		height: 292px;
		border-radius: 24px;
	}

	.yw-rec-portrait::after {
		left: 0;
		right: 0;
		bottom: 24px;
		height: 84px;
		border-radius: 0 0 24px 24px;
	}

	.yw-rec-portrait img {
		bottom: 2px;
		width: min(265px, 76vw);
		transform: translateX(-42%);
	}

	.yw-rec-system-visual {
		min-height: 300px;
	}

	.yw-rec-system-browser {
		inset: 8px 0 24px;
		border-radius: 24px;
	}

	.yw-rec-system-browser__body {
		padding: 22px;
	}

	.yw-rec-system-browser__body span {
		min-height: 54px;
		font-size: 17px;
	}

	.yw-rec-system-float {
		min-height: 44px;
		padding: 0 14px;
		font-size: var(--rec-font-meta);
	}

	.yw-rec-proof-card--lesson .yw-rec-lesson-preview {
		padding: 18px;
	}

	.yw-rec-proof-card--works .yw-rec-works-gallery {
		grid-template-columns: repeat(4, 148px);
		margin-right: -22px;
	}

	.yw-rec-work-cover {
		min-height: 218px;
		border-radius: 20px;
	}
}

/* 2026-05-30 refinement: make the model dominant and keep the blue support shape low. */
.yw-rec-hero {
	min-height: clamp(600px, 74vh, 690px);
	padding-bottom: 0;
	overflow: hidden;
}

.yw-rec-hero::before {
	width: min(760px, 56vw);
	height: clamp(230px, 22vw, 320px);
	right: -3vw;
	top: auto;
	bottom: -82px;
	border-color: rgba(45, 156, 137, 0.16);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
}

.yw-rec-hero::after {
	width: min(650px, 48vw);
	height: clamp(190px, 18vw, 270px);
	right: 3vw;
	top: auto;
	bottom: -48px;
	border-color: rgba(233, 30, 99, 0.14);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
}

.yw-rec-hero__grid {
	grid-template-columns: minmax(0, 0.92fr) minmax(420px, 0.98fr);
	gap: clamp(28px, 4.6vw, 58px);
	min-height: clamp(560px, 68vh, 650px);
	align-items: center;
}

.yw-rec-portrait {
	height: clamp(540px, 48vw, 650px);
	align-self: end;
	overflow: visible;
}

.yw-rec-portrait::before {
	content: "";
	position: absolute;
	z-index: 0;
	left: 54%;
	right: auto;
	bottom: -120px;
	width: min(780px, 136%);
	height: clamp(260px, 24vw, 340px);
	border: 0;
	border-radius: 999px 999px 0 0;
	background: linear-gradient(135deg, rgba(36, 87, 166, 0.92), rgba(80, 136, 224, 0.82));
	box-shadow: none;
	transform: translateX(-50%);
}

.yw-rec-portrait::after {
	content: "";
	position: absolute;
	z-index: 1;
	left: 55%;
	right: auto;
	bottom: -70px;
	width: min(740px, 128%);
	height: clamp(230px, 22vw, 320px);
	border: 1px solid rgba(36, 87, 166, 0.18);
	border-radius: 999px 999px 0 0;
	background: transparent;
	box-shadow: none;
	transform: translateX(-50%);
}

.yw-rec-portrait__rings {
	display: block;
	position: absolute;
	z-index: 1;
	left: 55%;
	right: auto;
	top: auto;
	bottom: -34px;
	width: min(800px, 138%);
	height: clamp(260px, 24vw, 360px);
	border: 1px solid rgba(45, 156, 137, 0.20);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
	transform: translateX(-50%);
}

.yw-rec-portrait__rings::before {
	inset: 34px 52px 0;
	border-color: rgba(233, 30, 99, 0.16);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
}

.yw-rec-portrait__rings::after {
	inset: 78px 110px 0;
	border-color: rgba(199, 146, 62, 0.18);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
}

.yw-rec-portrait img {
	z-index: 3;
	left: auto;
	right: -18px;
	bottom: -116px;
	width: min(560px, 102%);
	transform: none;
}

.yw-rec-student-card {
	left: 18%;
	bottom: 124px;
	width: min(300px, 66%);
	transform: none;
	background: rgba(255, 255, 255, 0.72);
	border-color: rgba(255, 255, 255, 0.70);
	box-shadow: 0 22px 48px rgba(23, 32, 51, 0.12);
}

.yw-rec-logic-flow {
	gap: 22px;
	align-items: stretch;
}

.yw-rec-logic-flow::before {
	display: none;
}

.yw-rec-logic-step {
	min-height: 318px;
	overflow: hidden;
	border-color: rgba(23, 32, 51, 0.07);
	border-radius: 24px;
	background: #FBFAFF;
	padding: 34px 26px 78px;
	text-align: center;
	box-shadow: 0 18px 44px rgba(23, 32, 51, 0.07);
}

.yw-rec-logic-step::after {
	content: attr(data-step);
	position: absolute;
	right: 22px;
	bottom: -38px;
	color: rgba(36, 48, 70, 0.075);
	font-size: clamp(112px, 10vw, 152px);
	font-weight: 900;
	line-height: 1;
	pointer-events: none;
}

.yw-rec-logic-step > * {
	position: relative;
	z-index: 2;
}

.yw-rec-logic-step span {
	display: inline-flex;
	width: 56px;
	height: 56px;
	align-items: center;
	justify-content: center;
	margin: 0 auto 26px;
	border: 1px solid rgba(178, 132, 31, 0.22);
	border-radius: 16px;
	background: linear-gradient(180deg, #FFE66E 0%, #F6C83D 100%);
	color: #172033;
	box-shadow: 0 12px 24px rgba(199, 146, 62, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.58);
}

.yw-rec-logic-step:nth-child(2) span,
.yw-rec-logic-step:nth-child(3) span,
.yw-rec-logic-step:nth-child(4) span {
	border-color: rgba(178, 132, 31, 0.22);
	color: #172033;
}

.yw-rec-logic-step span svg {
	display: block;
	width: 31px;
	height: 31px;
}

.yw-rec-logic-step h3 {
	margin: 0 0 14px;
	font-size: clamp(24px, 2.2vw, 30px);
}

.yw-rec-logic-step strong {
	margin-bottom: 12px;
	color: #273247;
	font-size: 16px;
}

.yw-rec-logic-step p,
.yw-rec-delivery-card p {
	color: #505B6A;
}

@media (max-width: 980px) {
	.yw-rec-hero__grid {
		grid-template-columns: 1fr;
		min-height: auto;
	}

	.yw-rec-portrait {
		width: min(560px, 100%);
		height: clamp(460px, 62vw, 560px);
		margin: 8px auto 0;
	}

	.yw-rec-portrait img {
		right: 50%;
		width: min(430px, 82vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		left: 50%;
		width: min(300px, 76vw);
		transform: translateX(-50%);
	}
}

@media (max-width: 640px) {
	.yw-rec-hero {
		padding-bottom: 0;
	}

	.yw-rec-hero::before,
	.yw-rec-hero::after {
		display: none;
	}

	.yw-rec-hero__grid {
		grid-template-columns: 1fr;
	}

	.yw-rec-portrait {
		height: 390px;
		min-height: 0;
		margin-top: 8px;
		padding-bottom: 0;
	}

	.yw-rec-portrait::before {
		left: 50%;
		bottom: -78px;
		width: 430px;
		height: 190px;
	}

	.yw-rec-portrait::after {
		left: 50%;
		bottom: -44px;
		width: 390px;
		height: 164px;
	}

	.yw-rec-portrait__rings {
		left: 50%;
		bottom: -10px;
		width: 410px;
		height: 178px;
	}

	.yw-rec-portrait__rings::before {
		inset: 26px 42px 0;
	}

	.yw-rec-portrait__rings::after {
		inset: 58px 86px 0;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -72px;
		width: min(310px, 86vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		left: 50%;
		bottom: 72px;
		width: min(276px, 82vw);
		transform: translateX(-50%);
	}

	.yw-rec-logic-step {
		min-height: 286px;
		padding: 30px 24px 72px;
	}
}

/* 2026-05-30 final override: keep the model dominant after legacy responsive blocks. */
.yw-rec-hero {
	min-height: clamp(560px, 68vh, 650px);
	overflow: hidden;
}

.yw-rec-hero::before {
	width: min(760px, 56vw);
	height: clamp(188px, 15vw, 236px);
	right: -2vw;
	bottom: -86px;
	border-color: rgba(45, 156, 137, 0.13);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
	opacity: 0.42;
}

.yw-rec-hero::after {
	width: min(640px, 47vw);
	height: clamp(142px, 12vw, 196px);
	right: 4vw;
	bottom: -56px;
	border-color: rgba(233, 30, 99, 0.13);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
	opacity: 0.5;
}

.yw-rec-hero__grid {
	grid-template-columns: minmax(0, 0.82fr) minmax(500px, 1.18fr);
	gap: clamp(26px, 4vw, 50px);
	min-height: clamp(520px, 62vh, 610px);
}

.yw-rec-portrait {
	height: clamp(520px, 44vw, 610px);
	align-self: end;
}

.yw-rec-portrait::before {
	left: 55%;
	bottom: -104px;
	width: min(760px, 126%);
	height: clamp(170px, 14vw, 226px);
	border: 1px solid rgba(91, 123, 142, 0.14);
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
	background: linear-gradient(135deg, rgba(235, 244, 248, 0.92), rgba(252, 240, 235, 0.88));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
	transform: translateX(-50%);
}

.yw-rec-portrait::after {
	left: 55%;
	bottom: -66px;
	width: min(690px, 116%);
	height: clamp(132px, 11vw, 182px);
	border-color: rgba(233, 30, 99, 0.13);
	border-bottom: 0;
	background: transparent;
	transform: translateX(-50%);
}

.yw-rec-portrait__rings {
	display: none;
}

.yw-rec-portrait img {
	right: -54px;
	bottom: -96px;
	width: min(650px, 126%);
	max-height: none;
	transform: none;
}

.yw-rec-student-card {
	left: 7%;
	bottom: 128px;
	width: min(274px, 54%);
	transform: none;
}

@media (max-width: 980px) {
	.yw-rec-hero__grid {
		grid-template-columns: 1fr;
		min-height: auto;
	}

	.yw-rec-portrait {
		width: min(560px, 100%);
		height: clamp(470px, 65vw, 570px);
		margin: 8px auto 0;
		overflow: hidden;
	}

	.yw-rec-portrait::before {
		left: 50%;
		bottom: -88px;
		width: 560px;
		height: 190px;
	}

	.yw-rec-portrait::after {
		left: 50%;
		bottom: -56px;
		width: 500px;
		height: 152px;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -86px;
		width: min(500px, 90vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		left: 50%;
		bottom: 92px;
		width: min(286px, 76vw);
		transform: translateX(-50%);
	}
}

@media (max-width: 640px) {
	.yw-rec-hero {
		min-height: auto;
	}

	.yw-rec-hero::before,
	.yw-rec-hero::after {
		display: none;
	}

	.yw-rec-portrait {
		height: 410px;
		min-height: 0;
	}

	.yw-rec-portrait::before {
		left: 50%;
		bottom: -70px;
		width: 420px;
		height: 158px;
	}

	.yw-rec-portrait::after {
		display: block;
		left: 50%;
		bottom: -44px;
		width: 380px;
		height: 126px;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -76px;
		width: min(345px, 92vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		bottom: 76px;
		width: min(268px, 82vw);
	}
}

/* 2026-05-30 reset: rebuild hero decoration from a clean base and keep the face complete. */
.yw-rec-hero::before,
.yw-rec-hero::after,
.yw-rec-portrait__rings {
	display: none !important;
}

.yw-rec-hero__grid {
	grid-template-columns: minmax(0, 0.86fr) minmax(480px, 1.14fr);
	min-height: clamp(540px, 64vh, 630px);
}

.yw-rec-portrait {
	height: clamp(520px, 44vw, 620px);
	overflow: visible;
}

.yw-rec-portrait::before {
	content: "";
	position: absolute;
	z-index: 0;
	left: 56%;
	right: auto;
	bottom: -54px;
	width: min(640px, 112%);
	height: clamp(118px, 10vw, 160px);
	border: 1px solid rgba(45, 156, 137, 0.12);
	border-radius: 999px 999px 0 0;
	background: linear-gradient(135deg, rgba(238, 247, 244, 0.92), rgba(255, 246, 240, 0.92));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
	transform: translateX(-50%);
}

.yw-rec-portrait::after {
	content: "";
	position: absolute;
	z-index: 1;
	left: 23%;
	right: auto;
	bottom: 96px;
	width: 116px;
	height: 116px;
	border: 0;
	border-radius: 28px;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.36)),
		linear-gradient(135deg, rgba(233, 30, 99, 0.12), rgba(45, 156, 137, 0.08));
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.10);
	transform: rotate(-8deg);
}

.yw-rec-portrait img {
	right: clamp(8px, 2vw, 30px);
	bottom: -30px;
	width: auto;
	height: min(638px, 46vw);
	max-width: none;
	max-height: none;
	object-fit: contain;
	transform: none;
}

.yw-rec-student-card {
	left: 10%;
	bottom: 128px;
	width: min(286px, 56%);
}

.yw-rec-logic-flow {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px;
	align-items: stretch;
}

.yw-rec-logic-flow::before {
	display: none;
}

.yw-rec-logic-flow .yw-rec-logic-step {
	display: block;
	min-height: 318px;
	padding: 34px 26px 78px;
	text-align: center;
}

.yw-rec-logic-flow .yw-rec-logic-step span {
	margin: 0 auto 26px;
}

@media (max-width: 980px) {
	.yw-rec-hero__grid {
		grid-template-columns: 1fr;
	}

	.yw-rec-portrait {
		width: min(560px, 100%);
		height: clamp(450px, 62vw, 560px);
		margin: 8px auto 0;
		overflow: hidden;
	}

	.yw-rec-portrait::before {
		left: 50%;
		bottom: -46px;
		width: 510px;
		height: 132px;
	}

	.yw-rec-portrait::after {
		left: 14%;
		bottom: 80px;
		width: 94px;
		height: 94px;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -34px;
		height: min(520px, 84vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		left: 50%;
		bottom: 86px;
		width: min(286px, 76vw);
		transform: translateX(-50%);
	}

	.yw-rec-logic-flow {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.yw-rec-portrait {
		height: 410px;
		overflow: hidden;
	}

	.yw-rec-portrait::before {
		bottom: -36px;
		width: 410px;
		height: 110px;
	}

	.yw-rec-portrait::after {
		display: none;
	}

	.yw-rec-portrait img {
		right: 50%;
		bottom: -30px;
		height: min(390px, 92vw);
		transform: translateX(50%);
	}

	.yw-rec-student-card {
		bottom: 70px;
		width: min(268px, 82vw);
	}

	.yw-rec-logic-flow {
		grid-template-columns: 1fr;
	}

	.yw-rec-logic-flow .yw-rec-logic-step {
		min-height: 286px;
	}
}

/* 2026-05-30 delivery/pricing redesign: keep earlier sections stable. */
.yw-rec-delivery-shell {
	gap: clamp(26px, 4vw, 42px);
}

.yw-rec-delivery-compass {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-template-rows: auto auto auto;
	gap: 18px;
	min-height: 470px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 34px;
	background:
		radial-gradient(circle at 50% 50%, rgba(233, 30, 99, 0.09), transparent 25%),
		radial-gradient(circle at 15% 20%, rgba(45, 156, 137, 0.10), transparent 26%),
		linear-gradient(135deg, #FFFFFF 0%, #FFFCF7 54%, #F6FBFF 100%);
	padding: clamp(24px, 4vw, 44px);
	box-shadow: 0 24px 62px rgba(23, 32, 51, 0.075);
	overflow: hidden;
}

.yw-rec-delivery-compass::before {
	content: "";
	position: absolute;
	inset: 82px 14%;
	border: 1px dashed rgba(80, 91, 106, 0.18);
	border-radius: 999px;
	pointer-events: none;
}

.yw-rec-delivery-compass__center {
	position: relative;
	z-index: 2;
	grid-column: 2;
	grid-row: 2;
	align-self: center;
	justify-self: center;
	display: grid;
	width: min(270px, 100%);
	min-height: 230px;
	align-content: center;
	justify-items: center;
	border: 1px solid rgba(233, 30, 99, 0.18);
	border-radius: 34px;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 244, 248, 0.92)),
		radial-gradient(circle at 50% 0%, rgba(245, 0, 87, 0.16), transparent 40%);
	padding: 30px;
	text-align: center;
	box-shadow: 0 28px 68px rgba(233, 30, 99, 0.13);
}

.yw-rec-delivery-compass__center span {
	border-radius: 999px;
	background: var(--rec-coral-hot);
	padding: 7px 12px;
	color: #FFFFFF;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-delivery-compass__center strong {
	display: block;
	margin-top: 16px;
	color: var(--rec-ink);
	font-size: clamp(28px, 2.8vw, 40px);
	line-height: 1.15;
}

.yw-rec-delivery-compass__center em {
	display: block;
	margin-top: 12px;
	color: #4B5565;
	font-style: normal;
	font-weight: 800;
	line-height: 1.55;
}

.yw-rec-delivery-compass__item {
	position: relative;
	z-index: 2;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.90);
	padding: 22px;
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.065);
	backdrop-filter: blur(10px);
}

.yw-rec-delivery-compass__item--1 {
	grid-column: 2;
	grid-row: 1;
}

.yw-rec-delivery-compass__item--2 {
	grid-column: 3;
	grid-row: 2;
}

.yw-rec-delivery-compass__item--3 {
	grid-column: 2;
	grid-row: 3;
}

.yw-rec-delivery-compass__item--4 {
	grid-column: 1;
	grid-row: 2;
}

.yw-rec-delivery-compass__item b {
	display: inline-flex;
	width: 34px;
	height: 34px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
}

.yw-rec-delivery-compass__item strong {
	display: block;
	margin-top: 14px;
	color: var(--rec-ink);
	font-size: 21px;
	line-height: 1.28;
}

.yw-rec-delivery-compass__item p {
	margin: 9px 0 0;
	color: #4B5565;
	line-height: 1.65;
}

.yw-rec-delivery-compass__item--2 b,
.yw-rec-delivery-compass__item--2 strong {
	color: #236B5E;
}

.yw-rec-delivery-compass__item--2 b {
	background: var(--rec-green-soft);
}

.yw-rec-delivery-compass__item--3 b,
.yw-rec-delivery-compass__item--3 strong {
	color: #7C5718;
}

.yw-rec-delivery-compass__item--3 b {
	background: var(--rec-gold-soft);
}

.yw-rec-delivery-compass__item--4 b,
.yw-rec-delivery-compass__item--4 strong {
	color: #245080;
}

.yw-rec-delivery-compass__item--4 b {
	background: var(--rec-blue-soft);
}

.yw-rec-mindmap-poster {
	position: relative;
	display: grid;
	grid-template-columns: minmax(220px, 0.48fr) minmax(0, 1fr) auto;
	gap: clamp(20px, 3vw, 34px);
	align-items: center;
	margin-top: 28px;
	border: 1px solid rgba(45, 156, 137, 0.20);
	border-radius: 32px;
	background:
		radial-gradient(circle at 16% 22%, rgba(45, 156, 137, 0.14), transparent 26%),
		linear-gradient(135deg, #F4FCF8 0%, #FFFFFF 48%, #FFF4F8 100%);
	padding: clamp(22px, 4vw, 36px);
	text-decoration: none !important;
	box-shadow: 0 26px 62px rgba(23, 32, 51, 0.08);
	overflow: hidden;
}

.yw-rec-mindmap-poster__art {
	position: relative;
	min-height: 210px;
	border-radius: 28px;
	background: linear-gradient(145deg, #FFFFFF 0%, #EAF8F3 100%);
	box-shadow: inset 0 0 0 1px rgba(45, 156, 137, 0.12), 0 22px 46px rgba(45, 156, 137, 0.12);
	overflow: hidden;
}

.yw-rec-mindmap-poster__art::before {
	content: "";
	position: absolute;
	inset: 34px;
	border: 2px dashed rgba(45, 156, 137, 0.24);
	border-radius: 999px;
}

.yw-rec-mindmap-poster__art i {
	position: absolute;
	display: block;
	width: 54px;
	height: 54px;
	border-radius: 18px;
	background: #FFFFFF;
	box-shadow: 0 14px 28px rgba(23, 32, 51, 0.10);
}

.yw-rec-mindmap-poster__art i:nth-child(1) {
	left: 30px;
	top: 44px;
	background: var(--rec-blush);
}

.yw-rec-mindmap-poster__art i:nth-child(2) {
	right: 28px;
	top: 68px;
	background: var(--rec-blue-soft);
}

.yw-rec-mindmap-poster__art i:nth-child(3) {
	left: 50%;
	bottom: 30px;
	background: var(--rec-gold-soft);
	transform: translateX(-50%);
}

.yw-rec-mindmap-poster__art b,
.yw-rec-mindmap-poster__art strong {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}

.yw-rec-mindmap-poster__art b {
	top: 74px;
	color: #236B5E;
	font-size: 15px;
}

.yw-rec-mindmap-poster__art strong {
	top: 100px;
	color: var(--rec-ink);
	font-size: 30px;
	line-height: 1.1;
}

.yw-rec-mindmap-poster__copy {
	display: grid;
	gap: 10px;
}

.yw-rec-mindmap-poster__copy span {
	justify-self: start;
	border-radius: 999px;
	background: var(--rec-green-soft);
	padding: 7px 12px;
	color: #236B5E;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-mindmap-poster__copy strong {
	color: var(--rec-ink);
	font-size: clamp(25px, 2.5vw, 34px);
	line-height: 1.22;
}

.yw-rec-mindmap-poster__copy em {
	max-width: 720px;
	color: #4B5565;
	font-size: var(--rec-font-body);
	font-style: normal;
	line-height: 1.72;
}

.yw-rec-mindmap-poster__cta {
	display: inline-flex;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: var(--rec-ink);
	padding: 12px 18px;
	color: #FFFFFF;
	font-weight: 900;
	white-space: nowrap;
}

.yw-rec-proof-band--teacher {
	display: block;
	border: 1px solid rgba(23, 32, 51, 0.08);
	background: linear-gradient(135deg, #FFFFFF 0%, #FFFDF6 48%, #F4FCF8 100%);
	color: var(--rec-ink);
	box-shadow: 0 24px 62px rgba(23, 32, 51, 0.08);
}

.yw-rec-proof-orbit {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-template-rows: auto auto auto;
	gap: 18px;
	min-height: 620px;
}

.yw-rec-proof-orbit::before {
	content: "";
	position: absolute;
	inset: 94px 19%;
	border: 1px dashed rgba(233, 30, 99, 0.18);
	border-radius: 999px;
}

.yw-rec-proof-orbit__center {
	position: relative;
	z-index: 2;
	grid-column: 2;
	grid-row: 2;
	align-self: center;
	justify-self: center;
	width: min(330px, 100%);
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 30px;
	background: #FFFFFF;
	padding: 18px;
	text-align: center;
	box-shadow: 0 24px 54px rgba(23, 32, 51, 0.10);
}

.yw-rec-proof-orbit__center img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 22px;
	object-fit: cover;
	object-position: top;
}

.yw-rec-proof-orbit__center span {
	display: inline-flex;
	margin-top: 18px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 6px 10px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
}

.yw-rec-proof-orbit__center strong {
	display: block;
	margin-top: 8px;
	color: var(--rec-ink);
	font-size: 24px;
	line-height: 1.25;
}

.yw-rec-proof-orbit__item {
	position: relative;
	z-index: 2;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.92);
	padding: 24px;
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.065);
}

.yw-rec-proof-orbit__item--1 {
	grid-column: 2;
	grid-row: 1;
}

.yw-rec-proof-orbit__item--2 {
	grid-column: 3;
	grid-row: 2;
}

.yw-rec-proof-orbit__item--3 {
	grid-column: 2;
	grid-row: 3;
}

.yw-rec-proof-orbit__item--4 {
	grid-column: 1;
	grid-row: 2;
}

.yw-rec-proof-orbit__item strong {
	display: block;
	color: var(--rec-coral-deep);
	font-size: clamp(28px, 3vw, 42px);
	line-height: 1;
}

.yw-rec-proof-orbit__item h3 {
	margin: 12px 0 8px;
	color: var(--rec-ink);
	font-size: 20px;
	line-height: 1.3;
}

.yw-rec-proof-orbit__item p {
	margin: 0;
	color: #4B5565;
	line-height: 1.65;
}

.yw-rec-proof-orbit__item--2 strong {
	color: #236B5E;
}

.yw-rec-proof-orbit__item--3 strong {
	color: #7C5718;
}

.yw-rec-proof-orbit__item--4 strong {
	color: #245080;
}

.yw-rec-price-head {
	max-width: 760px;
}

.yw-rec-price-head span {
	display: inline-flex;
	margin-bottom: 14px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 7px 12px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-price-head h2 {
	margin: 0;
}

.yw-rec-price-head p {
	margin: 14px 0 0;
	color: #4B5565;
	line-height: 1.72;
}

.yw-rec-price-plans {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 28px;
}

.yw-rec-price-plan {
	position: relative;
	display: grid;
	align-content: start;
	border: 1px solid rgba(23, 32, 51, 0.10);
	border-radius: 26px;
	background: #FFFFFF;
	padding: 26px;
	box-shadow: 0 18px 42px rgba(23, 32, 51, 0.06);
	overflow: hidden;
}

.yw-rec-price-plan::after {
	content: "";
	position: absolute;
	right: -40px;
	top: -40px;
	width: 132px;
	height: 132px;
	border-radius: 50%;
	background: rgba(233, 30, 99, 0.07);
}

.yw-rec-price-plan--recommended {
	border-color: rgba(245, 0, 87, 0.28);
	background: linear-gradient(180deg, #FFFFFF 0%, #FFF4F8 100%);
	box-shadow: 0 26px 58px rgba(245, 0, 87, 0.13);
	transform: translateY(-8px);
}

.yw-rec-price-plan--course::after {
	background: rgba(36, 87, 166, 0.08);
}

.yw-rec-price-plan--upgrade::after {
	background: rgba(45, 156, 137, 0.08);
}

.yw-rec-price-plan span {
	position: relative;
	z-index: 2;
	justify-self: start;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 7px 11px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-price-plan--course span {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-price-plan--upgrade span {
	background: var(--rec-green-soft);
	color: #236B5E;
}

.yw-rec-price-plan h3,
.yw-rec-price-plan strong,
.yw-rec-price-plan em,
.yw-rec-price-plan p,
.yw-rec-price-plan ul {
	position: relative;
	z-index: 2;
}

.yw-rec-price-plan h3 {
	margin: 18px 0 14px;
	color: var(--rec-ink);
	font-size: 22px;
	line-height: 1.28;
}

.yw-rec-price-plan strong {
	color: var(--rec-ink);
	font-size: clamp(30px, 3vw, 44px);
	line-height: 1.05;
}

.yw-rec-price-plan em {
	margin-top: 8px;
	color: var(--rec-coral-deep);
	font-style: normal;
	font-weight: 900;
}

.yw-rec-price-plan p {
	margin: 16px 0 0;
	color: #4B5565;
	line-height: 1.68;
}

.yw-rec-price-plan ul {
	display: grid;
	gap: 10px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.yw-rec-price-plan li {
	position: relative;
	padding-left: 22px;
	color: var(--rec-ink);
	font-size: var(--rec-font-label);
	font-weight: 850;
	line-height: 1.45;
}

.yw-rec-price-plan li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.62em;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--rec-coral-hot);
}

.yw-rec-price-plan--course li::before {
	background: var(--rec-blue);
}

.yw-rec-price-plan--upgrade li::before {
	background: var(--rec-green);
}

@media (max-width: 980px) {
	.yw-rec-delivery-compass,
	.yw-rec-proof-orbit,
	.yw-rec-price-plans {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		min-height: 0;
	}

	.yw-rec-delivery-compass::before,
	.yw-rec-proof-orbit::before {
		display: none;
	}

	.yw-rec-delivery-compass__center,
	.yw-rec-delivery-compass__item,
	.yw-rec-proof-orbit__center,
	.yw-rec-proof-orbit__item {
		grid-column: auto;
		grid-row: auto;
		width: 100%;
	}

	.yw-rec-mindmap-poster {
		grid-template-columns: 1fr;
	}

	.yw-rec-mindmap-poster__cta {
		justify-self: start;
	}

	.yw-rec-price-plan--recommended {
		transform: none;
	}
}

@media (max-width: 640px) {
	.yw-rec-delivery-compass,
	.yw-rec-proof-band--teacher {
		border-radius: 24px;
		padding: 18px;
	}

	.yw-rec-delivery-compass__center {
		min-height: 0;
	}

	.yw-rec-mindmap-poster__art {
		min-height: 184px;
	}

	.yw-rec-proof-orbit {
		gap: 14px;
	}

	.yw-rec-price-plan {
		padding: 22px;
	}
}

/* Product Design optimization layer: 2026-06-03. Keep older module rules above for rollback. */
.yw-rec-delivery-shell--product {
	position: relative;
	display: grid;
	gap: 24px;
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 30px;
	background:
		radial-gradient(circle at 8% 12%, rgba(233, 30, 99, 0.08), transparent 28%),
		linear-gradient(135deg, #FFFFFF 0%, #FFF9FB 48%, #F7FCF9 100%);
	padding: clamp(24px, 4vw, 44px);
	box-shadow: 0 24px 64px rgba(23, 32, 51, 0.08);
}

.yw-rec-delivery-product-head {
	display: grid;
	grid-template-columns: minmax(0, 0.78fr) minmax(260px, 0.62fr);
	gap: clamp(18px, 3vw, 34px);
	align-items: end;
}

.yw-rec-delivery-product-head span,
.yw-rec-feedback-copy span {
	display: inline-flex;
	justify-self: start;
	margin-bottom: 12px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 7px 12px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-delivery-product-head h3 {
	margin: 0;
	max-width: 640px;
	color: var(--rec-ink);
	font-size: clamp(30px, 4vw, 46px);
	line-height: 1.15;
}

.yw-rec-delivery-product-head p {
	margin: 0;
	color: #4B5565;
	font-size: clamp(16px, 1.4vw, 18px);
	line-height: 1.72;
}

.yw-rec-delivery-product-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.yw-rec-delivery-product-card {
	position: relative;
	display: grid;
	align-content: start;
	min-height: 286px;
	border: 1px solid rgba(23, 32, 51, 0.09);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.86);
	padding: 22px;
	box-shadow: 0 16px 38px rgba(23, 32, 51, 0.05);
	overflow: hidden;
}

.yw-rec-delivery-product-card::after {
	content: "";
	position: absolute;
	right: -34px;
	top: -34px;
	width: 110px;
	height: 110px;
	border-radius: 50%;
	background: rgba(233, 30, 99, 0.06);
}

.yw-rec-delivery-product-card:nth-child(2)::after,
.yw-rec-delivery-product-card:nth-child(6)::after {
	background: rgba(45, 156, 137, 0.08);
}

.yw-rec-delivery-product-card:nth-child(3)::after {
	background: rgba(183, 121, 31, 0.10);
}

.yw-rec-delivery-product-card:nth-child(4)::after {
	background: rgba(36, 87, 166, 0.08);
}

.yw-rec-delivery-product-card span,
.yw-rec-delivery-product-card em,
.yw-rec-delivery-product-card h3,
.yw-rec-delivery-product-card p,
.yw-rec-delivery-product-card ul {
	position: relative;
	z-index: 1;
}

.yw-rec-delivery-product-card span {
	width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
}

.yw-rec-delivery-product-card em {
	margin-top: 16px;
	color: var(--rec-coral-deep);
	font-style: normal;
	font-size: var(--rec-font-label);
	font-weight: 900;
}

.yw-rec-delivery-product-card h3 {
	margin: 8px 0 10px;
	color: var(--rec-ink);
	font-size: 22px;
	line-height: 1.28;
}

.yw-rec-delivery-product-card p {
	margin: 0;
	color: #4B5565;
	line-height: 1.64;
}

.yw-rec-delivery-product-card ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}

.yw-rec-delivery-product-card li {
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.92);
	padding: 7px 10px;
	color: #334155;
	font-size: 13px;
	font-weight: 850;
	line-height: 1;
}

.yw-rec-delivery-product-card li a {
	color: inherit;
	text-decoration: none;
}

.yw-rec-delivery-product-card li.yw-rec-delivery-product-link {
	max-width: 100%;
	background: linear-gradient(135deg, var(--rec-coral-hot), var(--rec-coral-deep));
	padding: 0;
	box-shadow: 0 10px 20px rgba(216, 27, 96, 0.18);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.yw-rec-delivery-product-card li.yw-rec-delivery-product-link a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 9px 14px;
	color: #FFFFFF;
	line-height: 1.15;
	text-align: center;
	white-space: normal;
}

.yw-rec-delivery-product-card li.yw-rec-delivery-product-link a::after {
	content: "↗";
	margin-left: 6px;
	font-size: 12px;
	line-height: 1;
}

.yw-rec-delivery-product-card li.yw-rec-delivery-product-link:hover,
.yw-rec-delivery-product-card li.yw-rec-delivery-product-link:focus-within {
	transform: translateY(-1px);
	box-shadow: 0 14px 26px rgba(216, 27, 96, 0.24);
}

.yw-rec-delivery-product-card li a:hover,
.yw-rec-delivery-product-card li a:focus-visible {
	color: var(--rec-coral-deep);
	outline: none;
}

.yw-rec-delivery-product-card li.yw-rec-delivery-product-link a:hover,
.yw-rec-delivery-product-card li.yw-rec-delivery-product-link a:focus-visible {
	color: #FFFFFF;
	outline: none;
}

#yw-rec-delivery-works li.yw-rec-delivery-product-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	border: 0;
	background: linear-gradient(135deg, var(--rec-coral-hot), var(--rec-coral-deep));
	padding: 0;
	box-shadow: 0 10px 20px rgba(216, 27, 96, 0.18);
}

#yw-rec-delivery-works li.yw-rec-delivery-product-link a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 9px 14px;
	color: #FFFFFF;
	text-align: center;
	white-space: normal;
}

#yw-rec-delivery-works li.yw-rec-delivery-product-link a:hover,
#yw-rec-delivery-works li.yw-rec-delivery-product-link a:focus-visible {
	color: #FFFFFF;
}

.yw-rec-delivery-preview-strip {
	display: grid;
	grid-template-columns: 1fr 1fr 1.16fr;
	gap: 14px;
	align-items: stretch;
}

.yw-rec-delivery-preview-strip.yw-rec-delivery-preview-strip--lesson {
	grid-template-columns: minmax(0, 1fr);
}

.yw-rec-preview-tile {
	position: relative;
	display: grid;
	align-content: start;
	border: 1px solid rgba(23, 32, 51, 0.09);
	border-radius: 22px;
	background: #FFFFFF;
	padding: 16px;
	color: inherit;
	text-decoration: none;
	box-shadow: 0 14px 32px rgba(23, 32, 51, 0.05);
	overflow: hidden;
}

.yw-rec-preview-tile:hover,
.yw-rec-preview-tile:focus-visible {
	border-color: rgba(233, 30, 99, 0.24);
	box-shadow: 0 20px 44px rgba(23, 32, 51, 0.10);
	transform: translateY(-2px);
	outline: 0;
}

.yw-rec-preview-tile > img {
	width: 100%;
	height: 150px;
	border-radius: 16px;
	object-fit: cover;
	object-position: top center;
	background: #F8FAFC;
}

.yw-rec-preview-stack {
	position: relative;
	min-height: 150px;
}

.yw-rec-preview-stack img {
	position: absolute;
	top: 4px;
	width: 92px;
	height: 136px;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 12px;
	object-fit: cover;
	box-shadow: 0 12px 22px rgba(23, 32, 51, 0.12);
}

.yw-rec-preview-stack img:nth-child(1) {
	left: 10px;
	transform: rotate(-6deg);
}

.yw-rec-preview-stack img:nth-child(2) {
	left: 74px;
	top: 0;
	transform: rotate(2deg);
}

.yw-rec-preview-stack img:nth-child(3) {
	left: 138px;
	transform: rotate(7deg);
}

.yw-rec-preview-tile strong {
	margin-top: 14px;
	color: var(--rec-ink);
	font-size: 18px;
	line-height: 1.25;
}

.yw-rec-preview-tile span {
	margin-top: 6px;
	color: #4B5565;
	line-height: 1.55;
}

.yw-rec-preview-tile--video .yw-rec-lesson-frame {
	border-radius: 16px;
	box-shadow: none;
}

.yw-rec-preview-tile--video .yw-rec-lesson-frame iframe {
	min-height: 150px;
}

.yw-rec-teacher-intro--product .yw-rec-teacher-intro__photo {
	display: flex;
	min-height: 370px;
	align-items: flex-end;
	justify-content: center;
	background:
		radial-gradient(circle at 68% 20%, rgba(233, 30, 99, 0.10), transparent 34%),
		linear-gradient(135deg, #FFF7FA 0%, #F0F7FF 100%);
}

.yw-rec-teacher-intro--product .yw-rec-teacher-intro__photo img {
	width: min(100%, 290px);
	height: 360px;
	aspect-ratio: auto;
	object-fit: contain;
	object-position: center bottom;
	box-shadow: none;
}

.yw-rec-feedback-panel {
	display: grid;
	grid-template-columns: minmax(0, 0.78fr) minmax(360px, 1fr);
	gap: clamp(24px, 4vw, 48px);
	align-items: center;
	border: 1px solid rgba(45, 156, 137, 0.18);
	border-radius: 30px;
	background:
		radial-gradient(circle at 86% 12%, rgba(45, 156, 137, 0.13), transparent 34%),
		linear-gradient(135deg, #FFFFFF 0%, #F7FCF9 100%);
	padding: clamp(26px, 5vw, 54px);
	box-shadow: 0 20px 54px rgba(23, 32, 51, 0.07);
}

.yw-rec-feedback-copy h2 {
	margin: 0;
	color: var(--rec-ink);
	font-size: clamp(32px, 4vw, 48px);
	line-height: 1.34;
}

.yw-rec-feedback-copy p {
	margin: 18px 0 0;
	color: #4B5565;
	font-size: clamp(16px, 1.35vw, 18px);
	line-height: 1.72;
}

.yw-rec-feedback-cards {
	display: grid;
	gap: 14px;
}

.yw-rec-feedback-cards article {
	position: relative;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.88);
	padding: 22px 22px 22px 56px;
	box-shadow: 0 14px 34px rgba(23, 32, 51, 0.05);
}

.yw-rec-feedback-cards article::before {
	content: "";
	position: absolute;
	left: 22px;
	top: 28px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: var(--rec-coral-hot);
	box-shadow: 0 0 0 8px rgba(245, 0, 87, 0.08);
}

.yw-rec-feedback-cards article:nth-child(2)::before {
	background: var(--rec-green);
	box-shadow: 0 0 0 8px rgba(45, 156, 137, 0.10);
}

.yw-rec-feedback-cards article:nth-child(3)::before {
	background: var(--rec-blue);
	box-shadow: 0 0 0 8px rgba(36, 87, 166, 0.10);
}

.yw-rec-feedback-cards strong {
	display: block;
	color: var(--rec-ink);
	font-size: 20px;
	line-height: 1.3;
}

.yw-rec-feedback-cards p {
	margin: 8px 0 0;
	color: #4B5565;
	line-height: 1.65;
}

.yw-rec-signup--decision {
	grid-template-columns: minmax(0, 1fr);
	gap: 26px;
	border: 1px solid rgba(233, 30, 99, 0.14);
	border-radius: 30px;
	background:
		radial-gradient(circle at 10% 14%, rgba(233, 30, 99, 0.08), transparent 30%),
		linear-gradient(135deg, #FFFFFF 0%, #FFF9FB 54%, #F7FCF9 100%);
	padding: clamp(24px, 4vw, 44px);
	box-shadow: var(--rec-shadow-card);
}

.yw-rec-signup--decision .yw-rec-signup__main,
.yw-rec-signup--decision .yw-rec-consult {
	border: 0;
	background: transparent;
	padding: 0;
	box-shadow: none;
}

.yw-rec-signup--decision .yw-rec-price-head {
	max-width: 780px;
	margin: 0 auto;
	text-align: center;
}

.yw-rec-signup--decision .yw-rec-price-rule {
	max-width: 860px;
	justify-content: center;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.yw-rec-duration-note {
	margin-top: 22px;
	border: 1px solid rgba(45, 156, 137, 0.18);
	border-radius: 22px;
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.92) 0%, rgba(245, 253, 250, 0.94) 100%);
	padding: clamp(18px, 2.6vw, 24px);
}

.yw-rec-duration-note__head {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	align-items: baseline;
	justify-content: space-between;
}

.yw-rec-duration-note__head strong {
	color: var(--rec-ink);
	font-size: 22px;
	line-height: 1.25;
}

.yw-rec-duration-note__head span {
	color: #4B5565;
	font-size: 15px;
	line-height: 1.55;
}

.yw-rec-duration-note__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin-top: 16px;
}

.yw-rec-duration-note article {
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.86);
	padding: 16px;
}

.yw-rec-duration-note article span {
	display: inline-flex;
	border-radius: 999px;
	background: var(--rec-green-soft);
	padding: 6px 10px;
	color: #236B5E;
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-duration-note article:nth-child(2) span {
	background: var(--rec-blush);
	color: var(--rec-coral-deep);
}

.yw-rec-duration-note article:nth-child(3) span {
	background: var(--rec-blue-soft);
	color: #245080;
}

.yw-rec-duration-note article strong {
	display: block;
	margin-top: 12px;
	color: var(--rec-ink);
	font-size: 17px;
	line-height: 1.42;
}

.yw-rec-duration-note article p {
	margin: 8px 0 0;
	color: #4B5565;
	font-size: 15px;
	line-height: 1.62;
}

.yw-rec-duration-note__highlight {
	color: var(--rec-coral-deep);
	font-weight: 900;
}

.yw-rec-duration-note article .yw-rec-duration-note__highlight {
	color: var(--rec-coral-deep);
}

.yw-rec-signup--decision .yw-rec-actions {
	justify-content: center;
}

.yw-rec-signup--decision .yw-rec-consult {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 8px 20px;
	align-items: center;
	border-top: 1px solid rgba(23, 32, 51, 0.08);
	padding-top: 22px;
	text-align: left;
}

.yw-rec-signup--decision .yw-rec-consult img {
	grid-row: 1 / span 2;
	width: 120px;
	margin: 0;
	border-radius: 18px;
}

.yw-rec-signup--decision .yw-rec-consult h3 {
	font-size: 23px;
}

.yw-rec-signup--decision .yw-rec-consult p {
	margin: 0;
	line-height: 1.68;
}

.yw-rec-price-decision {
	display: grid;
	gap: 14px;
	margin-top: 28px;
}

.yw-rec-price-decision__card {
	display: grid;
	grid-template-columns: minmax(170px, 0.62fr) minmax(200px, 0.9fr) minmax(220px, 0.72fr);
	gap: 14px;
	align-items: center;
	border: 1px solid rgba(23, 32, 51, 0.10);
	border-radius: 24px;
	background: #FFFFFF;
	padding: 22px;
	box-shadow: 0 14px 32px rgba(23, 32, 51, 0.05);
}

.yw-rec-price-decision__card--recommended {
	border-color: rgba(245, 0, 87, 0.26);
	background: linear-gradient(135deg, #FFFFFF 0%, #FFF4F8 100%);
	box-shadow: 0 20px 46px rgba(245, 0, 87, 0.10);
}

.yw-rec-price-decision__scenario span {
	display: inline-flex;
	margin-bottom: 12px;
	border-radius: 999px;
	background: var(--rec-blush);
	padding: 7px 11px;
	color: var(--rec-coral-deep);
	font-size: var(--rec-font-meta);
	font-weight: 900;
	line-height: 1;
}

.yw-rec-price-decision__scenario strong,
.yw-rec-price-decision__choice h3,
.yw-rec-price-decision__price strong {
	color: var(--rec-ink);
}

.yw-rec-price-decision__scenario strong {
	display: block;
	font-size: 18px;
	line-height: 1.42;
}

.yw-rec-price-decision__choice h3 {
	margin: 0;
	font-size: 22px;
	line-height: 1.28;
}

.yw-rec-price-decision__choice p {
	margin: 8px 0 0;
	color: #4B5565;
	line-height: 1.62;
}

.yw-rec-price-decision__price {
	display: grid;
	justify-items: end;
	text-align: right;
}

.yw-rec-price-decision__price strong {
	font-size: clamp(27px, 2.1vw, 34px);
	line-height: 1.05;
	white-space: nowrap;
}

.yw-rec-price-decision__price em {
	margin-top: 6px;
	color: var(--rec-coral-deep);
	font-style: normal;
	font-weight: 900;
}

@media (max-width: 1080px) {
	.yw-rec-delivery-product-head,
	.yw-rec-feedback-panel,
	.yw-rec-signup--decision,
	.yw-rec-price-decision__card {
		grid-template-columns: 1fr;
	}

	.yw-rec-delivery-product-grid,
	.yw-rec-delivery-preview-strip {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.yw-rec-price-decision__price {
		justify-items: start;
		text-align: left;
	}
}

@media (max-width: 640px) {
	.yw-rec-delivery-shell--product,
	.yw-rec-feedback-panel {
		border-radius: 24px;
		padding: 20px;
	}

	.yw-rec-delivery-product-grid,
	.yw-rec-delivery-preview-strip {
		grid-template-columns: 1fr;
	}

	.yw-rec-delivery-product-card {
		min-height: 0;
		padding: 20px;
	}

	.yw-rec-preview-tile > img,
	.yw-rec-preview-stack,
	.yw-rec-preview-tile--video .yw-rec-lesson-frame iframe {
		height: 170px;
		min-height: 170px;
	}

	.yw-rec-teacher-intro--product .yw-rec-teacher-intro__photo {
		min-height: 310px;
	}

	.yw-rec-teacher-intro--product .yw-rec-teacher-intro__photo img {
		height: 300px;
	}

	.yw-rec-feedback-cards article {
		padding: 20px 20px 20px 50px;
	}

	.yw-rec-price-decision__card {
		padding: 20px;
	}
}

/* Taste optimization layer: 2026-06-04. Keep previous layers above for module rollback. */
.yw-recitation-v2 {
	--rec-mobile-dock-height: 82px;
}

.yw-rec-section {
	scroll-margin-top: 92px;
}

.yw-rec-delivery-preview-head {
	display: flex;
	align-items: end;
	justify-content: center;
	gap: 18px;
	border-top: 1px solid rgba(23, 32, 51, 0.08);
	padding-top: 4px;
	text-align: center;
}

.yw-rec-delivery-preview-head strong {
	color: var(--rec-ink);
	font-size: clamp(22px, 2vw, 28px);
	line-height: 1.25;
	text-align: center;
}

.yw-rec-delivery-preview-head span {
	max-width: 360px;
	color: #4B5565;
	line-height: 1.62;
}

.yw-rec-preview-tile {
	overflow: hidden;
}

.yw-rec-preview-tile > img,
.yw-rec-preview-stack {
	height: 190px;
	min-height: 190px;
}

.yw-rec-preview-tile > img {
	object-position: top center;
}

.yw-rec-preview-tile--map {
	border-color: rgba(45, 156, 137, 0.22);
	background: linear-gradient(180deg, #FFFFFF 0%, #F6FCF9 100%);
}

.yw-rec-preview-tile--plan {
	border-color: rgba(124, 87, 24, 0.18);
	background: linear-gradient(180deg, #FFFFFF 0%, #FFFCF3 100%);
}

.yw-rec-preview-tile--video {
	border-color: rgba(23, 32, 51, 0.12);
}

.yw-rec-delivery-preview-strip--lesson .yw-rec-preview-tile--video {
	padding: clamp(16px, 2.4vw, 24px);
}

.yw-rec-delivery-preview-strip--lesson .yw-rec-lesson-frame {
	margin-top: 0;
}

.yw-rec-price-rule {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	margin-top: 22px;
	border: 1px solid rgba(124, 87, 24, 0.16);
	border-radius: 18px;
	background: linear-gradient(135deg, #FFFDF6 0%, #FFF7E8 100%);
	padding: 14px 16px;
	color: #72511B;
	line-height: 1.55;
}

.yw-rec-price-rule strong {
	color: #72511B;
}

.yw-rec-price-rule span {
	color: #4B5565;
}

@media (min-width: 1081px) {
	.yw-rec-delivery-preview-strip {
		grid-template-columns: 1fr 1fr 1.16fr;
	}
}

@media (max-width: 640px) {
	html {
		scroll-padding-bottom: calc(82px + env(safe-area-inset-bottom) + 26px);
	}

	.yw-recitation-v2 {
		padding-bottom: calc(var(--rec-mobile-dock-height) + env(safe-area-inset-bottom) + 36px);
	}

	.yw-rec-section {
		scroll-margin-top: 18px;
		scroll-margin-bottom: calc(var(--rec-mobile-dock-height) + env(safe-area-inset-bottom) + 34px);
	}

	#yw-rec-signup,
	#yw-rec-faq {
		padding-bottom: calc(58px + var(--rec-mobile-dock-height) + env(safe-area-inset-bottom));
	}

	.yw-rec-mobile-cta {
		bottom: calc(10px + env(safe-area-inset-bottom));
	}

	.yw-rec-elevator {
		bottom: calc(var(--rec-mobile-dock-height) + env(safe-area-inset-bottom) + 18px);
	}

	.yw-rec-elevator__panel {
		bottom: calc(var(--rec-mobile-dock-height) + env(safe-area-inset-bottom) + 18px);
	}

	body.yw-reveal-ready .yw-recitation-v2 #yw-rec-system [data-yw-reveal] {
		opacity: 1;
		transform: none;
		transition: none;
	}

	#yw-rec-system .yw-rec-split-head {
		margin-bottom: 18px;
	}

	#yw-rec-system .yw-rec-relation {
		gap: 18px;
		padding: 20px;
	}

	#yw-rec-system .yw-rec-system-visual {
		min-height: 236px;
	}

	#yw-rec-system .yw-rec-system-browser {
		inset: 0 0 18px;
		border-radius: 20px;
	}

	#yw-rec-system .yw-rec-system-browser__top {
		height: 38px;
		padding: 0 16px;
	}

	#yw-rec-system .yw-rec-system-browser__body {
		gap: 10px;
		padding: 16px;
	}

	#yw-rec-system .yw-rec-system-browser__body span {
		min-height: 45px;
		border-radius: 14px;
		padding: 11px 13px;
		font-size: 15px;
	}

	#yw-rec-system .yw-rec-system-browser__body b {
		display: none;
	}

	#yw-rec-system .yw-rec-system-float {
		min-height: 38px;
		border-radius: 14px;
		padding: 0 12px;
	}

	#yw-rec-system .yw-rec-system-float--plan {
		top: 40px;
		right: 8px;
	}

	#yw-rec-system .yw-rec-system-float--qa {
		left: 8px;
		bottom: 4px;
	}

	#yw-rec-system .yw-rec-system-copy h3 {
		font-size: 21px;
		line-height: 1.32;
	}

	#yw-rec-system .yw-rec-system-copy p {
		line-height: 1.66;
	}

	#yw-rec-system .yw-rec-relation-flow {
		display: none;
	}

	.yw-rec-delivery-shell--product {
		gap: 18px;
	}

	.yw-rec-delivery-product-head {
		gap: 10px;
	}

	.yw-rec-delivery-product-head h3 {
		font-size: 26px;
		line-height: 1.2;
	}

	.yw-rec-delivery-product-head p {
		line-height: 1.62;
	}

	.yw-rec-delivery-product-grid {
		gap: 12px;
	}

	.yw-rec-delivery-product-card {
		grid-template-columns: 40px minmax(0, 1fr);
		gap: 7px 12px;
		align-items: start;
		padding: 18px;
	}

	.yw-rec-delivery-product-card span {
		grid-row: 1 / 3;
		width: 36px;
		height: 36px;
		margin: 0;
		align-items: center;
		justify-content: center;
	}

	.yw-rec-delivery-product-card em,
	.yw-rec-delivery-product-card h3 {
		grid-column: 2;
	}

	.yw-rec-delivery-product-card em {
		margin: 0;
		font-size: 12px;
	}

	.yw-rec-delivery-product-card h3 {
		margin: 0;
		font-size: 19px;
	}

	.yw-rec-delivery-product-card p {
		grid-column: 1 / -1;
		display: -webkit-box;
		margin-top: 6px;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-height: 1.58;
	}

	.yw-rec-delivery-product-card ul {
		grid-column: 1 / -1;
		display: flex;
		flex-wrap: wrap;
		gap: 7px;
		margin-top: 8px;
	}

	.yw-rec-delivery-product-card li {
		border-radius: 999px;
		background: rgba(255, 255, 255, 0.72);
		padding: 6px 9px;
		font-size: 12px;
		line-height: 1;
	}

	.yw-rec-delivery-product-card li::before {
		display: none;
	}

	.yw-rec-delivery-preview-head {
		display: grid;
		gap: 6px;
	}

	.yw-rec-delivery-preview-head span {
		max-width: none;
	}

	.yw-rec-preview-tile > img,
	.yw-rec-preview-stack,
	.yw-rec-preview-tile--video .yw-rec-lesson-frame iframe {
		height: 158px;
		min-height: 158px;
	}

	.yw-rec-price-rule {
		display: grid;
		margin-top: 18px;
		padding: 14px;
	}

	.yw-rec-price-alert {
		margin-bottom: calc(var(--rec-mobile-dock-height) + env(safe-area-inset-bottom) + 22px);
	}

	.yw-rec-signup--decision {
		border-radius: 24px;
		padding: 22px;
	}

	.yw-rec-duration-note__head {
		display: grid;
		text-align: left;
	}

	.yw-rec-duration-note__grid {
		grid-template-columns: 1fr;
	}

	.yw-rec-signup--decision .yw-rec-consult {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.yw-rec-signup--decision .yw-rec-consult img {
		grid-row: auto;
		width: min(180px, 100%);
	}

	.yw-rec-signup--decision .yw-rec-consult h3,
	.yw-rec-signup--decision .yw-rec-consult p {
		grid-column: 1;
	}
}

/* 2026-06-04 hero close-up: push the student portrait from medium shot to near shot on desktop. */
@media (min-width: 981px) {
	.yw-rec-hero__grid {
		grid-template-columns: minmax(0, 0.82fr) minmax(540px, 1.18fr);
	}

	.yw-rec-portrait {
		height: clamp(540px, 45vw, 640px);
	}

	.yw-rec-portrait::before {
		bottom: -66px;
		width: min(720px, 124%);
		height: clamp(124px, 10vw, 166px);
	}

	.yw-rec-portrait img {
		right: -24px;
		bottom: -54px;
		height: min(720px, 52vw);
	}

	.yw-rec-student-card {
		left: 4%;
		bottom: 118px;
	}
}

/* 2026-06-04 logic cards: body copy reads better with justified Chinese paragraphs. */
.yw-rec-logic-flow .yw-rec-logic-step p {
	text-align: justify;
	text-align-last: left;
	text-justify: inter-ideograph;
}

/* 2026-06-04 delivery visuals: center the section claim and show real product samples in the first two cards. */
.yw-rec-delivery-product-head {
	grid-template-columns: minmax(0, 1fr);
	justify-items: center;
	max-width: 860px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.yw-rec-delivery-product-head span {
	justify-self: center;
}

.yw-rec-delivery-product-head h3,
.yw-rec-delivery-product-head p {
	max-width: 760px;
	text-align: center;
}

.yw-rec-delivery-product-figure {
	position: relative;
	z-index: 1;
	margin: 18px 0 0;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 18px;
	background: #FFFFFF;
	padding: 10px;
	overflow: hidden;
	box-shadow: 0 14px 30px rgba(23, 32, 51, 0.06);
}

.yw-rec-delivery-product-figure img {
	display: block;
	width: 100%;
	height: 152px;
	border-radius: 12px;
	object-fit: contain;
}

.yw-rec-delivery-product-figure--note {
	background: linear-gradient(180deg, #F6F7F8 0%, #ECEFF2 100%);
}

.yw-rec-delivery-product-figure--note img {
	object-fit: cover;
	object-position: center;
}

.yw-rec-delivery-product-figure--map {
	background: #FFFFFF;
}

.yw-rec-delivery-product-figure--map img {
	background: #FFFFFF;
	object-fit: contain;
}

.yw-rec-delivery-product-figure--plan img {
	height: 168px;
	object-fit: cover;
	object-position: top center;
}

@media (max-width: 640px) {
	.yw-rec-delivery-product-figure {
		grid-column: 1 / -1;
		margin-top: 12px;
	}

	.yw-rec-delivery-product-figure img {
		height: 148px;
	}
}