/* ============================================================
   메인 홈 V3 — "일렬 구조 + 실시간 활동 티커"
   (design_handoff_main_home_v3 이식)
   ------------------------------------------------------------
   토큰: DS v2.1 Deep Jade 를 .mv3 스코프로 재정의 — 전역 :root 와 격리
   (전역 --primary/--shadow-lg/--radius 값이 달라 상속 금지). 페이지 배경 순백.
   규칙: 카드 아웃라인 금지(그림자+여백) · 제이드 절제(펄스/바로가기 hover/primary CTA)
   · 검색·배너 CTA·라이브 히어로는 잉크(gray-900) · 배지 대부분 neutral · 이모지 금지.
   상시 모션 예외 2종: 펄스 점(dotPulse 2.2s) · 티커 마퀴(45s, hover 정지).
   ============================================================ */

@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('../fonts/InterVariable-latin.woff2') format('woff2-variations');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
		U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── 페이지 스코프: GP 컨테이너 해제 + 순백 ── */
body.page-template-page-main-v3 {
	background: #fff;
	overflow-x: clip;
}
body.page-template-page-main-v3 #page.grid-container { max-width: 100%; }
body.page-template-page-main-v3 #page,
body.page-template-page-main-v3 .site-content { background: #fff; }

/* ── 토큰(스코프 재정의) ── */
.mv3 {
	--primary-50:  #EEF9F6;
	--primary-100: #D2F1E7;
	--primary-500: #059669;
	--primary-600: #047E57;
	--primary-700: #036546;
	--amber-50:  #FAF2E1;
	--amber-100: #F1DEB0;
	--amber-500: #C5870F;
	--amber-700: #95650A;
	--gray-50:  #F7F7F5;
	--gray-100: #F0F0ED;
	--gray-200: #E6E6E2;
	--gray-300: #D4D4CF;
	--gray-500: #8A8A85;
	--gray-700: #45453F;
	--gray-900: #1B1B18;
	--shadow-xs:    0 1px 2px rgba(17, 17, 16, 0.04);
	--shadow-sm:    0 1px 2px rgba(17, 17, 16, 0.04), 0 2px 6px rgba(17, 17, 16, 0.04);
	--shadow-md:    0 1px 3px rgba(17, 17, 16, 0.05), 0 6px 20px rgba(17, 17, 16, 0.06);
	--shadow-lg:    0 2px 8px rgba(17, 17, 16, 0.06), 0 18px 44px rgba(17, 17, 16, 0.09);
	--shadow-hover: 0 2px 6px rgba(17, 17, 16, 0.06), 0 14px 36px rgba(17, 17, 16, 0.11);
	--font-kr: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', system-ui, sans-serif;
	--font-en: 'Inter', 'Pretendard', system-ui, sans-serif;
	--font-mono: 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;

	font-family: var(--font-kr);
	color: var(--gray-700);
	width: 100%;
	min-width: 0;
	max-width: 100%;
	-webkit-font-smoothing: antialiased;
}
.mv3 *, .mv3 *::before, .mv3 *::after { box-sizing: border-box; }
.mv3 a { text-decoration: none; }
.mv3 [hidden] { display: none !important; }
.mv3 img:hover { -webkit-filter: none !important; filter: none !important; cursor: pointer; }

/* ── 공통 컴포넌트 ── */
.mv3-wrap { max-width: 1440px; margin: 0 auto; padding: 0 28px; width: 100%; }
.mv3-eyebrow {
	display: inline-block; font-family: var(--font-en);
	font-size: 12px; font-weight: 600; letter-spacing: 0.16em;
	text-transform: uppercase; color: var(--gray-500);
}
.mv3-h2 {
	font-family: var(--font-kr); font-size: 22px; font-weight: 700;
	color: var(--gray-900); letter-spacing: -0.02em; margin: 0;
}
.mv3 a.mv3-more {
	font-size: 13px; font-weight: 600; color: var(--gray-700);
	white-space: nowrap; flex: none; transition: color .15s ease;
}
.mv3 a.mv3-more:hover { color: var(--gray-900); }
.mv3-shead { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; }
.mv3-shead--center { align-items: center; }
.mv3-shead .mv3-eyebrow { margin-bottom: 8px; }

.mv3-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 11px 22px; height: 42px; font-family: var(--font-kr);
	font-size: 14px; font-weight: 600; border-radius: 6px; border: none;
	cursor: pointer; transition: background-color .18s ease, color .18s ease, transform .18s ease;
	white-space: nowrap; text-decoration: none;
}
.mv3-btn:focus { outline: none; }
.mv3-btn:focus-visible { outline: 2px solid var(--gray-300); outline-offset: 2px; }
.mv3-btn-primary { background: var(--primary-500); color: #fff; }
.mv3-btn-primary:hover { background: var(--primary-700); color: #fff; }
.mv3-btn-primary:active { transform: translateY(1px); }
.mv3-btn-secondary { background: var(--gray-100); color: var(--gray-900); }
.mv3-btn-secondary:hover { background: var(--gray-200); color: var(--gray-900); }
.mv3-btn-secondary:active { transform: translateY(1px); }

.mv3-card {
	background: #fff; border-radius: 8px; box-shadow: var(--shadow-md);
	transition: box-shadow .2s ease, transform .2s ease;
}
.mv3-card--tap { cursor: pointer; }
.mv3-card--tap:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }

.mv3-badge {
	display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 2px;
	font-size: 11px; font-weight: 600; letter-spacing: 0.04em;
	font-family: var(--font-en); white-space: nowrap;
}
.mv3-badge-amber   { background: var(--amber-50); color: var(--amber-700); }
.mv3-badge-error   { background: #FBE6E6;         color: #A82F2F; }
.mv3-badge-neutral { background: var(--gray-100); color: var(--gray-700); }
.mv3-badge-tier    { background: var(--gray-900); color: #fff; gap: 3px; } /* 토요 라이브 등급 배지(Premium/Plus) */
.mv3-crown         { color: var(--amber-500); flex: 0 0 auto; }            /* 금색 왕관 */
.mv3-amber-dot {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 12px; font-weight: 600; color: var(--gray-700);
}
.mv3-amber-dot::before {
	content: ""; flex: none; width: 8px; height: 8px;
	border-radius: 9999px; background: var(--amber-500);
}

/* 펄스 점(실시간 상태 표시 한정) */
.mv3-pulse { position: relative; flex: none; display: inline-flex; width: 9px; height: 9px; }
.mv3-pulse i, .mv3-pulse::after {
	content: ""; position: absolute; inset: 0; border-radius: 9999px; background: var(--primary-500);
}
.mv3-pulse::after { animation: mv3DotPulse 2.2s ease-out infinite; }
@keyframes mv3DotPulse {
	0%   { transform: scale(1);   opacity: .5; }
	70%  { transform: scale(2.4); opacity: 0; }
	100% { transform: scale(2.4); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .mv3-pulse::after { animation: none; } }

/* ── 라이브 테이크오버 히어로(방송 중) ── */
.mv3-livehero { background: var(--gray-900); }
.mv3-livehero-in {
	max-width: 1440px; margin: 0 auto; padding: 48px 28px;
	display: flex; gap: 48px; align-items: center; flex-wrap: wrap;
}
.mv3-livehero-main { flex: 1 1 480px; min-width: 0; }
.mv3-live-now {
	display: inline-flex; align-items: center; gap: 9px;
	font-family: var(--font-en); font-size: 12px; font-weight: 700;
	letter-spacing: 0.14em; color: #fff;
}
.mv3-livehero-title {
	font-size: 34px; font-weight: 700; letter-spacing: -0.025em;
	line-height: 1.3; color: #fff; margin: 14px 0 0;
}
.mv3-livehero-desc { font-size: 15px; color: rgba(255, 255, 255, 0.75); line-height: 1.6; margin-top: 12px; }
.mv3-livehero-meta { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
.mv3-livehero-meta .mv3-viewers { font-size: 13px; color: rgba(255, 255, 255, 0.7); }
.mv3-livehero-meta .mv3-viewers b { color: #fff; font-family: var(--font-en); font-feature-settings: 'tnum' 1; }
.mv3-live-pill {
	font-size: 11px; font-weight: 700; color: var(--gray-900);
	background: #fff; padding: 3px 9px; border-radius: 2px;
}
.mv3-live-pill--members { background: rgba(255, 255, 255, 0.18); color: #fff; }
.mv3-livehero-cta { display: flex; gap: 10px; margin-top: 22px; flex-wrap: wrap; }
.mv3 a.mv3-live-enter {
	padding: 12px 26px; border-radius: 6px; background: var(--primary-500);
	color: #fff; font-size: 14px; font-weight: 600; transition: background .15s;
}
.mv3 a.mv3-live-enter:hover { background: var(--primary-700); color: #fff; }
.mv3 a.mv3-live-schedule {
	padding: 12px 20px; border-radius: 6px; background: rgba(255, 255, 255, 0.12);
	color: #fff; font-size: 14px; font-weight: 600; transition: background .15s;
}
.mv3 a.mv3-live-schedule:hover { background: rgba(255, 255, 255, 0.2); color: #fff; }
.mv3-livehero-thumb {
	width: 560px; max-width: 100%; flex: none; position: relative; aspect-ratio: 16/9;
	background: rgba(255, 255, 255, 0.08); border-radius: 12px; overflow: hidden;
	display: flex; align-items: center; justify-content: center; color: rgba(255, 255, 255, 0.35);
}
.mv3-livehero-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mv3-livehero-thumb .mv3-live-tag {
	position: absolute; left: 14px; top: 14px; display: inline-flex; align-items: center; gap: 7px;
	background: #fff; color: var(--gray-900); padding: 5px 11px; border-radius: 2px;
	font-size: 11px; font-weight: 700; letter-spacing: 0.1em; font-family: var(--font-en);
}
/* 라이브 모드 축소 검색바 */
.mv3-livesearch { text-align: center; padding: 30px 28px 0; }
.mv3-livesearch .mv3-search { max-width: 520px; padding: 6px 6px 6px 22px; }
.mv3-livesearch .mv3-search-btn { height: 42px; padding: 0 24px; }

/* ── 평상시 검색 히어로 ── */
.mv3-hero { max-width: 840px; margin: 0 auto; padding: 56px 28px 0; text-align: center; }
.mv3-hero-logo { height: 24px; width: auto; display: block; margin: 0 auto 20px; }
.mv3-h1 {
	font-family: var(--font-kr); font-size: 40px; line-height: 1.2;
	letter-spacing: -0.03em; font-weight: 700; color: var(--gray-900); margin: 0 0 26px;
}
.mv3-search {
	display: flex; align-items: center; gap: 10px; background: #fff;
	border-radius: 9999px; box-shadow: var(--shadow-md);
	padding: 8px 8px 8px 24px; max-width: 640px; margin: 0 auto;
}
.mv3-search-ic { color: var(--gray-500); display: flex; flex: none; }
.mv3-search input[type="text"] {
	flex: 1; min-width: 0; border: none; outline: none; background: transparent;
	font-size: 16px; font-family: inherit; color: var(--gray-900);
	height: auto; padding: 0; margin: 0; box-shadow: none;
}
.mv3-search input[type="text"]:focus { border: none; box-shadow: none; background: transparent; }
.mv3-search input[type="text"]::placeholder { color: var(--gray-500); }
/* 검색 버튼 = 잉크 */
.mv3-search-btn {
	flex: none; display: inline-flex; align-items: center; justify-content: center;
	border: none; cursor: pointer; border-radius: 9999px; height: 46px; padding: 0 26px;
	background: var(--gray-900); color: #fff; font-family: var(--font-kr);
	font-size: 14px; font-weight: 600; white-space: nowrap; transition: background-color .15s ease;
}
.mv3-search-btn:hover { background: #000; color: #fff; }
.mv3-search-btn:focus { outline: none; }
.mv3-search-btn:focus-visible { outline: 2px solid var(--gray-300); outline-offset: 2px; }

/* 실시간 인기 */
.mv3-trend { display: flex; align-items: baseline; justify-content: center; gap: 14px; margin-top: 18px; flex-wrap: wrap; }
.mv3-trend-label { flex: none; font-size: 12px; font-weight: 600; color: var(--gray-500); letter-spacing: 0.02em; }
.mv3-trend-sep { flex: none; width: 1px; height: 11px; background: var(--gray-200); align-self: center; }
.mv3-trend-list { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; justify-content: center; }
.mv3 a.mv3-trend-item { display: inline-flex; align-items: baseline; gap: 6px; transition: opacity .15s ease; }
.mv3 a.mv3-trend-item:hover { opacity: .72; }
.mv3-trend-rank { font-family: var(--font-en); font-size: 11.5px; font-weight: 700; color: var(--gray-900); font-feature-settings: 'tnum' 1; }
.mv3-trend-rank.is-muted { color: var(--gray-500); }
.mv3-trend-term { font-size: 13.5px; font-weight: 500; color: var(--gray-700); }
.mv3 a.mv3-trend-item.is-top .mv3-trend-term { color: var(--gray-900); }

/* ── 바로가기(아이콘 온리) ── */
.mv3-quick-wrap { max-width: 900px; margin: 0 auto; padding: 30px 28px 0; }
.mv3-quick { display: flex; justify-content: center; gap: 6px; flex-wrap: wrap; }
.mv3 a.mv3-quick-item {
	display: flex; flex-direction: column; align-items: center; gap: 11px;
	width: 96px; padding: 12px 4px; color: var(--gray-900);
	transition: color .15s ease, transform .15s ease;
}
.mv3 a.mv3-quick-item:hover { color: var(--primary-600); transform: translateY(-2px); }
.mv3-quick-item svg { flex: none; }
.mv3-quick-label { font-size: 12.5px; font-weight: 600; color: var(--gray-700); }

/* ── 지금 오빠두에서 — 활동 티커(마퀴) ── */
.mv3-ticker { margin-top: 34px; }
.mv3-ticker-head { text-align: center; padding: 0 28px; }
.mv3-ticker-title-row { display: inline-flex; align-items: center; gap: 9px; }
.mv3-ticker-title { font-size: 18px; margin: 0; letter-spacing: -0.01em; color: var(--gray-900); font-weight: 700; }
.mv3-ticker-sub { font-size: 12.5px; color: var(--gray-500); margin-top: 4px; }
.mv3-tick-mask {
	overflow: hidden; margin-top: 16px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
.mv3-tick-track { display: flex; width: max-content; animation: mv3FeedH 72s linear infinite; }
.mv3-tick-mask:hover .mv3-tick-track { animation-play-state: paused; }
@keyframes mv3FeedH { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .mv3-tick-track { animation: none; } }
.mv3-tick-set { display: flex; gap: var(--space-md); margin-right: var(--space-md); }

/* 인프런형 카드 — 헤더(배지+시간) / 본문 제목 / 아바타+닉네임 */
.mv3-tick-card {
	width: 258px; flex: none; background: #fff; border-radius: var(--radius-md);
	border: 1px solid var(--gray-100); box-shadow: var(--shadow-sm); overflow: hidden;
	display: flex; flex-direction: column;
}
.mv3-tick-head {
	display: flex; justify-content: space-between; align-items: center;
	padding: 9px var(--space-md); background: var(--gray-100);
}
.mv3-tick-badge { font-size: 12px; font-weight: 700; letter-spacing: -0.01em; color: var(--gray-700); }
.mv3-tick-time { font-size: 11px; color: var(--gray-500); }
.mv3-tick-main { padding: 12px var(--space-md) 10px; flex: 1 0 auto; }
.mv3-tick-stars { font-size: 13px; line-height: 1; margin-bottom: 5px; letter-spacing: 1px; }
.mv3-tick-stars-on { color: var(--amber-500); }
.mv3-tick-stars-off { color: var(--gray-200); }
.mv3-tick-title {
	font-size: 13.5px; font-weight: 600; line-height: 1.5; color: var(--gray-900);
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	min-height: calc(1.5em * 2);
}
.mv3-tick-author {
	display: flex; align-items: center; gap: 8px;
	padding: 9px var(--space-md); border-top: 1px solid var(--gray-100);
}
.mv3-tick-ava {
	position: relative; overflow: hidden;
	width: 22px; height: 22px; border-radius: var(--radius-full); flex: none;
	display: flex; align-items: center; justify-content: center;
	font-size: 11px; font-weight: 700; color: var(--gray-600); background: var(--gray-100);
}
.mv3-tick-ava-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.mv3-tick-name { font-size: 12px; color: var(--gray-600); }
/* 링크형 카드 — 클릭 시 대상으로 이동 */
a.mv3-tick-card { text-decoration: none; color: inherit; }
.mv3-tick--link { cursor: pointer; transition: box-shadow var(--transition-fast), transform var(--transition-fast); }
.mv3-tick--link:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.mv3-tick--link:hover .mv3-tick-title { text-decoration: underline; text-underline-offset: 2px; }

/* 종류별 색 테마 — 헤더 배지·아바타 (color-mix 미지원 시 헤더는 회색 유지) */
.mv3-tick--watch     .mv3-tick-head { background: color-mix(in srgb, var(--color-info) 12%, #fff); }
.mv3-tick--watch     .mv3-tick-badge,
.mv3-tick--watch     .mv3-tick-ava { color: var(--color-info); background: color-mix(in srgb, var(--color-info) 16%, #fff); }
.mv3-tick--watch     .mv3-tick-badge { background: none; }
.mv3-tick--review    .mv3-tick-head { background: color-mix(in srgb, var(--amber-500) 14%, #fff); }
.mv3-tick--review    .mv3-tick-badge,
.mv3-tick--review    .mv3-tick-ava { color: var(--amber-700); background: color-mix(in srgb, var(--amber-500) 20%, #fff); }
.mv3-tick--review    .mv3-tick-badge { background: none; }
.mv3-tick--community .mv3-tick-head { background: color-mix(in srgb, var(--primary-500) 12%, #fff); }
.mv3-tick--community .mv3-tick-badge,
.mv3-tick--community .mv3-tick-ava { color: var(--primary-700); background: color-mix(in srgb, var(--primary-500) 16%, #fff); }
.mv3-tick--community .mv3-tick-badge { background: none; }
.mv3-tick--download  .mv3-tick-head { background: color-mix(in srgb, var(--color-navy) 10%, #fff); }
.mv3-tick--download  .mv3-tick-badge,
.mv3-tick--download  .mv3-tick-ava { color: var(--color-navy); background: color-mix(in srgb, var(--color-navy) 14%, #fff); }
.mv3-tick--download  .mv3-tick-badge { background: none; }

/* ── 본문 ── */
.mv3-body { padding-top: 48px; padding-bottom: 8px; }
.mv3-sec-gap { margin-top: 40px; }

/* 썸네일 공통 */
.mv3-thumb {
	position: relative; background: var(--gray-100); overflow: hidden;
	display: flex; align-items: center; justify-content: center; color: var(--gray-300);
}
.mv3-thumb--feat { aspect-ratio: 16/9; border-radius: 12px; box-shadow: var(--shadow-sm); }
.mv3-thumb--g    { aspect-ratio: 16/9; border-radius: 8px; }
.mv3-thumb--s    { aspect-ratio: 9/16; border-radius: 12px; }
.mv3-thumb--c    { aspect-ratio: 16/9; border-radius: 0; }
.mv3-thumb-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mv3-thumb-ph { position: relative; }
.mv3-tl { position: absolute; left: 14px; top: 14px; z-index: 1; }
.mv3-thumb--g .mv3-tl    { left: 8px; top: 8px; }
.mv3-thumb--c .mv3-tl    { left: 10px; top: 10px; }
.mv3-time {
	position: absolute; right: 12px; bottom: 12px; background: rgba(27, 27, 24, 0.82);
	color: #fff; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 4px;
	font-family: var(--font-mono); z-index: 1;
}
.mv3-time--sm { right: 7px; bottom: 7px; font-size: 10px; padding: 2px 5px; border-radius: 3px; }
.mv3-time--xs { right: 7px; bottom: 7px; font-size: 10px; padding: 2px 5px; border-radius: 3px; }

/* 무료 강의 — 대형 1 + 2×2 그리드 */
.mv3-free { display: flex; flex-wrap: wrap; gap: 26px; align-items: flex-start; margin-bottom: 28px; }
.mv3 a.mv3-feat { display: block; flex: 1.2 1 480px; min-width: 0; max-width: 760px; transition: transform .15s ease; }
.mv3 a.mv3-feat:hover { transform: translateY(-3px); }
.mv3-feat-body { padding: 14px 2px 0; }
.mv3-feat-title { font-size: 18px; line-height: 1.4; margin: 0 0 5px; letter-spacing: -0.015em; color: var(--gray-900); font-weight: 600; }
.mv3-feat-meta { font-size: 12.5px; color: var(--gray-500); }
.mv3-grid2 { flex: 1 1 480px; min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 20px 18px; }
.mv3 a.mv3-gcard { display: block; transition: opacity .15s; }
.mv3 a.mv3-gcard:hover { opacity: .78; }
.mv3-gcard-title {
	font-size: 14px; font-weight: 600; color: var(--gray-900); line-height: 1.4; margin-top: 9px;
	max-height: 2.8em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.mv3-gcard-meta { font-size: 12px; color: var(--gray-500); margin-top: 3px; }

/* 쇼츠 캐러셀 */
.mv3-carousel { }
.mv3-car-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.mv3-car-title { font-family: var(--font-kr); font-size: 16px; margin: 0; color: var(--gray-700); font-weight: 700; }
.mv3-car-nav { display: flex; gap: 8px; }
.mv3-car-btn {
	width: 34px; height: 34px; border: none; background: var(--gray-100); border-radius: 9999px;
	display: flex; align-items: center; justify-content: center; cursor: pointer;
	color: var(--gray-700); transition: background-color .15s ease; padding: 0;
}
.mv3-car-btn:hover { background: var(--gray-200); }
.mv3-scroller {
	display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory;
	padding-bottom: 6px; scrollbar-width: none; -ms-overflow-style: none;
}
.mv3-scroller::-webkit-scrollbar { display: none; }
.mv3 a.mv3-scard { flex: none; width: 154px; scroll-snap-align: start; display: block; transition: transform .15s ease; }
.mv3 a.mv3-scard:hover { transform: translateY(-3px); }
.mv3-scard-title {
	padding: 9px 2px 0; font-size: 12.5px; font-weight: 600; color: var(--gray-900); line-height: 1.4;
	min-height: 34px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* 광고 배너 */
.mv3-adbanner { margin-top: 40px; background: var(--gray-50); border-radius: 12px; overflow: hidden; display: flex; align-items: stretch; }
.mv3-adbanner-main { flex: 1; min-width: 0; padding: 30px 36px; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.mv3-adbanner-label {
	font-size: 10px; font-weight: 700; letter-spacing: 0.06em; color: var(--gray-500);
	background: #fff; padding: 3px 8px; border-radius: 2px; box-shadow: var(--shadow-sm); width: fit-content;
}
.mv3-adbanner-title { font-size: 19px; font-weight: 700; letter-spacing: -0.02em; color: var(--gray-900); margin-top: 4px; }
.mv3-adbanner-desc { font-size: 13.5px; color: var(--gray-700); line-height: 1.55; }
.mv3 a.mv3-adbanner-cta {
	margin-top: 8px; display: inline-flex; padding: 10px 20px; border-radius: 6px;
	background: var(--gray-900); color: #fff; font-size: 13px; font-weight: 600;
	width: fit-content; transition: background .15s;
}
.mv3 a.mv3-adbanner-cta:hover { background: #000; color: #fff; }
.mv3-adbanner-img { width: 340px; flex: none; background: var(--gray-100); display: flex; align-items: center; justify-content: center; color: var(--gray-300); }
.mv3-adbanner-img img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 정규 클래스 */
.mv3-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.mv3 a.mv3-ccard { display: block; padding: 0; overflow: hidden; }
.mv3-ccard-body { padding: 16px 18px 18px; }
.mv3-ccard-title { font-family: var(--font-kr); font-size: 15.5px; font-weight: 700; color: var(--gray-900); margin: 0 0 6px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mv3-ccard-meta { font-size: 12px; color: var(--gray-500); margin-bottom: 10px; }
.mv3-ccard-price { display: flex; align-items: baseline; gap: 4px; }
.mv3-price-num { font-family: var(--font-en); font-size: 17px; font-weight: 800; color: var(--gray-900); font-feature-settings: 'tnum' 1; }
.mv3-price-unit { font-size: 12px; color: var(--gray-500); }

/* 멤버십 라이브 */
.mv3-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
/* 라이브 가로형 행 — 좌 썸네일 + 우 메타·제목 (행 전체 링크) */
.mv3 a.mv3-lrow { display: flex; gap: 14px; align-items: flex-start; }
.mv3-thumb--lrow { width: 230px; flex: none; aspect-ratio: 16/9; border-radius: 8px; }
.mv3-thumb--lrow .mv3-tl { left: 8px; top: 8px; }
.mv3-lrow-body { min-width: 0; }
.mv3-lrow-meta { font-size: 12px; color: var(--gray-500); }
.mv3-lrow-title {
	font-family: var(--font-kr); font-size: 14.5px; font-weight: 700; color: var(--gray-900);
	margin: 5px 0 0; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mv3 a.mv3-lrow:hover .mv3-lrow-title { text-decoration: underline; text-underline-offset: 2px; }
.mv3-live-empty {
	display: flex; align-items: center; gap: 10px; padding: 18px 20px;
	background: var(--gray-100); border-radius: 12px; color: var(--gray-500); font-size: 13.5px;
}
.mv3-live-empty svg { flex: none; color: var(--gray-300); }

/* ── 멤버십 라이브 다시보기 (위캔두 카드 아래) ── */
.mv3-live-after { margin-bottom: 56px; }

/* ── 위캔두 멤버십 — 2컬럼(좌 멤버십 · 우 SATURDAY LIVE) + 추천사 슬라이더 ── */
.mv3-ms { background: #fff; margin-top: 56px; }
.mv3-ms-in {
	max-width: 1440px; margin: 0 auto; padding: 60px 28px 52px;
	display: grid; grid-template-columns: 1.7fr 1fr; gap: 56px; align-items: start;
}

/* 좌: 헤더 */
.mv3-ms-left { min-width: 0; }
.mv3-ms-left .mv3-eyebrow { margin-bottom: 10px; }
.mv3-ms-title { font-size: 26px; margin: 0; letter-spacing: -0.02em; line-height: 1.35; color: var(--gray-900); font-weight: 700; }
.mv3-ms-trust {
	display: inline-flex; align-items: center; gap: 7px; margin-top: 10px;
	font-size: 13px; font-weight: 600; color: var(--gray-700);
}
.mv3-ms-trust::before { content: ""; width: 5px; height: 5px; border-radius: var(--radius-full); background: var(--amber-500); }

/* 좌: 신뢰 스탯 — 숫자는 잉크 유지(제이드·앰버 금지) */
.mv3-ms-stats { display: flex; align-items: center; margin-top: 24px; }
.mv3-ms-stat { padding: 0 28px; }
.mv3-ms-stat:first-child { padding-left: 0; }
.mv3-ms-stat + .mv3-ms-stat { border-left: 1px solid var(--gray-200); }
.mv3-ms-stat-num { font-size: 20px; font-weight: 800; color: var(--gray-900); letter-spacing: -0.02em; font-feature-settings: 'tnum' 1; }
.mv3-ms-stat-cap { font-size: 11.5px; color: var(--gray-500); margin-top: 3px; }

/* 좌: 플랜 카드 2업 — 동등 위계(보더·배지·카드 CTA 없음) */
.mv3-ms-plans { margin-top: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mv3-ms-plancard { background: #fff; border: 1px solid var(--gray-100); border-radius: 8px; box-shadow: var(--shadow-md); padding: 28px 30px; display: flex; flex-direction: column; }
.mv3-ms-plabel { font-size: 11px; font-weight: 600; color: var(--gray-500); }
.mv3-ms-pguide { font-size: 13.5px; font-weight: 600; color: var(--gray-900); margin-top: 3px; }
.mv3-ms-prow {
	display: flex; align-items: baseline; justify-content: space-between;
	margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--gray-200);
}
.mv3-ms-pname { font-size: 15px; font-weight: 700; color: var(--gray-900); }
.mv3-ms-pprice { display: inline-flex; align-items: baseline; gap: 4px; }
.mv3-ms-pnum { font-size: 22px; font-weight: 800; color: var(--gray-900); letter-spacing: -0.02em; font-family: var(--font-en); font-feature-settings: 'tnum' 1; }
.mv3-ms-punit { font-size: 12.5px; color: var(--gray-700); }
.mv3-ms-benefits { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.mv3-ms-benefit { display: flex; align-items: center; gap: 9px; }
.mv3-ms-benefit svg { flex: none; color: var(--gray-900); }
.mv3-ms-benefit span { font-size: 13.5px; color: var(--gray-700); }

/* 좌: CTA + 캡션 (섹션 유일 제이드 CTA) */
.mv3-ms-ctarow { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 24px; }
.mv3 a.mv3-ms-cta {
	text-align: center; padding: 13px 32px; border-radius: 6px;
	background: var(--primary-500); color: #fff; font-size: 14px; font-weight: 600; transition: background .15s ease;
}
.mv3 a.mv3-ms-cta:hover { background: var(--primary-700); color: #fff; }
.mv3 a.mv3-ms-cta:focus-visible { outline: 2px solid var(--gray-300); outline-offset: 2px; }
.mv3-ms-cap { font-size: 12px; color: var(--gray-500); }

/* 우: SATURDAY LIVE */
.mv3-ms-live { min-width: 0; }
.mv3-ms-live-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 16px; }
.mv3-ms-live-cards { display: flex; flex-direction: column; gap: 20px; }

/* ============================================================
   반응형
   ============================================================ */
@media (max-width: 1024px) {
	.mv3-wrap, .mv3-hero, .mv3-quick-wrap { padding-left: 24px; padding-right: 24px; }
	.mv3-ms-in { padding-left: 24px; padding-right: 24px; grid-template-columns: 1fr; gap: 44px; } /* 좌우 → 상하 스택 */
	.mv3-grid-3 { grid-template-columns: repeat(2, 1fr); }
	.mv3-livehero-in { gap: 28px; }
}
@media (max-width: 767px) {
	.mv3-wrap, .mv3-hero, .mv3-quick-wrap { padding-left: 16px; padding-right: 16px; }
	.mv3-hero { padding-top: 36px; }
	.mv3-h1 { font-size: 29px; }
	.mv3-search { padding: 6px 6px 6px 18px; }
	.mv3-search-btn { height: 44px; padding: 0 20px; }
	.mv3-livesearch .mv3-search-btn { height: 44px; } /* 라이브 모드 모바일 히트타깃 44px */
	.mv3-livehero-in { padding: 32px 16px; }
	.mv3-livehero-title { font-size: 26px; }
	.mv3-livehero-thumb { width: 100%; }
	.mv3-quick-wrap { padding-top: 24px; }
	.mv3 a.mv3-quick-item { width: 84px; padding: 12px 2px; }
	.mv3-body { padding-top: 36px; }
	.mv3-free { gap: 22px; }
	.mv3-grid2 { grid-template-columns: 1fr; }
	.mv3-adbanner { flex-direction: column; }
	.mv3-adbanner-img { width: 100%; aspect-ratio: 16/9; }
	.mv3-grid-3, .mv3-grid-2 { grid-template-columns: 1fr; }
	.mv3-ms-in { padding: 44px 16px 40px; }
	.mv3-ms-plans { grid-template-columns: 1fr; } /* 카드 1열 스택(플러스 먼저) */
	.mv3-ms-plancard { padding: 24px 22px; }
	.mv3-ms-stat { padding: 0 16px; }
	.mv3-car-btn { width: 44px; height: 44px; }
}
