/* dbx_content 리뉴얼 공통 레이아웃 */
.wonk-content-page {
	--wc-main: #27845c;
	--wc-soft: #e8f6ee;
	--wc-ink: #263c32;
	--wc-muted: #65736b;
	color: var(--wc-ink);
	font-family: inherit;
	overflow: hidden;
}
.wonk-content-page--program { --wc-main: #397c9e; --wc-soft: #eaf6fb; }
.wonk-content-page--family { --wc-main: #b87558; --wc-soft: #fff2ea; }
.wonk-content-page--check { --wc-main: #8169a7; --wc-soft: #f3effb; }
.wonk-content-page--counsel { --wc-main: #b16e72; --wc-soft: #fff0f0; }
.wonk-content-page--guide { --wc-main: #8b7b53; --wc-soft: #faf4e6; }
.wonk-content-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
	align-items: center;
	min-height: 340px;
	padding: clamp(34px, 6vw, 72px);
	border-radius: 28px;
	overflow: hidden;
	background: linear-gradient(135deg, #fffdf9 0%, var(--wc-soft) 100%);
}
.wonk-content-hero__copy { position: relative; z-index: 2; }
.wonk-content-hero__eyebrow,
.wonk-content-intro__title > span,
.wonk-content-flow__head > span,
.wonk-content-cta span {
	display: block;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .16em;
	color: var(--wc-main);
}
.wonk-content__crumb {
	display: block;
	margin-top: 22px;
	font-size: 13px;
	font-weight: 700;
	color: var(--wc-muted);
}
.wonk-content-hero h1 {
	margin: 12px 0 16px;
	font-size: clamp(32px, 5vw, 52px);
	font-weight: 800;
	letter-spacing: -.055em;
	line-height: 1.13;
	word-break: keep-all;
}
.wonk-content-hero p {
	max-width: 490px;
	margin: 0;
	font-size: clamp(15px, 1.6vw, 18px);
	font-weight: 500;
	line-height: 1.8;
	color: var(--wc-muted);
	word-break: keep-all;
}
.wonk-content-hero__art {
	position: relative;
	z-index: 1;
	width: min(100%, 330px);
	aspect-ratio: 1;
	justify-self: end;
	border-radius: 44% 56% 52% 48% / 54% 42% 58% 46%;
	background: rgba(255, 255, 255, .6);
	box-shadow: inset 0 0 34px rgba(255,255,255,.85);
}
.wonk-content-hero__orbit {
	position: absolute;
	border: 2px solid color-mix(in srgb, var(--wc-main) 28%, transparent);
	border-radius: 50%;
}
.wonk-content-hero__orbit--one { width: 76%; height: 36%; left: 12%; top: 32%; transform: rotate(-24deg); }
.wonk-content-hero__orbit--two { width: 42%; height: 88%; left: 30%; top: 6%; transform: rotate(35deg); }
.wonk-content-hero__shape { position: absolute; border-radius: 50%; background: var(--wc-main); box-shadow: 0 12px 24px color-mix(in srgb, var(--wc-main) 25%, transparent); }
.wonk-content-hero__shape--large { width: 34%; aspect-ratio: 1; left: 23%; top: 31%; }
.wonk-content-hero__shape--small { width: 21%; aspect-ratio: 1; right: 21%; bottom: 22%; background: #ffd96e; }
.wonk-content-hero__spark { position: absolute; color: var(--wc-main); font-size: 28px; }
.wonk-content-hero__spark--one { right: 18%; top: 20%; }
.wonk-content-hero__spark--two { left: 19%; bottom: 20%; font-size: 16px; }
.wonk-content-intro {
	display: grid;
	grid-template-columns: 1fr 1.1fr;
	gap: 42px;
	padding: clamp(44px, 7vw, 86px) clamp(8px, 3vw, 32px);
	align-items: end;
}
.wonk-content-intro h2,
.wonk-content-flow h2,
.wonk-content-cta h2 {
	margin: 9px 0 0;
	font-size: clamp(25px, 3.1vw, 39px);
	font-weight: 800;
	line-height: 1.28;
	letter-spacing: -.052em;
	word-break: keep-all;
}
.wonk-content-intro__text {
	margin: 0;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.9;
	color: var(--wc-muted);
	word-break: keep-all;
}
.wonk-content-points {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
}
.wonk-content-points article {
	position: relative;
	min-height: 168px;
	padding: 25px 23px;
	border: 1px solid #edf0ee;
	border-radius: 20px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 8px 22px rgba(42, 68, 55, .04);
}
.wonk-content-points span { font-size: 12px; font-weight: 800; color: var(--wc-main); letter-spacing: .08em; }
.wonk-content-points h3 { position: relative; z-index: 1; margin: 34px 0 0; font-size: 19px; line-height: 1.35; letter-spacing: -.035em; word-break: keep-all; }
.wonk-content-points i { position: absolute; right: -18px; bottom: -28px; width: 90px; height: 90px; border-radius: 50%; background: var(--wc-soft); }
.wonk-content-flow {
	display: grid;
	grid-template-columns: .85fr 1.15fr;
	gap: 44px;
	align-items: center;
	margin-top: clamp(44px, 7vw, 86px);
	padding: clamp(34px, 5vw, 58px);
	border-radius: 28px;
	background: #f7f9f8;
}
.wonk-content-flow ol { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 0; list-style: none; }
.wonk-content-flow li { position: relative; min-height: 104px; padding: 9px 20px; }
.wonk-content-flow li + li { border-left: 1px solid #dce5e0; }
.wonk-content-flow b { display: block; color: var(--wc-main); font-size: 12px; letter-spacing: .1em; }
.wonk-content-flow strong { display: block; margin-top: 20px; font-size: 16px; letter-spacing: -.035em; word-break: keep-all; }
.wonk-content-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 20px;
	padding: clamp(34px, 5vw, 58px);
	border-radius: 28px;
	background: var(--wc-main);
	color: #fff;
}
.wonk-content-cta span { color: rgba(255,255,255,.65); }
.wonk-content-cta h2 { color: #fff; }
.wonk-content-cta a {
	display: inline-flex;
	align-items: center;
	gap: 18px;
	flex: 0 0 auto;
	padding: 13px 19px;
	border-radius: 999px;
	background: #fff;
	color: var(--wc-main);
	font-size: 14px;
	font-weight: 800;
	text-decoration: none;
	transition: transform .2s ease;
}
.wonk-content-cta a:hover { transform: translateY(-2px); }
.wonk-content-cta b { font-size: 18px; }
@media (max-width: 760px) {
	.wonk-content-hero { grid-template-columns: 1fr; min-height: 0; }
	.wonk-content-hero__art { width: 190px; margin: 26px 4% -35px auto; }
	.wonk-content-intro, .wonk-content-flow { grid-template-columns: 1fr; gap: 22px; }
	.wonk-content-points { grid-template-columns: 1fr; }
	.wonk-content-points article { min-height: 122px; }
	.wonk-content-points h3 { margin-top: 22px; }
	.wonk-content-flow ol { grid-template-columns: 1fr; gap: 8px; }
	.wonk-content-flow li { min-height: 0; padding: 13px 0; }
	.wonk-content-flow li + li { border-left: 0; border-top: 1px solid #dce5e0; }
	.wonk-content-flow strong { margin-top: 5px; }
	.wonk-content-cta { display: block; }
	.wonk-content-cta a { margin-top: 25px; }
}

/* /docu/ content renewal — cards, icons, motion (no page title header) */
.wonk-content-page--docu {
	overflow: visible;
	max-width: 920px;
	margin: 0 auto;
	padding: 4px 0 40px;
}
.wonk-content-docu__body {
	display: flex;
	flex-direction: column;
	gap: 18px;
	color: var(--wc-ink);
	font-size: 15.5px;
	line-height: 1.85;
	word-break: keep-all;
}
.wonk-docu-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 42px;
	height: 42px;
	border-radius: 14px;
	background: linear-gradient(145deg, #fff, var(--wc-soft));
	border: 1px solid #dcebe2;
	color: var(--wc-main);
	box-shadow: 0 8px 18px rgba(49, 85, 65, .08);
}
.wonk-docu-icon svg {
	width: 20px;
	height: 20px;
}
.wonk-docu-empty {
	margin: 0;
	padding: 28px;
	border-radius: 18px;
	background: #f7faf8;
	border: 1px dashed #d5e3db;
	color: #809089;
	text-align: center;
}
.wonk-docu-prose {
	position: relative;
	overflow: hidden;
	padding: 26px 24px 24px;
	border-radius: 24px;
	background: linear-gradient(160deg, #ffffff 0%, #f5faf7 72%, #fff8ef 100%);
	border: 1px solid #e3ece7;
	box-shadow: 0 14px 32px rgba(49, 85, 65, .06);
}
.wonk-docu-prose::before {
	content: "";
	position: absolute;
	right: -40px;
	top: -50px;
	width: 160px;
	height: 160px;
	border-radius: 999px;
	background: radial-gradient(circle, rgba(255, 226, 138, .35) 0%, rgba(255, 226, 138, 0) 70%);
	pointer-events: none;
}
.wonk-docu-prose__badge {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
	padding: 6px 12px 6px 6px;
	border-radius: 999px;
	background: rgba(255,255,255,.8);
	border: 1px solid #e5ece8;
	font-size: 12px;
	font-weight: 800;
	color: var(--wc-main);
	letter-spacing: -.01em;
}
.wonk-docu-prose__badge .wonk-docu-icon {
	width: 32px;
	height: 32px;
	border-radius: 999px;
}
.wonk-docu-prose__badge .wonk-docu-icon svg { width: 15px; height: 15px; }
.wonk-docu-lead {
	position: relative;
	z-index: 1;
	margin: 0;
	font-size: clamp(17px, 2.2vw, 19px);
	font-weight: 700;
	line-height: 1.7;
	color: #2f463a;
}
.wonk-docu-prose p,
.wonk-docu-section__body > p,
.wonk-docu-step__copy p {
	position: relative;
	z-index: 1;
	margin: 0;
	color: #4d5f56;
	font-weight: 500;
}
.wonk-docu-prose p + p { margin-top: 14px; }
.wonk-docu-sign {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	margin: 4px 0 0;
	padding: 14px 18px;
	border-radius: 18px;
	background: #fff;
	border: 1px solid #e5ece8;
	font-size: 14px;
	font-weight: 700;
	color: #617067;
}
.wonk-docu-sign .wonk-docu-icon {
	width: 34px;
	height: 34px;
	border-radius: 12px;
	color: #bd704f;
}
.wonk-docu-section {
	padding: 22px;
	border-radius: 22px;
	background: #fff;
	border: 1px solid #e5ece8;
	box-shadow: 0 10px 28px rgba(49, 85, 65, .05);
	transition: transform .25s ease, box-shadow .25s ease;
}
.wonk-docu-section:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 34px rgba(49, 85, 65, .09);
}
.wonk-docu-section__head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
	padding-bottom: 14px;
	border-bottom: 1px solid #e8efeb;
}
.wonk-docu-section__title {
	margin: 0;
	font-size: clamp(18px, 2.2vw, 22px);
	font-weight: 800;
	letter-spacing: -.02em;
	color: #24362d;
}
.wonk-docu-section__body {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.wonk-docu-card-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}
.wonk-docu-card,
.wonk-docu-qa {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 18px;
	border-radius: 18px;
	background: linear-gradient(160deg, #ffffff 0%, #f5faf7 100%);
	border: 1px solid #e3ece7;
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.wonk-docu-card:hover,
.wonk-docu-qa:hover {
	transform: translateY(-3px);
	border-color: #cfe3d6;
	box-shadow: 0 14px 28px rgba(49, 85, 65, .1);
}
.wonk-docu-card__icon .wonk-docu-icon,
.wonk-docu-qa__icon .wonk-docu-icon {
	animation: wonkDocuFloat 4.8s ease-in-out infinite;
}
.wonk-docu-card:nth-child(2n) .wonk-docu-icon { animation-delay: -.8s; }
.wonk-docu-card:nth-child(3n) .wonk-docu-icon { animation-delay: -1.6s; }
.wonk-docu-card h3,
.wonk-docu-qa h3,
.wonk-docu-step h3 {
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: #24362d;
}
.wonk-docu-card p,
.wonk-docu-qa p {
	margin: 0;
	font-size: 14px;
	line-height: 1.7;
	color: #5a6b63;
	font-weight: 500;
}
.wonk-docu-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 8px;
}
.wonk-docu-list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 13px 14px;
	border-radius: 16px;
	background: #f7faf8;
	border: 1px solid #e5ece8;
	transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.wonk-docu-list li:hover {
	transform: translateX(4px);
	background: #fff;
	border-color: #cfe3d6;
}
.wonk-docu-list__mark .wonk-docu-icon {
	width: 30px;
	height: 30px;
	border-radius: 10px;
}
.wonk-docu-list__mark .wonk-docu-icon svg { width: 14px; height: 14px; }
.wonk-docu-list__text {
	padding-top: 4px;
	color: #44554c;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.55;
}
.wonk-docu-qa-list {
	display: grid;
	gap: 10px;
}
.wonk-docu-qa {
	background: #fff;
}
.wonk-docu-qa h3 { color: var(--wc-main); }
.wonk-docu-steps {
	display: grid;
	gap: 12px;
	position: relative;
}
.wonk-docu-steps::before {
	content: "";
	position: absolute;
	left: 35px;
	top: 28px;
	bottom: 28px;
	width: 2px;
	background: linear-gradient(180deg, var(--wc-soft), #e8efeb 50%, transparent);
}
.wonk-docu-step {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr);
	gap: 14px;
	align-items: start;
	padding: 18px;
	border-radius: 20px;
	background: #fff;
	border: 1px solid #e5ece8;
	box-shadow: 0 10px 24px rgba(49, 85, 65, .05);
	transition: transform .22s ease, box-shadow .22s ease;
}
.wonk-docu-step:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 30px rgba(49, 85, 65, .1);
}
.wonk-docu-step__badge {
	display: grid;
	gap: 8px;
	justify-items: center;
}
.wonk-docu-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 18px;
	background: linear-gradient(145deg, var(--wc-soft), #fff);
	border: 1px solid #dcebe2;
	color: var(--wc-main);
	font-size: 16px;
	font-weight: 800;
}
.wonk-docu-step__icon .wonk-docu-icon {
	width: 34px;
	height: 34px;
	border-radius: 12px;
	animation: wonkDocuFloat 5s ease-in-out infinite;
}
.wonk-docu-step__copy p + p { margin-top: 8px; }
.wonk-docu-em {
	padding: 10px 12px;
	border-radius: 12px;
	background: rgba(39, 132, 92, .08);
	color: #1f5f42;
	font-weight: 700;
}
.wonk-docu-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: 16px;
	border: 1px solid #e5ece8;
}
.wonk-docu-table {
	width: 100%;
	min-width: 480px;
	border-collapse: collapse;
	background: #fff;
}
.wonk-docu-table th,
.wonk-docu-table td {
	padding: 14px 16px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #edf2ef;
	font-size: 14px;
	line-height: 1.6;
}
.wonk-docu-table th {
	width: 28%;
	background: var(--wc-soft);
	color: var(--wc-main);
	font-weight: 800;
	white-space: nowrap;
}
.wonk-docu-table td {
	color: #54635b;
	font-weight: 500;
}
.wonk-docu-table tr:last-child th,
.wonk-docu-table tr:last-child td { border-bottom: 0; }
.wonk-docu-figure {
	margin: 0;
	overflow: hidden;
	border-radius: 20px;
	background: #f3f7f4;
	border: 1px solid #e5ece8;
	box-shadow: 0 12px 28px rgba(49, 85, 65, .06);
}
.wonk-docu-figure img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	transition: transform .6s ease;
}
.wonk-docu-figure:hover img { transform: scale(1.02); }
.wonk-docu-cta { margin: 4px 0 0; }
.wonk-docu-cta a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px 20px;
	border-radius: 999px;
	background: var(--wc-main);
	color: #fff !important;
	font-size: 14px;
	font-weight: 800;
	text-decoration: none !important;
	box-shadow: 0 10px 22px rgba(39, 132, 92, .22);
	transition: transform .2s ease, box-shadow .2s ease;
}
.wonk-docu-cta a:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 26px rgba(39, 132, 92, .28);
}

/* reveal motion */
.wonk-docu-reveal {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
	will-change: opacity, transform;
}
.wonk-docu-reveal.is-in {
	opacity: 1;
	transform: none;
}
.wonk-docu-reveal[data-delay="1"] { transition-delay: .05s; }
.wonk-docu-reveal[data-delay="2"] { transition-delay: .12s; }
.wonk-docu-reveal[data-delay="3"] { transition-delay: .2s; }
.wonk-docu-reveal[data-delay="4"] { transition-delay: .28s; }
.wonk-docu-reveal[data-delay="5"] { transition-delay: .36s; }

@keyframes wonkDocuFloat {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-4px); }
}

@media (max-width: 760px) {
	.wonk-docu-prose { padding: 20px 16px; border-radius: 18px; }
	.wonk-docu-section { padding: 18px 16px; border-radius: 18px; }
	.wonk-docu-card-grid { grid-template-columns: 1fr; }
	.wonk-docu-steps::before { left: 28px; }
	.wonk-docu-step { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 16px; }
	.wonk-docu-step__num { width: 48px; height: 48px; border-radius: 14px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.wonk-docu-reveal,
	.wonk-docu-reveal.is-in {
		opacity: 1;
		transform: none;
		transition: none;
	}
	.wonk-docu-icon,
	.wonk-docu-card__icon .wonk-docu-icon,
	.wonk-docu-step__icon .wonk-docu-icon {
		animation: none !important;
	}
}