@charset "utf-8";
/* =====================================================
   프로그램 공용 — page-program (Claude Design v2)
   speech / sensory / play / cognitive / flower 5페이지 공유
   ===================================================== */

.page-program { display:block; overflow:hidden; }

/* ── 히어로 카드 (2컬럼: 이미지 + 텍스트) ─────────── */
.page-program__hero {
	display:grid;
	grid-template-columns:1fr 1.05fr;
	gap:60px;
	align-items:center;
	margin-bottom:60px;
}
.page-program__hero-img {
	aspect-ratio:5/4;
	border-radius:200px 32px 200px 32px;
	overflow:hidden;
	background:repeating-linear-gradient(135deg,
		oklch(0.90 0.06 140) 0 12px,
		oklch(0.94 0.04 140) 12px 24px);
	display:grid; place-items:center;
}
.page-program__hero-img img {
	width:100%; height:100%;
	object-fit:cover; display:block;
}
.page-program__hero-img span {
	font-family:var(--f_ui);
	font-size:var(--fs12);
	letter-spacing:0.1em;
	color:oklch(0.42 0.06 148);
	background:oklch(0.99 0.008 120 / 0.9);
	padding:9px 16px;
	border-radius:999px;
}

/* 카테고리별 히어로 톤 (page-program--{key}) */
.page-program--speech .page-program__hero-img {
	background:repeating-linear-gradient(135deg, oklch(0.90 0.06 140) 0 12px, oklch(0.94 0.04 140) 12px 24px);
}
.page-program--sensory .page-program__hero-img {
	background:repeating-linear-gradient(135deg, oklch(0.90 0.05 220) 0 12px, oklch(0.94 0.04 220) 12px 24px);
}
.page-program--play .page-program__hero-img {
	background:repeating-linear-gradient(135deg, oklch(0.92 0.06 100) 0 12px, oklch(0.95 0.05 100) 12px 24px);
}
.page-program--cognitive .page-program__hero-img {
	background:repeating-linear-gradient(135deg, oklch(0.92 0.05 60) 0 12px, oklch(0.95 0.045 60) 12px 24px);
}
.page-program--flower .page-program__hero-img {
	background:repeating-linear-gradient(135deg, oklch(0.90 0.05 5) 0 12px, oklch(0.94 0.04 5) 12px 24px);
}

.page-program__hero-txt h3 {
	margin:0 0 18px;
	font-family:var(--f_display);
	font-weight:700;
	font-size:var(--fs36);
	color:oklch(0.31 0.05 148);
	line-height:1.25;
	letter-spacing:-0.02em;
}
.page-program__hero-txt p {
	margin:0 0 14px;
	font-size:var(--fs16);
	line-height:1.9;
	color:var(--tx-body);
}
.page-program__hero-txt p strong {
	color:var(--c_base1);
	font-weight:700;
}

/* ── 상세 카드 그리드 (대상 · 프로그램) ───────────── */
.page-program__detail-grid {
	display:grid;
	grid-template-columns:1fr;
	gap:20px;
}
.page-program__detail-card {
	background:var(--bg3);
	border-radius:32px;
	padding:34px;
	display:flex; flex-direction:column; gap:18px;
	box-shadow:var(--sh-card);
	transition:transform .3s ease, box-shadow .3s ease;
}
.page-program__detail-card:hover {
	transform:translateY(-4px);
	box-shadow:0 20px 44px oklch(0.30 0.05 148 / 0.10);
}
.page-program__detail-card--tint {
	background:oklch(0.93 0.045 122);
}
.page-program__detail-card h4 {
	margin:0;
	font-family:var(--f_display);
	font-weight:700;
	font-size:var(--fs22);
	color:oklch(0.31 0.05 148);
	line-height:1.35;
	letter-spacing:-0.01em;
}
.page-program__detail-card ul {
	list-style:none; padding:0; margin:0;
	display:flex; flex-direction:column; gap:11px;
}
.page-program__detail-card li {
	position:relative;
	padding-left:26px;
	font-size:var(--fs15);
	line-height:1.75;
	color:var(--tx-body);
}
.page-program__detail-card li::before {
	content:""; position:absolute; left:0; top:6px;
	width:16px; height:16px; border-radius:50%;
	background:oklch(0.55 0.09 148) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round'><polyline points='20 6 9 17 4 12'/></svg>") center / 10px no-repeat;
}
.page-program__detail-card li strong {
	color:var(--c_base1);
	font-weight:700;
}

/* ── 담당 연구원 카드 ─────────────────────────────── */
.page-program__teacher {
	background:oklch(0.55 0.09 148);
	color:var(--tx-invert);
	border-radius:40px;
	padding:44px;
	display:grid;
	grid-template-columns:1fr 1.4fr;
	gap:44px;
	align-items:center;
	box-shadow:0 20px 44px oklch(0.42 0.06 148 / 0.20);
}
.page-program__teacher.second {background:oklch(0.58 0.06 109.53);}
.page-program__teacher-label {
	display:inline-block;
	font-family:var(--f_ui);
	font-size:var(--fs14);
	font-weight:700;
	letter-spacing:0.24em;
	text-transform:uppercase;
	color:oklch(0.93 0.03 130);
	margin-bottom:12px;
}
.page-program__teacher-name {
	margin:0 0 10px;
	font-family:var(--f_display);
	font-weight:700;
	font-size:var(--fs30);
	line-height:1.2;
	letter-spacing:-0.02em;
}
.page-program__teacher-role {
	display:block;
	font-family:var(--f_ui);
	font-size:var(--fs14);
	font-weight:600;
	letter-spacing:0.06em;
	color:oklch(0.92 0.03 130);
}
.page-program__teacher-cv {
	list-style:none; padding:0; margin:0;
	display:flex; flex-direction:column; gap:8px;
}
.page-program__teacher-cv li {
	position:relative;
	padding-left:18px;
	font-size:var(--fs16);
	line-height:1.75;
	color:oklch(0.94 0.02 130);
}
.page-program__teacher-cv li::before {
	content:""; position:absolute; left:0; top:11px;
	width:6px; height:6px; border-radius:50%;
	background:oklch(0.94 0.05 130);
}

/* ==================== 반응형 ==================== */
@media screen and (max-width:1199px) {
	.page-program__hero {
		grid-template-columns:1fr;
		gap:36px;
		margin-bottom:44px;
	}
	.page-program__hero-img {
		aspect-ratio:16/10;
		border-radius:32px 140px 32px 140px;
	}
	.page-program__hero-txt h3 { font-size:var(--fs28); }
	.page-program__detail-grid { grid-template-columns:1fr; gap:16px; }
	.page-program__detail-card { padding:28px; border-radius:26px; }
	.page-program__teacher {
		grid-template-columns:1fr;
		gap:24px;
		padding:36px;
		border-radius:32px;
	}
}
@media screen and (max-width:767px) {
	.page-program__hero-img { border-radius:24px 100px 24px 100px; }
	.page-program__hero-txt h3 { font-size:var(--fs24); }
	.page-program__detail-card { padding:24px; border-radius:22px; }
	.page-program__detail-card h4 { font-size:var(--fs19); }
	.page-program__teacher { padding:28px; border-radius:26px; }
	.page-program__teacher-name { font-size:var(--fs24); }
}