/* =========================================================
   고용24시 홈페이지 — 타임라인형 프리셋 [hon 블로그 전용]
   루트: .pts-preset.work24-hon-landing
   모든 셀렉터는 이 스코프 하위로 한정. 전용 prefix: w24-
   골격 정체성: 세로 연결선 + 노드 점으로 표현하는 진행 타임라인
   톤: 딥 그린(#15803D) + 골드(#B8902E) 액센트
   (gov24 블루 / gov24-hon 틸 / gov24-minwon 인디고 와 구분)
   ========================================================= */

.pts-preset.work24-hon-landing {
	--w24-green: #15803D;
	--w24-green-deep: #116231;
	--w24-green-darkest: #0C4A24;
	--w24-gold: #B8902E;
	--w24-gold-deep: #9A7522;
	--w24-ink: #20262e;
	--w24-muted: #5b6470;
	--w24-line: #d8e2da;
	--w24-bg-soft: #f1f8f3;
	--w24-card: #ffffff;
	--w24-radius: 14px;

	/* 타임라인 공유 축: 모든 브레이크포인트에서 점 중심 = 선 중심 */
	--w24-dot: 34px;
	--w24-line-w: 3px;
	--w24-axis: 17px;
	--w24-gap: 30px;

	max-width: 860px;
	margin: 0 auto;
	padding: 28px 20px 64px;
	color: var(--w24-ink);
	font-size: 16px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	word-break: keep-all;
}

.pts-preset.work24-hon-landing * {
	box-sizing: border-box;
}

.pts-preset.work24-hon-landing a {
	color: var(--w24-green);
}

.pts-preset.work24-hon-landing a:focus-visible,
.pts-preset.work24-hon-landing button:focus-visible,
.pts-preset.work24-hon-landing summary:focus-visible {
	outline: 3px solid var(--w24-gold);
	outline-offset: 3px;
	border-radius: 6px;
}

.pts-preset.work24-hon-landing .w24-hero a:focus-visible {
	outline-color: #fff;
}

/* -------------------- 1. HERO -------------------- */
.pts-preset.work24-hon-landing .w24-hero {
	background: linear-gradient(160deg, var(--w24-green) 0%, var(--w24-green-deep) 100%);
	color: #fff;
	border-radius: var(--w24-radius);
	padding: 40px 34px;
	text-align: center;
	box-shadow: 0 16px 36px rgba(17, 98, 49, 0.22);
}

.pts-preset.work24-hon-landing .w24-hero__eyebrow {
	display: inline-block;
	font-size: 13px;
	letter-spacing: 0.12em;
	font-weight: 700;
	color: #F2D88A;
	border: 1px solid rgba(184, 144, 46, 0.6);
	border-radius: 999px;
	padding: 5px 14px;
	margin-bottom: 16px;
}

.pts-preset.work24-hon-landing .w24-hero__title {
	margin: 0 0 14px;
	font-size: 30px;
	line-height: 1.3;
	font-weight: 800;
	color: #fff;
}

.pts-preset.work24-hon-landing .w24-hero__lead {
	margin: 0 auto 26px;
	max-width: 620px;
	font-size: 16px;
	color: rgba(255, 255, 255, 0.9);
}

.pts-preset.work24-hon-landing .w24-hero__lead strong {
	color: #fff;
}

.pts-preset.work24-hon-landing .w24-hero__cta {
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
}

.pts-preset.work24-hon-landing .w24-btn {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	text-decoration: none;
	font-weight: 700;
	border-radius: 10px;
	padding: 13px 26px;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.pts-preset.work24-hon-landing .w24-btn:hover {
	transform: translateY(-2px);
}

.pts-preset.work24-hon-landing .w24-btn--primary {
	background: var(--w24-gold);
	color: #fff;
	box-shadow: 0 8px 18px rgba(184, 144, 46, 0.4);
}

.pts-preset.work24-hon-landing .w24-btn--primary:hover {
	background: var(--w24-gold-deep);
	box-shadow: 0 10px 22px rgba(154, 117, 34, 0.45);
}

.pts-preset.work24-hon-landing .w24-btn__sub {
	font-size: 12px;
	font-weight: 600;
	opacity: 0.92;
	margin-top: 3px;
}

.pts-preset.work24-hon-landing .w24-btn--ghost {
	justify-content: center;
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.4);
}

/* -------------------- 2·3. SECTION 공통 -------------------- */
.pts-preset.work24-hon-landing .w24-section {
	margin-top: 44px;
}

.pts-preset.work24-hon-landing .w24-section--alt {
	background: var(--w24-bg-soft);
	border-radius: var(--w24-radius);
	padding: 30px 26px 34px;
}

.pts-preset.work24-hon-landing .w24-section__heading {
	margin: 0 0 8px;
	font-size: 23px;
	font-weight: 800;
	color: var(--w24-green);
	position: relative;
	padding-left: 16px;
}

.pts-preset.work24-hon-landing .w24-section__heading::before {
	content: "";
	position: absolute;
	left: 0;
	top: 4px;
	bottom: 4px;
	width: 5px;
	border-radius: 3px;
	background: var(--w24-gold);
}

.pts-preset.work24-hon-landing .w24-section__intro {
	margin: 0 0 24px;
	color: var(--w24-muted);
}

/* -------------------- TIMELINE (핵심 컴포넌트) -------------------- */
.pts-preset.work24-hon-landing .w24-timeline {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.pts-preset.work24-hon-landing .w24-node {
	position: relative;
	padding: 0 0 var(--w24-gap) calc(var(--w24-dot) + var(--w24-gap));
}

.pts-preset.work24-hon-landing .w24-node:last-child {
	padding-bottom: 0;
}

.pts-preset.work24-hon-landing .w24-node::before {
	content: "";
	position: absolute;
	left: calc(var(--w24-axis) - var(--w24-line-w) / 2);
	top: calc(var(--w24-dot) / 2);
	bottom: calc(-1 * var(--w24-dot) / 2);
	width: var(--w24-line-w);
	background: var(--w24-green);
	opacity: 0.5;
}

.pts-preset.work24-hon-landing .w24-node--final::before,
.pts-preset.work24-hon-landing .w24-node:last-child::before {
	display: none;
}

.pts-preset.work24-hon-landing .w24-node__dot {
	position: absolute;
	left: calc(var(--w24-axis) - var(--w24-dot) / 2);
	top: 0;
	width: var(--w24-dot);
	height: var(--w24-dot);
	border-radius: 50%;
	background: var(--w24-gold);
	border: 3px solid #fff;
	box-shadow: 0 0 0 2px var(--w24-gold);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 800;
	font-size: 14px;
	line-height: 1;
	z-index: 1;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

/* 흐름 타임라인(A) = 번호 없는 그린 점 */
.pts-preset.work24-hon-landing .w24-timeline:not(.w24-timeline--steps) .w24-node__dot {
	background: var(--w24-green);
	box-shadow: 0 0 0 2px var(--w24-green);
}

.pts-preset.work24-hon-landing .w24-timeline:not(.w24-timeline--steps) .w24-node__dot::after {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #fff;
	opacity: 0.92;
}

/* 단계(B) = 번호 골드 점 */
.pts-preset.work24-hon-landing .w24-timeline--steps .w24-node__dot {
	background: var(--w24-gold);
	box-shadow: 0 0 0 2px var(--w24-gold-deep);
}

.pts-preset.work24-hon-landing .w24-node:hover .w24-node__dot {
	transform: scale(1.12);
}

.pts-preset.work24-hon-landing .w24-node__body {
	background: var(--w24-card);
	border: 1px solid var(--w24-line);
	border-radius: 12px;
	padding: 14px 18px 16px;
	box-shadow: 0 2px 8px rgba(21, 128, 61, 0.07);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.pts-preset.work24-hon-landing .w24-node:hover .w24-node__body {
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(21, 128, 61, 0.12);
}

.pts-preset.work24-hon-landing .w24-section--alt .w24-node__body {
	border-color: #dfeee4;
}

.pts-preset.work24-hon-landing .w24-node__title {
	margin: 0 0 6px;
	font-size: 17px;
	font-weight: 800;
	color: var(--w24-green);
}

.pts-preset.work24-hon-landing .w24-node__desc {
	margin: 0;
	font-size: 15px;
	color: var(--w24-ink);
}

.pts-preset.work24-hon-landing .w24-node__desc code {
	background: var(--w24-bg-soft);
	border: 1px solid var(--w24-line);
	border-radius: 5px;
	padding: 1px 6px;
	font-size: 13.5px;
	color: var(--w24-green-deep);
}

/* -------------------- 4. 바로가기 -------------------- */
.pts-preset.work24-hon-landing .w24-links {
	margin-top: 44px;
}

.pts-preset.work24-hon-landing .w24-links__heading {
	margin: 0 0 14px;
	font-size: 18px;
	font-weight: 800;
	color: var(--w24-green);
}

.pts-preset.work24-hon-landing .w24-links__row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.pts-preset.work24-hon-landing .w24-chip {
	display: inline-block;
	text-decoration: none;
	font-size: 14px;
	font-weight: 700;
	color: var(--w24-green);
	background: #fff;
	border: 1.5px solid var(--w24-green);
	border-radius: 999px;
	padding: 8px 16px;
	transition: background 0.15s ease, color 0.15s ease;
}

.pts-preset.work24-hon-landing .w24-chip:hover {
	background: var(--w24-green);
	color: #fff;
}

/* -------------------- 5. NOTICE -------------------- */
.pts-preset.work24-hon-landing .w24-notice-wrap {
	margin-top: 32px;
}

.pts-preset.work24-hon-landing .w24-notice {
	background: #fff8ea;
	border: 1px solid #ecd9a8;
	border-left: 5px solid var(--w24-gold);
	border-radius: 12px;
	padding: 16px 20px;
}

.pts-preset.work24-hon-landing .w24-notice__badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 800;
	color: #fff;
	background: var(--w24-gold);
	border-radius: 6px;
	padding: 3px 10px;
	margin-bottom: 8px;
}

.pts-preset.work24-hon-landing .w24-notice p {
	margin: 0;
	font-size: 15px;
	color: var(--w24-ink);
}

/* -------------------- 6. 본문 -------------------- */
.pts-preset.work24-hon-landing .entry-content {
	margin-top: 40px;
	font-size: 16px;
	line-height: 1.8;
}

.pts-preset.work24-hon-landing .entry-content h2 {
	color: var(--w24-green);
}

/* -------------------- 7. FAQ -------------------- */
.pts-preset.work24-hon-landing .w24-faq-section {
	margin-top: 44px;
}

.pts-preset.work24-hon-landing .w24-faq-section__heading {
	margin: 0 0 16px;
	font-size: 23px;
	font-weight: 800;
	color: var(--w24-green);
}

.pts-preset.work24-hon-landing .w24-faq details {
	background: #fff;
	border: 1px solid var(--w24-line);
	border-radius: 10px;
	padding: 4px 18px;
	margin-bottom: 10px;
}

.pts-preset.work24-hon-landing .w24-faq summary {
	cursor: pointer;
	font-weight: 700;
	color: var(--w24-green);
	padding: 12px 0;
	list-style: none;
	position: relative;
	padding-right: 26px;
}

.pts-preset.work24-hon-landing .w24-faq summary::-webkit-details-marker {
	display: none;
}

.pts-preset.work24-hon-landing .w24-faq summary::after {
	content: "+";
	position: absolute;
	right: 2px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	color: var(--w24-gold);
	font-weight: 700;
}

.pts-preset.work24-hon-landing .w24-faq details[open] summary::after {
	content: "–";
}

.pts-preset.work24-hon-landing .w24-faq__body {
	padding: 0 0 14px;
	font-size: 15px;
	color: var(--w24-ink);
}

.pts-preset.work24-hon-landing .w24-faq__body code {
	background: var(--w24-bg-soft);
	border: 1px solid var(--w24-line);
	border-radius: 5px;
	padding: 1px 6px;
	font-size: 13.5px;
}

/* =========================================================
   반응형 — 768px
   ========================================================= */
@media (max-width: 768px) {
	.pts-preset.work24-hon-landing {
		padding: 20px 14px 48px;
	}

	.pts-preset.work24-hon-landing .w24-hero {
		padding: 32px 22px;
	}

	.pts-preset.work24-hon-landing .w24-hero__title {
		font-size: 25px;
	}

	.pts-preset.work24-hon-landing .w24-section__heading,
	.pts-preset.work24-hon-landing .w24-faq-section__heading {
		font-size: 21px;
	}

	.pts-preset.work24-hon-landing .w24-section--alt {
		padding: 24px 18px 26px;
	}

	.pts-preset.work24-hon-landing .w24-timeline {
		--w24-dot: 30px;
		--w24-axis: 15px;
		--w24-gap: 24px;
	}

	.pts-preset.work24-hon-landing .w24-node__dot {
		font-size: 13px;
	}
}

/* =========================================================
   반응형 — 480px
   ========================================================= */
@media (max-width: 480px) {
	.pts-preset.work24-hon-landing .w24-hero {
		padding: 26px 16px;
	}

	.pts-preset.work24-hon-landing .w24-hero__title {
		font-size: 22px;
	}

	.pts-preset.work24-hon-landing .w24-hero__cta {
		flex-direction: column;
	}

	.pts-preset.work24-hon-landing .w24-btn {
		width: 100%;
	}

	.pts-preset.work24-hon-landing .w24-timeline {
		--w24-dot: 28px;
		--w24-axis: 14px;
		--w24-gap: 18px;
		--w24-line-w: 2.5px;
	}

	.pts-preset.work24-hon-landing .w24-node__dot {
		font-size: 12px;
		border-width: 2px;
	}

	.pts-preset.work24-hon-landing .w24-node__body {
		padding: 12px 14px 13px;
	}

	.pts-preset.work24-hon-landing .w24-node__title {
		font-size: 16px;
	}

	.pts-preset.work24-hon-landing .w24-chip {
		font-size: 13px;
		padding: 7px 13px;
	}
}

/* =========================================================
   긴 텍스트 줄바꿈 — 가로 스크롤 0 보장
   ========================================================= */
.pts-preset.work24-hon-landing .w24-node__desc,
.pts-preset.work24-hon-landing .w24-notice p,
.pts-preset.work24-hon-landing .w24-faq__body,
.pts-preset.work24-hon-landing .w24-hero__lead {
	overflow-wrap: break-word;
}

.pts-preset.work24-hon-landing code {
	overflow-wrap: anywhere;
}

/* =========================================================
   모션 최소화 선호
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
	.pts-preset.work24-hon-landing *,
	.pts-preset.work24-hon-landing *::before,
	.pts-preset.work24-hon-landing *::after {
		transition-duration: 0.001ms !important;
		animation-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	.pts-preset.work24-hon-landing .w24-btn:hover,
	.pts-preset.work24-hon-landing .w24-node:hover .w24-node__body,
	.pts-preset.work24-hon-landing .w24-node:hover .w24-node__dot {
		transform: none;
	}
}

/* =========================================================
   다크 테마 안전
   ========================================================= */
@media (prefers-color-scheme: dark) {
	.pts-preset.work24-hon-landing {
		--w24-ink: #1d232b;
		--w24-card: #ffffff;
		--w24-line: #d8e2da;
		color: var(--w24-ink);
	}

	.pts-preset.work24-hon-landing .w24-node__body,
	.pts-preset.work24-hon-landing .w24-faq details,
	.pts-preset.work24-hon-landing .w24-chip {
		background: #ffffff;
		color: var(--w24-green);
	}

	.pts-preset.work24-hon-landing .w24-node__desc,
	.pts-preset.work24-hon-landing .w24-faq__body,
	.pts-preset.work24-hon-landing .w24-notice p {
		color: var(--w24-ink);
	}

	.pts-preset.work24-hon-landing .w24-node::before {
		background: var(--w24-green);
		opacity: 0.6;
	}
}

/* =========================================================
   인쇄 — 색(연결선·점) 유지, 그림자/배경효과만 제거
   ========================================================= */
@media print {
	.pts-preset.work24-hon-landing {
		max-width: none;
		padding: 0;
		color: #000;
	}

	.pts-preset.work24-hon-landing * {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		box-shadow: none !important;
		text-shadow: none !important;
	}

	.pts-preset.work24-hon-landing .w24-hero {
		background: #fff;
		color: var(--w24-green);
		border: 2px solid var(--w24-green);
	}

	.pts-preset.work24-hon-landing .w24-hero__title,
	.pts-preset.work24-hon-landing .w24-hero__lead,
	.pts-preset.work24-hon-landing .w24-hero__lead strong {
		color: var(--w24-green);
	}

	.pts-preset.work24-hon-landing .w24-hero__cta {
		display: none;
	}

	.pts-preset.work24-hon-landing .w24-node::before {
		background: var(--w24-green) !important;
		opacity: 1;
	}

	.pts-preset.work24-hon-landing .w24-timeline:not(.w24-timeline--steps) .w24-node__dot {
		background: var(--w24-green) !important;
		box-shadow: 0 0 0 2px var(--w24-green) !important;
	}

	.pts-preset.work24-hon-landing .w24-timeline--steps .w24-node__dot {
		background: var(--w24-gold) !important;
		box-shadow: 0 0 0 2px var(--w24-gold-deep) !important;
	}

	.pts-preset.work24-hon-landing .w24-node__body,
	.pts-preset.work24-hon-landing .w24-faq details {
		border: 1px solid #999;
		break-inside: avoid;
	}

	.pts-preset.work24-hon-landing .w24-faq details {
		display: block;
	}

	.pts-preset.work24-hon-landing .w24-faq details summary::after {
		content: "";
	}
}