/* ─────────────────────────────────────────────
 * 일반 영상 강의 페이지 (post-lecture-template.php)
 *
 * 레이아웃: 좌 본문 + 우 sticky 사이드바 (340px)
 * 모든 색상/간격/모서리/그림자/전환은 :root 변수만 사용
 * (변수 정의: themes/generatepress_child/style.css)
 * ───────────────────────────────────────────── */

/* ── 페이지 진행률 Progress Bar (브런치 스타일) ── */
.lec-progress-bar {
	position: fixed;
	top: var(--nav-height, 60px);
	left: 0;
	right: 0;
	height: 4px;
	background: rgba(0, 0, 0, 0.05);
	z-index: 99; /* nav(100) 보다 살짝 아래 */
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	pointer-events: none;
}
.lec-progress-bar.is-active {
	opacity: 1;
	visibility: visible;
}
.lec-progress-bar__fill {
	height: 100%;
	width: 0;
	background: var(--primary);
	transition: width 0.05s linear;
}
/* admin-bar 활성 시 nav 가 admin bar 만큼 내려가므로 progress bar 도 동일 보정 */
.admin-bar .lec-progress-bar {
	top: calc(var(--nav-height, 60px) + 32px);
}
@media (max-width: 782px) {
	.admin-bar .lec-progress-bar {
		top: calc(var(--nav-height, 60px) + 46px);
	}
}

/* ── 페이지 컨테이너 ── */
.lec-page {
	max-width: 1300px;
	margin: 0 auto;
	padding: var(--space-lg) var(--px);
	color: var(--text-primary);
	line-height: 1.7;
	font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
	box-sizing: border-box;
	min-width: 0;
}

/* ── 2-Column 그리드 (PC: 본문 + 우측 사이드바) ── */
.lec-grid {
	display: flex;
	gap: var(--space-xl);
	align-items: flex-start;
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
}

/* ── 본문 ── */
.lec-main {
	flex: 1 1 0;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* ── 우측 사이드바 ── */
.lec-sidebar--right {
	width: 340px;
	flex-shrink: 0;
}
.lec-sidebar-sticky {
	display: flex;
	flex-direction: column;
	gap: var(--space-md);
}

/* ── 사이드바 카드 (공용) ── */
.lec-sidebar-card {
	background: #fff;
	border: 1px solid var(--gray-200);
	border-radius: var(--radius-lg);
	overflow: hidden;
}
.lec-sidebar-card__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-md) var(--space-lg);
	background: none;
	border: none;
	width: 100%;
	text-align: left;
}
button.lec-sidebar-card__header {
	cursor: pointer;
}
.lec-sidebar-card__title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	gap: var(--space-xs);
}
.lec-sidebar-card__title i {
	color: var(--primary);
}

/* ── 사이드바 TOC ── */
.lec-sidebar-toc__arrow {
	font-size: 12px;
	color: var(--text-muted);
	transition: transform var(--transition-base);
}
.lec-sidebar-toc__body {
	padding: 0 var(--space-sm) var(--space-sm);
	max-height: clamp(360px, 65vh, 720px);
	overflow-y: auto;
	overscroll-behavior: contain;
}
.lec-sidebar-toc__body::-webkit-scrollbar {
	width: 6px;
}
.lec-sidebar-toc__body::-webkit-scrollbar-track {
	background: transparent;
}
.lec-sidebar-toc__body::-webkit-scrollbar-thumb {
	background: var(--gray-300);
	border-radius: var(--radius-full);
}
.lec-sidebar-toc__body::-webkit-scrollbar-thumb:hover {
	background: var(--gray-400);
}

/* ── 목차 (TOC) — 공용 (사이드바 + 모바일) ── */
.lec-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.lec-toc__item + .lec-toc__item {
	margin-top: var(--space-sm);
	padding-top: var(--space-sm);
	border-top: 1px dashed var(--gray-200);
}
.lec-toc__link {
	display: flex;
	gap: var(--space-sm);
	align-items: flex-start;
	padding: 6px 8px;
	border-radius: var(--radius-md);
	color: var(--text-secondary);
	text-decoration: none;
	font-size: 14px;
	line-height: 1.45;
	transition: all var(--transition-fast);
}
.lec-toc__link:hover {
	background: var(--primary-light);
	color: var(--primary-dark);
}
.lec-toc__link:active,
.lec-toc__link:focus {
	color: var(--primary-dark);
	outline: none;
}
.lec-toc__link.is-current {
	background: var(--primary-light);
	color: var(--primary-dark);
	font-weight: 700;
}
.lec-toc__link.is-current .lec-toc__text {
	color: inherit;
}
.lec-toc__link--h3 {
	font-weight: 600;
	color: var(--text-primary);
}
.lec-toc__link--h5 {
	font-size: 13px;
	color: var(--text-muted);
}
.lec-toc__num {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	background: var(--primary);
	color: var(--text-white);
	border-radius: var(--radius-full);
	font-size: 11px;
	font-weight: 700;
}
.lec-toc__text {
	flex: 1 1 auto;
}
.lec-toc__sublist {
	list-style: none;
	margin: 6px 0 0;
	padding: 0 0 0 30px;
	border-left: 2px solid var(--gray-200);
}

/* ── 사이드바: 관련강의/함수 mini ── */
.lec-related-mini {
	list-style: none;
	margin: 0;
	padding: 0 var(--space-sm) var(--space-sm);
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}
.lec-related-mini__item {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: var(--space-sm);
	padding: 6px;
	border-radius: var(--radius-md);
	color: var(--text-primary);
	text-decoration: none;
	transition: background var(--transition-fast);
}
.lec-related-mini__item:hover {
	background: var(--bg-subtle);
}
.lec-related-mini__item img {
	width: 80px;
	height: 50px;
	object-fit: cover;
	border-radius: var(--radius-sm);
}
.lec-related-mini__title {
	font-size: 12.5px;
	font-weight: 500;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	align-self: center;
}

/* ── 멤버십 배너 ── */
.lec-membership-banner {
	background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 50%, #2A8C62 100%);
	border-radius: var(--radius-lg);
	padding: var(--space-xl) var(--space-lg);
	position: relative;
	overflow: hidden;
}
.lec-membership-banner::before {
	content: '';
	position: absolute;
	top: -30px;
	right: -30px;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.06);
	pointer-events: none;
}
.lec-membership-banner::after {
	content: '';
	position: absolute;
	bottom: -20px;
	left: -20px;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.04);
	pointer-events: none;
}
.lec-membership-banner__badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: rgba(255, 255, 255, 0.15);
	border-radius: var(--radius-full);
	padding: 5px 12px;
	margin-bottom: var(--space-md);
	position: relative;
	z-index: 1;
}
.lec-membership-banner__badge i {
	color: #FFD93D;
	font-size: 13px;
}
.lec-membership-banner__badge span {
	color: rgba(255, 255, 255, 0.95);
	font-size: 12px;
	font-weight: 600;
}
.lec-membership-banner__heading {
	color: #fff;
	font-size: 20px;
	font-weight: 800;
	line-height: 1.4;
	margin-bottom: var(--space-sm);
	position: relative;
	z-index: 1;
}
.lec-membership-banner__desc {
	color: rgba(255, 255, 255, 0.75);
	font-size: 14px;
	line-height: 1.6;
	margin-bottom: var(--space-lg);
	position: relative;
	z-index: 1;
}
.lec-membership-banner__btn {
	display: inline-block;
	background: #fff;
	color: var(--primary-dark);
	border: none;
	border-radius: var(--radius-md);
	padding: var(--space-md) var(--space-xl);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
	transition: transform var(--transition-fast), box-shadow var(--transition-fast);
	position: relative;
	z-index: 1;
}
.lec-membership-banner__btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
	color: var(--primary-dark);
}

/* ─────────────────────────────────────────────
 * Hero (카테고리 / 제목 / 강연자) — 풀너비, 가운데 정렬
 * ───────────────────────────────────────────── */
.lec-hero {
	max-width: 760px;
	margin: 0 auto var(--space-2xl);
	padding: var(--space-xl) 0 var(--space-lg);
	text-align: center;
}
.lec-hero__category {
	display: inline-block;
	margin-bottom: var(--space-md);
	color: var(--primary);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	transition: color var(--transition-fast);
}
.lec-hero__category:hover {
	color: var(--primary-dark);
}
.lec-hero__title {
	margin: 0 0 var(--space-lg);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.025em;
	color: var(--text-primary);
}
.lec-hero__author {
	display: inline-flex;
	align-items: center;
	gap: var(--space-sm);
	font-size: 14px;
	color: var(--text-secondary);
}
.lec-hero__author img,
.lec-hero__author .avatar,
.lec-hero__author .lec-hero__avatar {
	width: 36px !important;
	height: 36px !important;
	border-radius: 50% !important;
	object-fit: cover;
	overflow: hidden;
}
.lec-hero__author-text strong {
	color: var(--text-primary);
	font-weight: 700;
}

/* ─────────────────────────────────────────────
 * 설명 카드 (1줄 요약 + 200자 설명)
 * ───────────────────────────────────────────── */
.lec-summary-card {
	max-width: 920px;
	margin: 0 auto var(--space-xl);
	padding: var(--space-2xl) var(--space-xl);
	background: var(--bg-subtle);
	border-radius: var(--radius-xl);
}
.lec-summary-card__lead {
	margin: 0 0 var(--space-md);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.55;
	color: var(--text-primary);
	letter-spacing: -0.01em;
}
.lec-summary-card__desc {
	font-size: 15.5px;
	line-height: 1.75;
	color: var(--text-secondary);
}
.lec-summary-card__desc p {
	margin: 0 0 var(--space-sm);
}
.lec-summary-card__desc p:last-child {
	margin: 0;
}

/* ── 영상 스테이지 (브라우저 창 프레임) ── */
.lec-video-stage {
	max-width: 920px;
	margin: 0 auto var(--space-xl);
}

/* 브라우저 창 프레임 — wrapper가 시각 컨테이너 */
.lec-video-wrapper {
	position: relative;
	padding-top: 44px;                          /* 상단 바 공간 */
	background: var(--bg-subtle);
	border: 1px solid var(--surface-200);
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: var(--shadow-md);
}

/* 상단 바 (배경 + 좌측 점 3개) */
.lec-video-wrapper::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 44px;
	background-color: var(--surface-100);
	background-image:
		radial-gradient(circle, var(--surface-300) 5px, transparent 5.5px),
		radial-gradient(circle, var(--surface-300) 5px, transparent 5.5px),
		radial-gradient(circle, var(--surface-300) 5px, transparent 5.5px);
	background-position: 16px center, 36px center, 56px center;
	background-repeat: no-repeat;
	border-bottom: 1px solid var(--surface-200);
}

/* URL pill (가운데) */
.lec-video-wrapper::after {
	content: 'youtube.com/@oppadu';
	position: absolute;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	width: min(360px, 60%);
	box-sizing: border-box;
	padding: 4px 24px;
	background: var(--bg-subtle);
	border: 1px solid var(--surface-200);
	border-radius: var(--radius-full);
	font-size: var(--font-xs);
	color: var(--t-muted);
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* 프레임 안에서 비디오는 자체 라운드/그림자 제거 (프레임이 책임짐) */
.lec-video-stage .lec-lite-youtube {
	border-radius: 0;
	box-shadow: none;
}
.lec-video-stage .lec-lite-youtube:hover {
	transform: none;
	box-shadow: none;
}

/* ── lite-youtube ── */
.lec-lite-youtube {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #000;
	border-radius: var(--radius-lg);
	overflow: hidden;
	cursor: pointer;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.08);
	transition: transform var(--transition-base), box-shadow var(--transition-base);
}
.lec-lite-youtube:hover {
	transform: translateY(-2px);
	box-shadow: 0 28px 60px rgba(0, 0, 0, 0.22), 0 10px 20px rgba(0, 0, 0, 0.1);
}
.lec-lite-youtube__thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--transition-slow);
}
.lec-lite-youtube:hover .lec-lite-youtube__thumb {
	transform: scale(1.03);
}
.lec-lite-youtube__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 90px;
	height: 64px;
	padding: 0;
	background: transparent;
	border: none;
	cursor: pointer;
	transition: transform var(--transition-fast);
}
.lec-lite-youtube__play svg {
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4));
}
.lec-lite-youtube:hover .lec-lite-youtube__play {
	transform: translate(-50%, -50%) scale(1.08);
}
.lec-lite-youtube:hover .lec-lite-youtube__play svg path:first-child {
	fill: #cc0000;
	fill-opacity: 1;
}
.lec-lite-youtube iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

/* ── 영상 타임라인 (재생 시 영상 아래로 펼쳐짐) ── */
.lec-timeline {
	position: relative;
	z-index: 1;
	max-width: 900px;
	margin: 0 auto;
	background: rgba(255, 255, 255, 0.96);
	border: 1px solid var(--gray-200);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	display: none;
}
.lec-timeline.is-open {
	display: block;
	margin-top: var(--space-md);
	animation: lec-timeline-in 0.4s ease both;
}
@keyframes lec-timeline-in {
	from { opacity: 0; transform: translateY(-8px); }
	to   { opacity: 1; transform: translateY(0); }
}
.lec-timeline__header {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	padding: var(--space-md) var(--space-lg);
	border-bottom: 1px solid var(--gray-200);
	background: var(--bg-subtle);
	font-size: 14px;
	font-weight: 700;
	color: var(--text-primary);
}
.lec-timeline__header i {
	color: var(--primary);
}
.lec-timeline__count {
	margin-left: auto;
	font-size: 12px;
	font-weight: 700;
	background: var(--primary-light);
	color: var(--primary);
	padding: 2px 10px;
	border-radius: var(--radius-full);
}
.lec-timeline__list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 320px;
	overflow-y: auto;
	overscroll-behavior: contain;
}
.lec-timeline__list::-webkit-scrollbar {
	width: 6px;
}
.lec-timeline__list::-webkit-scrollbar-thumb {
	background: var(--gray-300);
	border-radius: var(--radius-full);
}
.lec-timeline__list::-webkit-scrollbar-thumb:hover {
	background: var(--gray-400);
}
.lec-timeline__row + .lec-timeline__row {
	border-top: 1px dashed var(--gray-200);
}
.lec-timeline__item {
	display: flex;
	gap: var(--space-md);
	align-items: center;
	width: 100%;
	padding: 10px var(--space-lg);
	background: none;
	border: none;
	text-align: left;
	cursor: pointer;
	font-family: inherit;
	color: var(--text-primary);
	transition: background var(--transition-fast), color var(--transition-fast);
}
.lec-timeline__item:hover,
.lec-timeline__item:focus-visible {
	background: var(--bg-subtle);
	color: var(--primary-dark);
	outline: none;
}
.lec-timeline__time {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 60px;
	padding: 3px 8px;
	background: var(--primary);
	color: var(--text-white);
	border-radius: var(--radius-sm);
	font-family: 'JetBrains Mono', 'D2Coding', Consolas, monospace;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: -0.02em;
}
.lec-timeline__item:hover .lec-timeline__time,
.lec-timeline__item:focus-visible .lec-timeline__time {
	background: var(--primary-dark);
}
.lec-timeline__title {
	flex: 1 1 auto;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.45;
}

/* ─────────────────────────────────────────────
 * 이어지는 프리미엄 라이브 (사이드바 / 모바일 사이드바 상단)
 * 좁은 폭 (≈340px)에 맞춘 세로 스택 카드
 * ───────────────────────────────────────────── */
.lec-related-lives {
	display: flex;
	flex-direction: column;
	gap: var(--space-md);
}
.lec-related-lives__card {
	display: block;
	background: #fff;
	border: 1px solid var(--gray-200);
	border-radius: var(--radius-lg);
	color: var(--text-primary);
	text-decoration: none;
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	transition: transform var(--transition-base),
		box-shadow var(--transition-base);
}
.lec-related-lives__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 32px -10px rgba(0, 0, 0, 0.18), 0 6px 12px -4px rgba(0, 0, 0, 0.08);
	color: var(--text-primary);
}
.lec-related-lives__thumb {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--gray-100);
	overflow: hidden;
}
.lec-related-lives__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--transition-slow);
}
.lec-related-lives__card:hover .lec-related-lives__thumb img {
	transform: scale(1.04);
}
.lec-related-lives__badge {
	position: absolute;
	top: var(--space-sm);
	left: var(--space-sm);
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
	color: #fff;
	border-radius: var(--radius-full);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: -0.01em;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
}
.lec-related-lives__badge i {
	color: #FFD93D;
}
.lec-related-lives__body {
	padding: var(--space-md);
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}
.lec-related-lives__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-sm);
	font-size: 12px;
	color: var(--text-muted);
	font-weight: 600;
}
.lec-related-lives__no {
	padding: 2px 8px;
	background: var(--bg-subtle);
	border-radius: var(--radius-sm);
	color: var(--text-secondary);
}
.lec-related-lives__time {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.lec-related-lives__title {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: -0.01em;
	color: var(--text-primary);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.lec-related-lives__cta {
	margin-top: var(--space-xs);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px var(--space-md);
	background: var(--primary);
	color: var(--text-white);
	border-radius: var(--radius-md);
	font-size: 13.5px;
	font-weight: 700;
	transition: background var(--transition-fast), gap var(--transition-fast);
}
.lec-related-lives__card:hover .lec-related-lives__cta {
	background: var(--primary-dark);
	gap: 10px;
	color: var(--text-white);
}

/* ─────────────────────────────────────────────
 * 난이도 라벨 (5단계 색상)
 * ───────────────────────────────────────────── */
.lec-level-badge {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	border-radius: var(--radius-full);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: -0.01em;
	background: var(--gray-100);
	color: var(--text-secondary);
}
.lec-level-badge--1 { background: #E8F5E9; color: #2E7D32; }
.lec-level-badge--2 { background: #E3F2FD; color: #1565C0; }
.lec-level-badge--3 { background: #FFF8E1; color: #B7791F; }
.lec-level-badge--4 { background: #FBE9E7; color: #C62828; }
.lec-level-badge--5 { background: #F3E5F5; color: #6A1B9A; }

/* ─────────────────────────────────────────────
 * Hero 메타 (학습시간 / 난이도) — 강연자 아래 인라인
 * ───────────────────────────────────────────── */
.lec-hero__meta {
	list-style: none;
	margin: var(--space-md) 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: var(--space-md);
}
.lec-hero__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--text-secondary);
}
.lec-hero__meta-item i {
	color: var(--text-muted);
	font-size: 12px;
}
.lec-hero__meta-item + .lec-hero__meta-item {
	padding-left: var(--space-md);
	border-left: 1px solid var(--gray-200);
}
.lec-hero__meta-label {
	color: var(--text-muted);
	font-weight: 500;
}
.lec-hero__meta-value {
	color: var(--text-primary);
	font-weight: 700;
}

/* ─────────────────────────────────────────────
 * 짧은 디바이더 (섹션 전환 시각 리듬)
 * ───────────────────────────────────────────── */
.lec-divider {
	border: 0;
	width: 48px;
	height: 1px;
	margin: var(--space-lg) auto;
	background: var(--gray-300);
	border-radius: var(--radius-full);
}

/* ─────────────────────────────────────────────
 * 다운로드 카드 (영상 아래 단일 위치)
 * ───────────────────────────────────────────── */
.lec-download-card-wrapper--below-video {
	max-width: 920px;
	margin: 0 auto var(--space-xl);
}
.lec-download-card {
	display: block;
}

/* ── Heading — 카운트 태그(우측 상단) + 멀티라인 타이틀 ── */
.lec-download-card__heading {
	display: grid;
	grid-template-columns: 1fr;
	row-gap: var(--space-md);
	margin-bottom: var(--space-2xl);
}
.lec-download-card__count {
	justify-self: end;
	display: inline-flex;
	align-items: center;
	gap: var(--space-md);
	font-size: var(--font-xs);
	font-weight: 600;
	letter-spacing: 0.18em;
	color: var(--t-muted);
	text-transform: uppercase;
	font-feature-settings: 'tnum';
}
.lec-download-card__count::before {
	content: '';
	display: block;
	width: 40px;
	height: 1px;
	background: var(--gray-300);
}
.lec-download-card__title {
	margin: 0;
	font-size: clamp(26px, 3.2vw, 38px);
	font-weight: 700;
	line-height: 1.25;
	color: var(--t-main);
	letter-spacing: -0.025em;
}
.lec-download-card__title span {
	display: block;
}

/* ── List (numbered editorial rows) ── */
.lec-download-card__list {
	counter-reset: dl-counter;
	display: block;
}

/* ── Item — 번호(::before) + 본문 + 액션 ── */
.lec-download-card__item {
	counter-increment: dl-counter;
	display: grid;
	grid-template-columns: 56px 1fr auto;
	align-items: center;
	column-gap: var(--space-lg);
	padding: var(--space-lg) var(--space-md);
	border-top: 1px solid var(--gray-200);
	background: transparent;
	color: var(--t-main);
	text-decoration: none;
	transition: background var(--transition-fast);
}
.lec-download-card__item:hover,
.lec-download-card__item:focus-visible {
	background: var(--bg-subtle);
	color: var(--t-main);
	outline: none;
}
.lec-download-card__item::before {
	content: counter(dl-counter, decimal-leading-zero);
	font-size: 22px;
	font-weight: 500;
	line-height: 1;
	color: var(--t-muted);
	letter-spacing: -0.01em;
	font-feature-settings: 'tnum';
	transition: color var(--transition-fast);
}
.lec-download-card__item:hover::before {
	color: var(--t-main);
}

/* ── Body (filename + meta) ── */
.lec-download-card__body {
	min-width: 0;
}
.lec-download-card__name {
	margin: 0;
	font-size: var(--font-md);
	font-weight: 700;
	line-height: 1.4;
	color: var(--t-main);
	word-break: break-all;
}
.lec-download-card__meta {
	display: inline-block;
	margin-top: 4px;
	font-size: var(--font-xs);
	font-weight: 500;
	color: var(--t-muted);
}

/* ── Action — 텍스트 + 화살표 (버튼 박스 없음) ── */
.lec-download-card__action {
	display: inline-flex;
	align-items: center;
	gap: var(--space-sm);
	font-size: var(--font-sm);
	font-weight: 600;
	color: var(--primary);
	white-space: nowrap;
	transition: color var(--transition-fast), gap var(--transition-fast);
}
.lec-download-card__action i {
	font-size: 12px;
	transition: transform var(--transition-fast);
}
.lec-download-card__item:hover .lec-download-card__action,
.lec-download-card__item:focus-visible .lec-download-card__action {
	color: var(--primary-dark);
	gap: 12px;
}
.lec-download-card__item:hover .lec-download-card__action i {
	transform: translateY(2px); /* down arrow lifts ↓ */
}

/* ── Resource 변형 (보조 액션) ── */
.lec-download-card__item--resource .lec-download-card__action {
	color: var(--t-muted);
}
.lec-download-card__item--resource:hover .lec-download-card__action,
.lec-download-card__item--resource:focus-visible .lec-download-card__action {
	color: var(--t-main);
}
.lec-download-card__item--resource:hover .lec-download-card__action i {
	transform: translateX(3px); /* right arrow → */
}

/* ── Locked 변형 ── */
.lec-download-card__item--locked .lec-download-card__action {
	color: var(--gray-600);
}
.lec-download-card__item--locked:hover .lec-download-card__action,
.lec-download-card__item--locked:focus-visible .lec-download-card__action {
	color: var(--t-main);
}
.lec-download-card__item--locked:hover .lec-download-card__action i {
	transform: translateX(3px);
}

/* ── 모바일 — 액션 다음 줄로 ── */
@media (max-width: 640px) {
	.lec-download-card__item {
		grid-template-columns: 40px 1fr;
		row-gap: var(--space-sm);
	}
	.lec-download-card__action {
		grid-column: 1 / -1;
		justify-self: end;
	}
	.lec-download-card__count::before {
		width: 24px;
	}
}

/* ── 모바일 사이드바 (PC에서 숨김) ── */
.lec-mobile-sidebar {
	display: none;
}

/* ── 모바일 TOC (details) ── */
.lec-toc-mobile,
.lec-mobile-section {
	margin: 0 0 var(--space-md);
	border: 1px solid var(--gray-200);
	border-radius: var(--radius-lg);
	overflow: hidden;
}
.lec-toc-mobile > summary,
.lec-mobile-section > summary {
	display: flex;
	gap: var(--space-sm);
	align-items: center;
	padding: var(--space-md) var(--space-lg);
	background: var(--bg-subtle);
	cursor: pointer;
	font-weight: 600;
	color: var(--text-primary);
	list-style: none;
}
.lec-toc-mobile > summary::-webkit-details-marker,
.lec-mobile-section > summary::-webkit-details-marker {
	display: none;
}
.lec-toc-mobile > summary i:first-child,
.lec-mobile-section > summary i:first-child {
	color: var(--primary);
}
.lec-toc-mobile__icon {
	margin-left: auto;
	font-size: 12px;
	color: var(--text-muted);
	transition: transform var(--transition-base);
}
.lec-toc-mobile[open] .lec-toc-mobile__icon,
.lec-mobile-section[open] .lec-toc-mobile__icon {
	transform: rotate(180deg);
}
.lec-toc-mobile .lec-toc__list {
	padding: var(--space-md) var(--space-lg);
}
.lec-mobile-section .lec-related-mini {
	padding: var(--space-md) var(--space-lg);
}

/* ─────────────────────────────────────────────
 * 섹션 (강의 노트 / 질문 & 댓글)
 * ───────────────────────────────────────────── */
.lec-comments-section {
	margin-top: var(--space-2xl);
}

/* ── 강의 노트 본문 접기/펼치기 ── */
.lec-notes {
	position: relative;
}


/* ── 본문 (강의 노트) ── */
.lec-body {
	font-size: 16px;
	line-height: 1.85;
	color: var(--text-primary);
	min-width: 0;
	max-width: 100%;
	overflow-wrap: anywhere;
	word-break: break-word;
}
.lec-body h2 {
	margin: var(--space-2xl) 0 var(--space-md);
	font-size: 26px;
	font-weight: 800;
	line-height: 1.35;
	color: var(--text-primary);
}
.lec-body > :first-child,
.lec-body > :first-child > :first-child {
	margin-top: 0;
}
.lec-body h3 {
	position: relative;
	margin: var(--space-2xl) 0 var(--space-md);
	padding: var(--space-md) 0 var(--space-sm) var(--space-lg);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--text-primary);
	border-bottom: 2px solid var(--primary-light);
	scroll-margin-top: 90px;
}
.lec-body h3::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-30%);
	width: 6px;
	height: 26px;
	background: var(--primary);
	border-radius: var(--radius-sm);
}
.lec-body h5 {
	margin: var(--space-xl) 0 var(--space-lg);
	padding-left: var(--space-nm, 12px);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.45;
	color: var(--text-primary);
	border-left: 4px solid var(--primary);
	scroll-margin-top: 90px;
}
/* 제목 직후 첫 본문 요소에 추가 호흡감 — 일반 본문 흐름은 영향 없음 */
/* p는 16px (강한 호흡), 이미지는 8px (큰 시각 블록이라 적당히) */
.lec-body h3 + p,
.lec-body h5 + p {
	margin-top: var(--space-md);
}
.lec-body h3 + img,
.lec-body h5 + img,
.lec-body h3 + figure,
.lec-body h5 + figure {
	margin-top: var(--space-sm);
}
.lec-body p {
	margin: 0 0 var(--space-md);
}
.lec-body picture,
.lec-body video,
.lec-body iframe {
	max-width: 100%;
	height: auto;
}
/* figure / wp-caption / wp-block-image — 좌측 정렬 + WP 인라인 width 무력화 */
.lec-body figure,
.lec-body .wp-block-image,
.lec-body .wp-caption {
	width: auto !important; /* WP의 [caption width="600"] 자동 출력 무력화 */
	max-width: 100%;
	height: auto;
	margin: var(--space-lg) 0;
	text-align: left;
}
.lec-body figure img,
.lec-body .wp-block-image img,
.lec-body .wp-caption img,
.lec-body .wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0;
	max-width: 100%;
}
.lec-body figcaption,
.lec-body .wp-caption-text {
	margin-top: var(--space-sm);
	font-size: 13px;
	line-height: 1.5;
	color: var(--text-muted);
	text-align: left;
}
.lec-body pre {
	max-width: 100%;
	overflow-x: auto;
	overflow-wrap: normal;
	word-break: normal;
}
/* 본문 표 — 인라인 style(background/color/width/height) 무력화 + 통일 디자인
 *   - 모서리 둥글게 + 미세 그림자 + 헤더 행 강조 + 짝수 행 zebra
 *   - 첫 행을 헤더로 인식 (thead 없이 tbody 첫 행이 헤더인 게시글이 다수)
 *   - 인라인 text-align 은 보존 (작성자 의도)
 */
.lec-body table {
	width: 100%;
	max-width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: var(--space-md) 0;
	border-radius: var(--radius-nm);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	border: 1px solid var(--gray-200);
	background: #fff;
	font-size: 15px;
	line-height: 1.65;
	height: auto !important;
	table-layout: auto;
}
.lec-body table tr {
	height: auto !important;
}
.lec-body table td,
.lec-body table th {
	padding: 12px 16px;
	border-bottom: 1px solid var(--gray-200);
	background-color: transparent !important;
	color: var(--text-primary) !important;
	width: auto !important;
	height: auto !important;
	vertical-align: top;
	word-break: keep-all;
	overflow-wrap: break-word;
}
.lec-body table tr:last-child td,
.lec-body table tr:last-child th {
	border-bottom: none;
}
/* 헤더 행 — <thead> 또는 <tbody> 첫 행 자동 인식 */
.lec-body table thead tr td,
.lec-body table thead tr th,
.lec-body table > tbody > tr:first-child > td,
.lec-body table > tbody > tr:first-child > th {
	background-color: var(--bg-subtle) !important;
	color: var(--text-primary) !important;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: -0.1px;
	border-bottom: 2px solid var(--gray-200);
}
/* zebra — 헤더 제외, 짝수 본문 행 미세 배경 */
.lec-body table > tbody > tr:nth-child(2n+1):not(:first-child) > td {
	background-color: rgba(0, 0, 0, 0.015) !important;
}
/* hover */
.lec-body table > tbody > tr:not(:first-child):hover > td {
	background-color: var(--primary-light) !important;
	transition: background-color var(--transition-fast);
}
/* 첫 컬럼이 라벨인 패턴 — 살짝 강조 */
.lec-body table > tbody > tr:not(:first-child) > td:first-child strong {
	color: var(--text-primary);
}
/* 모바일 */
@media (max-width: 768px) {
	.lec-body table {
		font-size: 14px;
	}
	.lec-body table td,
	.lec-body table th {
		padding: 10px 12px;
	}
}

/* bold + underline 동시 강조 → underline 제거 (중복 강조 정리)
 *   - 부모-자식 어느 쪽에 underline 이 들어가도 모두 무력화
 *   - underline 단독 강조는 유지 (bold 동반인 경우만)
 */
.lec-body strong [style*="text-decoration: underline"],
.lec-body b [style*="text-decoration: underline"],
.lec-body strong[style*="text-decoration: underline"],
.lec-body b[style*="text-decoration: underline"],
.lec-body [style*="text-decoration: underline"]:has(strong),
.lec-body [style*="text-decoration: underline"]:has(b),
.lec-body strong u,
.lec-body b u,
.lec-body u strong,
.lec-body u b,
.lec-body u:has(strong),
.lec-body u:has(b),
.lec-body strong:has(u),
.lec-body b:has(u) {
	text-decoration: none !important;
}

.lec-body img {
	max-width: 100%;
	max-height: 500px;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: var(--radius-nm);
	box-shadow: var(--shadow-sm);
	margin: var(--space-md) 0;
	display: block;
}
.lec-body figcaption {
	margin-top: var(--space-xs);
	font-size: 13px;
	color: var(--text-muted);
	text-align: center;
}
/* ─────────────────────────────────────────────
 * 본문 리스트 (ol/ul) — 자동 단계 배지 + 컬러 도트
 *
 *  ol  → primary 원 배지 + 좌측 가이드 라인 (절차/단계 강조)
 *  ul  → primary 도트 (항목/체크)
 *  중첩 ol → 데시멀, 중첩 ul → 빈 원
 *  Escape hatch: <ol class="plain"> 사용 시 기본 데시멀 리스트
 *  기존 <div class="numbered-list"> wrapper 글들은 글로벌 디자인 유지
 * ───────────────────────────────────────────── */

/* === ol: 자동 단계 배지 === */
.lec-body ol {
	counter-reset: lec-step;
	list-style: none;
	position: relative;
	margin: var(--space-xl) 0;
	padding: 0 0 0 56px;
}
.lec-body ol::before {
	content: '';
	position: absolute;
	left: 17px;
	top: 22px;
	bottom: 22px;
	width: 2px;
	background: var(--primary-light);
	z-index: 0;
}
.lec-body ol > li {
	counter-increment: lec-step;
	position: relative;
	margin: 0 0 var(--space-lg);
	padding: 0 0 var(--space-sm); /* 위 padding 제거 — 배지 ::before 와 텍스트 시작점 일치 */
	line-height: 1.75;
}
.lec-body ol > li:last-child {
	margin-bottom: 0;
}
.lec-body ol > li::before {
	content: counter(lec-step);
	position: absolute;
	left: -56px;
	top: -4px;
	width: 36px;
	height: 36px;
	background: var(--primary);
	color: #fff;
	border-radius: var(--radius-full);
	font-size: 14px;
	font-weight: 700;
	line-height: 36px;
	text-align: center;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	z-index: 1;
}

/* === ul: 컬러 도트 === */
.lec-body ul {
	list-style: none;
	margin: var(--space-md) 0;
	padding-left: var(--space-xl);
}
.lec-body ul li {
	position: relative;
	margin-bottom: var(--space-sm);
	padding-left: var(--space-md);
	line-height: 1.7;
}
.lec-body ul li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 11px;
	width: 6px;
	height: 6px;
	background: var(--primary);
	border-radius: var(--radius-full);
}

/* === 중첩 ol === */
.lec-body ol ol {
	counter-reset: lec-substep;
	margin: var(--space-sm) 0 0;
	padding-left: var(--space-xl);
}
.lec-body ol ol::before {
	display: none;
}
.lec-body ol ol > li {
	counter-increment: lec-substep;
	padding-left: var(--space-md);
}
.lec-body ol ol > li::before {
	content: counter(lec-substep, decimal) '.';
	position: absolute;
	left: 0;
	top: 0;
	width: auto;
	height: auto;
	background: transparent;
	color: var(--primary);
	font-size: 15px;
	font-weight: 700;
	line-height: inherit;
	text-align: left;
	box-shadow: none;
}

/* === 중첩 ul === */
.lec-body ul ul {
	margin-top: var(--space-xs);
}
.lec-body ul ul li::before {
	background: transparent;
	border: 1.5px solid var(--primary);
	width: 5px;
	height: 5px;
	top: 10px;
}

/* === ol 안의 ul === */
.lec-body ol ul {
	margin: var(--space-sm) 0;
}

/* === Escape hatch: <ol class="plain"> 사용 시 기본 데시멀 === */
.lec-body ol.plain {
	counter-reset: none;
	list-style: decimal;
	padding-left: var(--space-xl);
}
.lec-body ol.plain::before {
	display: none;
}
.lec-body ol.plain > li {
	counter-increment: none;
	padding: 0;
	margin-bottom: var(--space-xs);
}
.lec-body ol.plain > li::before {
	display: none;
}

/* === 기존 .numbered-list wrapper: 글로벌 스타일 유지 === */
.lec-body .numbered-list ol {
	padding: 0;
	margin: 0 0 20px 2em;
	counter-reset: li;
}
.lec-body .numbered-list ol::before {
	display: none;
}
.lec-body .numbered-list ol > li {
	counter-increment: li;
	margin: 20px 0;
	padding: 0;
}
.lec-body .numbered-list ol > li::before {
	content: counter(li);
	background: #00aadd;
	color: #fff;
	width: 2em;
	height: 2em;
	border-radius: 2em;
	line-height: 1.9em;
	text-align: center;
	font-size: var(--font-base);
	font-weight: 400;
	left: auto;
	top: auto;
	margin-top: -0.1rem;
	margin-left: -2.3rem;
	box-shadow: none;
	position: absolute;
}
.lec-body blockquote {
	margin: var(--space-lg) 0;
	padding: var(--space-md) var(--space-lg);
	background: var(--bg-subtle);
	border-left: 4px solid var(--primary);
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
	color: var(--text-secondary);
	font-style: italic;
}
.lec-body code {
	padding: 2px 6px;
	background: var(--gray-100);
	border-radius: var(--radius-sm);
	font-family: 'JetBrains Mono', 'D2Coding', Consolas, monospace;
	font-size: 0.9em;
	color: var(--primary-dark);
}
.lec-body a {
	color: var(--primary);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.lec-body a:hover {
	color: var(--primary-dark);
}

/* ── AdSense 광고 컨테이너 ── */
.lec-ad-banner {
	margin: var(--space-2xl) 0;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	box-sizing: border-box;
	max-width: 100%;
}
.lec-ad-banner ins.adsbygoogle {
	max-width: 100%;
}
/* 영상 ↔ 본문 사이 큰 배너 (수평 디스플레이) */
.lec-ad-banner--hero {
	max-width: 970px;
	margin: 0 auto var(--space-2xl);
	min-height: 90px;
}
/* 본문끝 ↔ 댓글 사이 광고 (수평 디스플레이) */
.lec-ad-banner--midcontent {
	max-width: 920px;
	margin: var(--space-2xl) auto;
	min-height: 90px;
}
/* 사이드바 하단 세로 배너 (수직 디스플레이) */
.lec-ad-banner--vertical {
	margin: 0;
	min-height: 600px;
}


/* ─────────────────────────────────────────────
 * Floating Stack: TOC + 질문 CTA
 * 세로 광고 통과 시 fade-in sticky
 * 컨테이너에 position: fixed → 안의 TOC / CTA는 일반 블록처럼 스택
 * ───────────────────────────────────────────── */
.lec-floating-stack {
	position: fixed;
	top: calc(var(--lec-header-offset, 80px) + var(--space-xl));
	width: 340px;
	z-index: 100;
	display: flex;
	flex-direction: column;
	gap: var(--space-md);
	opacity: 0;
	transform: translateY(-8px);
	pointer-events: none;
	transition: opacity 0.3s ease, transform 0.3s ease;
}
.lec-floating-stack[hidden] {
	display: none;
}
.lec-floating-stack.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.lec-floating-toc {
	background: #fff;
	border: 1px solid var(--gray-200);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	overflow: hidden;
}
.lec-floating-toc__header {
	display: flex;
	align-items: center;
	gap: var(--space-xs);
	padding: var(--space-md) var(--space-lg);
	border-bottom: 1px solid var(--gray-100);
	font-size: 14px;
	font-weight: 700;
	color: var(--text-primary);
}
.lec-floating-toc__header i {
	color: var(--primary);
}
.lec-floating-toc__nav {
	padding: var(--space-sm);
	max-height: 300px;
	overflow-y: auto;
	overscroll-behavior: contain;
}
.lec-floating-toc__nav::-webkit-scrollbar {
	width: 6px;
}
.lec-floating-toc__nav::-webkit-scrollbar-thumb {
	background: var(--gray-300);
	border-radius: var(--radius-full);
}
.lec-floating-toc__nav::-webkit-scrollbar-thumb:hover {
	background: var(--gray-400);
}

/* Floating CTA — TOC 아래 질문 유도 버튼 */
.lec-floating-cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-sm);
	width: 100%;
	padding: var(--space-md) var(--space-lg);
	background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
	border: none;
	border-radius: var(--radius-lg);
	color: var(--text-white);
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.01em;
	cursor: pointer;
	box-shadow: var(--shadow-md);
	transition: transform var(--transition-fast),
		box-shadow var(--transition-fast),
		filter var(--transition-fast);
}
.lec-floating-cta:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-lg);
	filter: brightness(1.05);
	color: var(--text-white);
}
.lec-floating-cta:active {
	transform: translateY(0);
	box-shadow: var(--shadow-sm);
}
.lec-floating-cta i {
	font-size: 16px;
}

/* 플로팅 스택 사각형 광고 (TOC + CTA 아래) */
.lec-floating-ad {
	background: #fff;
	border: 1px solid var(--gray-200);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	padding: var(--space-sm);
	overflow: hidden;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.lec-floating-ad ins.adsbygoogle {
	width: 100%;
}

@media (max-width: 1024px) {
	.lec-floating-stack {
		display: none !important;
	}
}
.lec-ad-banner ins.adsbygoogle {
	width: 100%;
}

/* 본문 중간 인아티클 광고 (the_content 필터로 자동 삽입) */
.lec-ad-inarticle {
	display: block;
	margin: var(--space-xl) 0;
	min-height: 100px;
	clear: both;
}
.lec-ad-inarticle ins.adsbygoogle {
	width: 100%;
}

/* 빈 상태 */
.lec-empty {
	padding: var(--space-xl) var(--space-md);
	text-align: center;
	color: var(--text-muted);
	font-size: 13px;
}

/* ─────────────────────────────────────────────
 * 반응형
 * ───────────────────────────────────────────── */

/* 1024px 이하 — 사이드바 숨김, 단일 컬럼 */
@media (max-width: 1024px) {
	.lec-grid {
		flex-direction: column;
		align-items: stretch; /* column 모드에서 자식이 100% 폭 차지 */
	}
	.lec-sidebar--right {
		display: none;
	}
	.lec-mobile-sidebar {
		display: block;
		margin: var(--space-lg) 0;
	}
	/* 영상 직후 광고는 모바일/태블릿에서 숨김 (광고 과다 회피) */
	.lec-ad-banner--hero {
		display: none;
	}
	/* 본문 리스트 — 태블릿/큰 모바일 배지 32px 축소 */
	.lec-body ol {
		padding-left: 50px;
	}
	.lec-body ol::before {
		left: 15px;
		top: 20px;
		bottom: 20px;
	}
	.lec-body ol > li::before {
		left: -50px;
		width: 32px;
		height: 32px;
		font-size: 13px;
		line-height: 32px;
	}
}

/* 모바일 */
@media (max-width: 640px) {
	.lec-page {
		padding: var(--space-md) var(--space-lg);
	}
	.lec-hero {
		padding: var(--space-md) 0 var(--space-sm);
		margin-bottom: var(--space-lg);
	}
	.lec-hero__title {
		font-size: 26px;
	}
	.lec-hero__category {
		font-size: 12px;
	}
	.lec-summary-card {
		padding: var(--space-lg) var(--space-md);
	}
	.lec-summary-card__lead {
		font-size: 16px;
	}
	.lec-summary-card__desc {
		font-size: 14.5px;
	}
	.lec-video-stage {
		padding: var(--space-md) var(--space-sm);
		border-radius: var(--radius-md);
	}
	.lec-timeline__header {
		padding: var(--space-sm) var(--space-md);
		font-size: 13px;
	}
	.lec-timeline__item {
		padding: 9px var(--space-md);
		gap: var(--space-sm);
	}
	.lec-timeline__time {
		min-width: 52px;
		font-size: 12px;
	}
	.lec-timeline__title {
		font-size: 13px;
	}
	.lec-timeline__list {
		max-height: 260px;
	}
	.lec-hero__meta {
		gap: var(--space-sm);
	}
	.lec-hero__meta-item + .lec-hero__meta-item {
		padding-left: var(--space-sm);
	}
	.lec-body {
		font-size: 17px;
		line-height: 1.85;
	}
	.lec-body h3 {
		font-size: 21px;
	}
	.lec-body h5 {
		font-size: 17px;
	}
	.lec-body p {
		margin-bottom: 1em;
	}
	/* 본문 리스트 모바일 조정 — 배지 축소 */
	.lec-body ol {
		padding-left: 44px;
	}
	.lec-body ol::before {
		left: 13px;
		top: 18px;
		bottom: 18px;
	}
	.lec-body ol > li::before {
		left: -44px;
		width: 28px;
		height: 28px;
		font-size: 12px;
		line-height: 28px;
	}
	.lec-body ol > li {
		margin-bottom: var(--space-sm);
	}
	.lec-body ul li {
		margin-bottom: var(--space-xs);
		padding-left: var(--space-sm);
	}
	.lec-content-tabs__btn {
		padding: var(--space-sm) var(--space-md);
		font-size: 14px;
	}
	.lec-ad-banner {
		margin: var(--space-xl) 0;
	}
	.lec-ad-banner--hero,
	.lec-ad-banner--midcontent {
		min-height: 60px;
	}
}

/* 작은 모바일 (≤480px) — 배지 24px, 본문 가용 폭 확보 */
@media (max-width: 480px) {
	.lec-body ol {
		padding-left: 36px;
	}
	.lec-body ol::before {
		left: 11px;
		top: 16px;
		bottom: 16px;
	}
	.lec-body ol > li::before {
		left: -36px;
		width: 24px;
		height: 24px;
		font-size: 11px;
		line-height: 24px;
	}
	.lec-body ul {
		padding-left: var(--space-md);
	}
}