/* ==========================================================================
   VIVA 테마 — 편집형 레이아웃
   색: 종이(흰) / 스톤 / 먹 / 로고 오렌지 한 가지 + 밤의 장(짙은 남흑)
   분위기: '안개가 걷히며 드러나는' 모티프 — 제목 등장, 밤의 장 인용문
   글꼴: Noto Serif KR(제목) + Pretendard(본문)
   ========================================================================== */

:root {
	--paper: #ffffff;
	--stone: #eeece7;
	--ink: #1f1e1c;
	--muted: #6e6a63;
	--rule: #d8d4cc;
	--viva: #f08820;
	--night: #13141a;
	--night-text: #ebe7df;
	--night-muted: rgba(235, 231, 223, 0.62);
	/* 필름 입자 질감 */
	--grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");

	--serif: "Noto Serif KR", "AppleMyungjo", "Nanum Myeongjo", serif;
	--sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;

	--gutter: clamp(16px, 4vw, 48px);
	--max: 1280px;
	--section: clamp(4rem, 9vw, 8rem);
	--field-line: rgba(31, 30, 28, 0.35);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	font-size: var(--viva-base, 100%);
}

body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--sans);
	font-size: calc(1.0625rem * var(--k-body, 1));
	line-height: calc(1.8 * var(--k-lead, 1));
	word-break: keep-all;
	overflow-wrap: break-word;
	-webkit-font-smoothing: antialiased;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--viva);
	outline-offset: 3px;
}

/* 페이지 전환 후 스크립트가 제목으로 옮긴 초점은 테두리를 그리지 않는다 */
[tabindex="-1"]:focus {
	outline: none;
}

h1, h2, h3, h4, p, ul, ol, figure, blockquote {
	margin: 0;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.viva-skip {
	position: absolute;
	left: 1rem;
	top: -4rem;
	z-index: 100;
	padding: 0.6rem 1rem;
	background: var(--ink);
	color: var(--paper);
}

.viva-skip:focus {
	top: 1rem;
}

.viva-lock {
	overflow: hidden;
}

/* ---------- 레이아웃 기본 ---------- */

.viva-wrap {
	width: 100%;
	max-width: var(--max);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.viva-section {
	padding-block: var(--section);
}

.viva-section + .viva-section {
	padding-top: 0;
}

.viva-section--tight {
	padding-top: clamp(2rem, 4vw, 3rem);
}

.viva-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.5rem 2rem;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.viva-band {
	background: var(--stone);
	padding-block: var(--section);
}

/* ---------- 밤의 장 ---------- */

.viva-night,
.viva-band--night {
	--field-line: rgba(235, 231, 223, 0.35);
	position: relative;
	isolation: isolate;
	color: var(--night-text);
	background:
		radial-gradient(ellipse 55% 45% at 80% 12%, rgba(240, 136, 32, 0.17), transparent 70%),
		radial-gradient(ellipse 45% 55% at 8% 92%, rgba(118, 112, 170, 0.12), transparent 70%),
		var(--night);
}

.viva-night::before,
.viva-band--night::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var(--grain);
	opacity: 0.06;
	pointer-events: none;
}

.viva-night {
	padding-block: clamp(6rem, 14vw, 12rem) var(--section);
}

.viva-night__quote {
	margin-bottom: clamp(6rem, 12vw, 10rem);
}

.viva-night__quote p {
	max-width: 24em;
	text-wrap: balance;
	font-family: var(--serif);
	font-weight: var(--w-display, 300);
	font-size: calc(clamp(1.9rem, 4.2vw, 3.6rem) * var(--k-display, 1));
	line-height: 1.5;
	letter-spacing: -0.02em;
}

.viva-night .viva-figure {
	position: relative;
}

.viva-night .viva-figure img {
	filter: saturate(0.7) brightness(0.86) contrast(1.05);
}

/* 사진 가장자리를 어둠 쪽으로 살짝 가라앉힘 */
.viva-night .viva-figure::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	aspect-ratio: 3 / 4;
	box-shadow: inset 0 0 90px rgba(10, 10, 16, 0.55);
	pointer-events: none;
}

.viva-night .viva-figure figcaption,
.viva-night .viva-kicker,
.viva-night .viva-muted,
.viva-band--night .viva-kicker,
.viva-band--night .viva-muted {
	color: var(--night-muted);
}

.viva-night .viva-button--solid {
	background: var(--night-text);
	border-color: var(--night-text);
	color: var(--night);
}

.viva-night .viva-button--solid:hover {
	background: var(--viva);
	border-color: var(--viva);
}

.viva-night .viva-button--text {
	text-decoration-color: rgba(235, 231, 223, 0.35);
}

.viva-night .viva-button--text:hover {
	text-decoration-color: var(--viva);
}

/* ---------- 안개가 걷히는 등장 ---------- */

.viva-line {
	display: block;
	text-wrap: balance;
}

@keyframes viva-fog {
	from {
		opacity: 0;
		filter: blur(14px);
		transform: translateY(0.12em);
	}
	to {
		opacity: 1;
		filter: blur(0);
		transform: none;
	}
}

@keyframes viva-fade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.viva-hero__title .viva-line,
.viva-page-head__title .viva-line {
	animation: viva-fog 1.8s cubic-bezier(0.2, 0.6, 0.2, 1) both;
	animation-delay: calc(0.2s + var(--i, 0) * 0.45s);
}

.viva-hero__body {
	animation: viva-fade 1.2s ease 1.2s both;
}

/* 같은 페이지 안 이동: 출발할 때 제목을 안개 속에 숨겼다가, 도착하면 걷힌다 */
.is-veiled .viva-line {
	opacity: 0;
	filter: blur(14px);
}

.is-arriving .viva-line {
	animation: viva-fog 1.6s cubic-bezier(0.2, 0.6, 0.2, 1) both;
	animation-delay: calc(var(--i, 0) * 0.4s);
}

[data-anchor-target]:focus {
	outline: none;
}

/* 밤의 장 인용문: 화면에 들어올 때 (JS가 있을 때만 숨겨둠) */
.viva-js [data-reveal] .viva-line {
	opacity: 0;
	filter: blur(14px);
}

.viva-js [data-reveal].is-revealed .viva-line {
	animation: viva-fog 2.4s cubic-bezier(0.2, 0.6, 0.2, 1) both;
	animation-delay: calc(var(--i, 0) * 0.7s);
}

/* ---------- 타이포그래피 ---------- */

.viva-display {
	font-family: var(--serif);
	font-weight: var(--w-display, 300);
	font-size: calc(clamp(2.4rem, 6.4vw, 5.75rem) * var(--k-display, 1));
	line-height: 1.16;
	letter-spacing: -0.025em;
}

.viva-display--m {
	font-size: calc(clamp(1.85rem, 3.4vw, 3rem) * var(--k-display, 1));
	line-height: 1.25;
	letter-spacing: -0.02em;
}

.viva-h2 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: calc(clamp(1.5rem, 2.3vw, 2rem) * var(--k-heading, 1));
	line-height: 1.35;
	letter-spacing: -0.015em;
}

.viva-h3 {
	font-family: var(--serif);
	font-weight: 500;
	font-size: calc(1.3rem * var(--k-heading, 1));
	line-height: 1.45;
}

.viva-lede {
	font-size: calc(clamp(1.075rem, 1.3vw, 1.2rem) * var(--k-body, 1));
	line-height: calc(1.85 * var(--k-lead, 1));
	max-width: 34em;
}

.viva-lede + .viva-lede {
	margin-top: 1em;
}

.viva-kicker {
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--muted);
	margin-bottom: 1rem;
}

.viva-muted {
	color: var(--muted);
	font-size: 0.95rem;
}

.viva-crumb {
	display: inline-block;
	margin-bottom: 1.25rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--muted);
	text-decoration: none;
}

.viva-crumb:hover {
	color: var(--ink);
}

/* ---------- 링크·버튼 ---------- */

.viva-link {
	font-size: 0.95rem;
	font-weight: 500;
	text-decoration: underline;
	text-decoration-color: var(--rule);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.4em;
	transition: text-decoration-color 0.15s;
}

.viva-link:hover {
	text-decoration-color: var(--viva);
}

.viva-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 2rem;
	margin-top: 2.25rem;
}

.viva-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3.1rem;
	padding: 0.8rem 1.6rem;
	font: 600 0.95rem/1.2 var(--sans);
	text-decoration: none;
	border: 1px solid var(--ink);
	border-radius: 0;
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.viva-button--solid {
	background: var(--ink);
	color: var(--paper);
}

.viva-button--solid:hover {
	background: var(--viva);
	border-color: var(--viva);
	color: var(--ink);
}

.viva-button--outline {
	background: transparent;
	color: var(--ink);
}

.viva-button--outline:hover {
	background: var(--ink);
	color: var(--paper);
}

.viva-button--text {
	min-height: 0;
	padding: 0;
	border: 0;
	text-decoration: underline;
	text-decoration-color: var(--rule);
	text-underline-offset: 0.4em;
}

.viva-button--text:hover {
	text-decoration-color: var(--viva);
}

/* ---------- 헤더 ---------- */

/* 스크롤해도 화면 위에 붙어 따라온다 */
.viva-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--paper);
	border-bottom: 1px solid var(--rule);
}

.admin-bar .viva-header {
	top: 32px;
}

/* 데스크톱: 스크롤하면 얇게 줄어든다 (viva.js 가 .is-compact 를 붙임) */
@media (min-width: 860px) {
	.viva-header__top,
	.viva-logo img,
	.viva-nav {
		transition: padding 0.3s ease, height 0.3s ease;
	}

	.viva-header.is-compact .viva-header__top {
		padding-top: 0.7rem;
		padding-bottom: 0.4rem;
	}

	.viva-header.is-compact .viva-logo img {
		height: 30px;
	}

	.viva-header.is-compact .viva-nav {
		padding-bottom: 0.45rem;
	}

	.viva-header.is-compact {
		box-shadow: 0 1px 0 var(--rule), 0 8px 24px -18px rgba(19, 20, 26, 0.35);
	}

	.viva-header.no-anim * {
		transition: none !important;
	}
}

.viva-header__top {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 1rem;
	max-width: var(--max);
	margin-inline: auto;
	padding: 1.75rem var(--gutter) 1.25rem;
}

.viva-logo {
	grid-column: 2;
	display: block;
}

.viva-logo img {
	height: 46px;
	width: auto;
}

.viva-header__place {
	grid-column: 1;
	grid-row: 1;
	font-size: 0.85rem;
	color: var(--muted);
}

.viva-header__cta {
	grid-column: 3;
	justify-self: end;
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: var(--viva);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.45em;
}

.viva-menu-toggle {
	display: none;
}

.viva-nav {
	max-width: var(--max);
	margin-inline: auto;
	padding: 0 var(--gutter) 1rem;
}

.viva-nav__list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.25rem 2.5rem;
	list-style: none;
	padding: 0;
}

.viva-nav__list a {
	display: inline-block;
	padding-block: 0.35rem;
	font-size: 0.95rem;
	font-weight: 500;
	text-decoration: none;
	border-bottom: 2px solid transparent;
}

.viva-nav__list a:hover {
	border-bottom-color: var(--rule);
}

.viva-nav__list a[aria-current="page"],
.viva-nav__list .current-menu-item > a {
	border-bottom-color: var(--viva);
}

.viva-nav__cta {
	display: none;
}

/* ---------- 사진 ---------- */

.viva-figure img,
.viva-card__media img,
.viva-article__cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	background: var(--stone);
	/* 출처가 다른 사진들의 색감을 조금 가라앉혀 한 톤으로 맞춤 */
	filter: saturate(0.88) contrast(0.97);
}

.viva-figure--landscape img {
	aspect-ratio: 4 / 3;
}

.viva-figure--portrait img {
	aspect-ratio: 3 / 4;
}

.viva-figure--square img {
	aspect-ratio: 1 / 1;
}

.viva-figure figcaption {
	margin-top: 0.75rem;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--muted);
}

/* ---------- 홈: 첫 화면 ---------- */

.viva-hero {
	padding-top: clamp(3rem, 8vw, 7rem);
	padding-bottom: var(--section);
}

.viva-hero__title {
	margin-bottom: clamp(2.5rem, 6vw, 5rem);
}

.viva-hero__body {
	display: grid;
	gap: 2.5rem;
}

@media (min-width: 960px) {
	.viva-hero__body {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
		align-items: end;
	}

	.viva-hero__text {
		grid-column: 1 / 5;
		padding-bottom: 2.4rem; /* 캡션 높이만큼 올려 사진 하단과 맞춤 */
	}

	.viva-hero__body .viva-figure {
		grid-column: 6 / 13;
	}
}

/* ---------- 좌우 분할(제목 | 본문) ---------- */

.viva-spread {
	display: grid;
	gap: 1.5rem;
}

/* 선은 콘텐츠 폭(좌우 여백 안쪽)에만 긋는다 */
.viva-spread--rule {
	position: relative;
}

.viva-spread--rule::before {
	content: "";
	position: absolute;
	top: 0;
	left: var(--gutter);
	right: var(--gutter);
	border-top: 1px solid var(--rule);
}

.viva-section.viva-spread--rule {
	padding-top: clamp(2.5rem, 5vw, 4rem);
}

@media (min-width: 960px) {
	.viva-spread {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
	}

	.viva-spread__title {
		grid-column: 1 / 5;
	}

	.viva-spread__body {
		grid-column: 6 / 13;
	}
}

/* ---------- 여러 단 ---------- */

.viva-columns {
	display: grid;
	gap: 2.5rem;
}

.viva-columns__item {
	border-top: 1px solid var(--ink);
	padding-top: 1.5rem;
}

.viva-columns__item .viva-h3 {
	margin-bottom: 0.9rem;
}

@media (min-width: 760px) {
	.viva-columns {
		grid-template-columns: repeat(3, 1fr);
		column-gap: 2rem;
	}
}

/* ---------- 서비스 목록(인덱스) ---------- */

.viva-index {
	list-style: none;
	padding: 0;
	border-bottom: 1px solid var(--rule);
}

.viva-index__row {
	display: grid;
	gap: 0.6rem;
	padding-block: clamp(1.6rem, 3vw, 2.4rem);
	border-top: 1px solid var(--rule);
	text-decoration: none;
}

.viva-index__name {
	font-family: var(--serif);
	font-weight: 300;
	font-size: calc(clamp(1.75rem, 3.2vw, 2.6rem) * var(--k-heading, 1));
	line-height: 1.2;
	letter-spacing: -0.02em;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	transition: text-decoration-color 0.15s;
}

.viva-index__row:hover .viva-index__name {
	text-decoration-color: var(--viva);
}

.viva-index__for {
	font-size: 0.9rem;
	color: var(--muted);
}

.viva-index__for > span {
	font-weight: 600;
	color: var(--ink);
	margin-right: 0.35em;
}

@media (min-width: 960px) {
	.viva-index__row {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
		align-items: baseline;
	}

	.viva-index__name {
		grid-column: 1 / 6;
	}

	.viva-index__summary {
		grid-column: 6 / 10;
	}

	.viva-index__for {
		grid-column: 10 / 13;
	}
}

/* ---------- 특집 (사진 + 글) ---------- */

.viva-feature {
	display: grid;
	gap: 2.5rem;
	align-items: center;
}

.viva-feature .viva-figure {
	max-width: 420px;
}

.viva-feature__text .viva-display {
	margin-bottom: 1.75rem;
}

.viva-feature__text .viva-muted {
	margin-top: 1.25rem;
}

@media (min-width: 960px) {
	.viva-feature {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
	}

	.viva-feature .viva-figure {
		grid-column: 2 / 6;
	}

	.viva-feature__text {
		grid-column: 7 / 12;
	}
}

/* ---------- 저널 카드 ---------- */

.viva-grid {
	display: grid;
	gap: 3rem 2rem;
}

@media (min-width: 600px) {
	.viva-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 960px) {
	.viva-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.viva-card__media {
	display: block;
	overflow: hidden;
	margin-bottom: 1.1rem;
}

.viva-card__media img {
	aspect-ratio: 4 / 3;
}

.viva-card__cat {
	display: inline-block;
	margin-bottom: 0.4rem;
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--muted);
	text-decoration: none;
}

.viva-card__cat:hover {
	color: var(--ink);
}

.viva-card__title {
	font-family: var(--serif);
	font-weight: 400;
	font-size: 1.2rem;
	line-height: 1.5;
}

.viva-card__title a {
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: 0.25em;
	text-decoration-thickness: 1px;
	transition: text-decoration-color 0.15s;
}

.viva-card__title a:hover {
	text-decoration-color: var(--viva);
}

.viva-card--feature {
	display: grid;
	gap: 1.5rem;
	margin-bottom: clamp(3rem, 6vw, 5rem);
	padding-bottom: clamp(3rem, 6vw, 5rem);
	border-bottom: 1px solid var(--rule);
}

.viva-card--feature .viva-card__media {
	margin-bottom: 0;
}

.viva-card--feature .viva-card__title {
	font-weight: 300;
	font-size: clamp(1.7rem, 3vw, 2.6rem);
	line-height: 1.3;
	letter-spacing: -0.02em;
	margin-bottom: 1.25rem;
}

.viva-card__excerpt {
	color: var(--muted);
	max-width: 32em;
}

@media (min-width: 960px) {
	.viva-card--feature {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
		align-items: end;
	}

	.viva-card--feature .viva-card__media {
		grid-column: 1 / 8;
	}

	.viva-card--feature .viva-card__body {
		grid-column: 8 / 13;
	}
}

/* ---------- 하위 페이지 머리말 ---------- */

.viva-page-head {
	padding-top: clamp(3rem, 7vw, 6rem);
	padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

.viva-page-head__title {
	max-width: 14em;
	font-size: calc(clamp(2.2rem, 5vw, 4.5rem) * var(--k-display, 1));
}

.viva-page-head__lede {
	margin-top: 1.75rem;
}

.viva-lead-figure {
	padding-bottom: clamp(2rem, 4vw, 3rem);
}

.viva-lead-figure .viva-figure {
	max-width: 780px;
	margin-left: auto;
}

.viva-lead-figure--narrow .viva-figure {
	max-width: 620px;
}

/* ---------- 소개 ---------- */

.viva-about-open {
	display: grid;
	gap: 2.5rem;
	padding-bottom: var(--section);
	align-items: center;
}

.viva-quote p {
	font-family: var(--serif);
	font-weight: 300;
	font-size: calc(clamp(1.6rem, 2.8vw, 2.4rem) * var(--k-heading, 1));
	line-height: 1.45;
	letter-spacing: -0.015em;
}

.viva-quote cite {
	display: block;
	margin-top: 1.5rem;
	font-style: normal;
	font-size: 0.9rem;
	color: var(--muted);
}

@media (min-width: 960px) {
	.viva-about-open {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
	}

	.viva-about-open .viva-figure {
		grid-column: 1 / 7;
	}

	.viva-quote {
		grid-column: 8 / 13;
	}
}

.viva-prose p + p {
	margin-top: 1.1em;
}

.viva-list {
	list-style: none;
	padding: 0;
}

.viva-list li {
	padding-block: 0.9rem;
	border-bottom: 1px solid var(--rule);
}

.viva-list li:first-child {
	padding-top: 0;
}

.viva-list--large li {
	font-family: var(--serif);
	font-size: clamp(1.2rem, 1.8vw, 1.5rem);
	font-weight: 300;
}

/* ---------- 서비스 페이지 ---------- */

.viva-stories {
	padding-bottom: var(--section);
}

.viva-story {
	display: grid;
	gap: 2rem;
	padding-block: clamp(3rem, 6vw, 5rem);
	border-top: 1px solid var(--rule);
	align-items: center;
}

.viva-story__text .viva-display {
	margin-bottom: 1.25rem;
}

.viva-story__text .viva-display a {
	text-decoration: none;
}

.viva-story__text > p + p {
	margin-top: 1rem;
}

.viva-story__text .viva-link {
	display: inline-block;
	margin-top: 1.75rem;
}

@media (min-width: 960px) {
	.viva-story {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
	}

	.viva-story .viva-figure {
		grid-column: 1 / 7;
	}

	.viva-story__text {
		grid-column: 8 / 13;
	}

	.viva-story:nth-child(even) .viva-figure {
		grid-column: 7 / 13;
		grid-row: 1;
	}

	.viva-story:nth-child(even) .viva-story__text {
		grid-column: 1 / 6;
		grid-row: 1;
	}

	.viva-story--text .viva-story__text,
	.viva-story--text:nth-child(even) .viva-story__text {
		grid-column: 1 / 9;
	}
}

/* 순서가 있는 단계 */
.viva-steps {
	list-style: none;
	padding: 0;
	display: grid;
	gap: 2.5rem;
	counter-reset: none;
}

.viva-steps__item {
	border-top: 1px solid var(--ink);
	padding-top: 1.25rem;
}

.viva-steps__num {
	display: block;
	font-family: var(--serif);
	font-weight: 300;
	font-size: 3.25rem;
	line-height: 1;
	margin-bottom: 1.5rem;
}

.viva-spread__body > .viva-h3 + p {
	margin-top: 0.75rem;
}

.viva-steps__item .viva-h3 {
	margin-bottom: 0.75rem;
}

@media (min-width: 760px) {
	.viva-steps {
		grid-template-columns: repeat(3, 1fr);
		column-gap: 2rem;
	}
}

.viva-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	padding: 0;
	margin-top: 1.25rem;
}

.viva-tags li {
	padding: 0.2rem 0.8rem;
	border: 1px solid var(--rule);
	border-radius: 999px;
	font-size: 0.85rem;
}

.viva-siblings {
	display: grid;
	gap: 0;
	padding-block: clamp(2.5rem, 5vw, 4rem) var(--section);
}

.viva-siblings a {
	display: flex;
	flex-direction: column;
	padding-block: 1.25rem;
	border-top: 1px solid var(--rule);
	text-decoration: none;
}

.viva-siblings__name {
	font-family: var(--serif);
	font-weight: 300;
	font-size: 1.5rem;
	line-height: 1.3;
}

.viva-siblings a:hover .viva-siblings__name {
	text-decoration: underline;
	text-decoration-color: var(--viva);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

@media (min-width: 760px) {
	.viva-siblings {
		grid-template-columns: repeat(3, 1fr);
		column-gap: 2rem;
	}
}

/* ---------- 상담 유도 띠 ---------- */

.viva-closing__inner {
	display: grid;
	gap: 2rem;
}

.viva-closing .viva-lede {
	margin-bottom: 2rem;
}

@media (min-width: 960px) {
	.viva-closing__inner {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
		align-items: start;
	}

	.viva-closing__inner > h2 {
		grid-column: 1 / 7;
	}

	.viva-closing__inner > div {
		grid-column: 8 / 13;
	}
}

/* ---------- FAQ ---------- */

.viva-faq {
	padding-bottom: var(--section);
}

.viva-faq > * {
	max-width: 900px;
}

.viva-faq__item {
	border-top: 1px solid var(--rule);
}

.viva-faq__item:last-child {
	border-bottom: 1px solid var(--rule);
}

.viva-faq__item summary {
	position: relative;
	padding: 1.5rem 3rem 1.5rem 0;
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(1.15rem, 1.8vw, 1.4rem);
	line-height: 1.5;
	cursor: pointer;
	list-style: none;
}

.viva-faq__item summary::-webkit-details-marker {
	display: none;
}

.viva-faq__item summary::after {
	content: "";
	position: absolute;
	right: 0.4rem;
	top: 50%;
	width: 12px;
	height: 12px;
	border-right: 1.5px solid var(--ink);
	border-bottom: 1.5px solid var(--ink);
	transform: translateY(-75%) rotate(45deg);
	transition: transform 0.2s;
}

.viva-faq__item[open]:not(.is-closing) summary::after {
	transform: translateY(-25%) rotate(-135deg);
}

/* 열린 질문 왼쪽에 주황 선이 스크린처럼 함께 내려온다 */
.viva-faq__answer {
	position: relative;
}

.viva-faq__answer::before {
	content: "";
	position: absolute;
	left: -1.25rem;
	top: 0;
	bottom: 2rem;
	width: 2px;
	background: linear-gradient(to bottom, var(--viva), rgba(240, 136, 32, 0));
}

@media (max-width: 959px) {
	.viva-faq__answer::before {
		display: none;
	}
}

.viva-faq__answer {
	padding-bottom: 2rem;
	max-width: 44em;
	color: #3a3834;
}

/* ---------- 상담 문의 + 폼 ---------- */

.viva-contact {
	display: grid;
	gap: 3rem;
}

.viva-contact--page {
	padding-bottom: var(--section);
}

.viva-contact__intro .viva-display {
	margin-bottom: 1.5rem;
}

.viva-contact__address {
	margin-top: 2rem;
	font-style: normal;
	line-height: 1.9;
}

.viva-contact--page .viva-contact__address {
	margin: 1rem 0 1.5rem;
}

.viva-contact__address a {
	text-decoration: none;
}

.viva-contact__address a:hover {
	text-decoration: underline;
}

@media (min-width: 960px) {
	.viva-contact {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
	}

	.viva-contact__intro {
		grid-column: 1 / 6;
	}

	.viva-contact__form {
		grid-column: 7 / 13;
	}
}

/* 제출 뒤 돌아오는 자리: 붙어 있는 헤더에 가리지 않게 */
#viva-contact {
	scroll-margin-top: 140px;
}

/* 상담 문의 접수 성공 (제출 효과를 거쳐 왔을 때만): 안내가 떠오르며 오렌지 선이 그어진다 */
@keyframes viva-sent-in {
	from {
		opacity: 0;
		transform: translateY(18px) scale(0.97);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes viva-sent-line {
	from { transform: scaleX(0); }
	to { transform: scaleX(1); }
}

.viva-arrive--sent .viva-contact-notice.success {
	position: relative;
	overflow: hidden;
	animation: viva-sent-in 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) 0.15s both;
}

.viva-arrive--sent .viva-contact-notice.success::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: var(--viva);
	transform-origin: 0 50%;
	animation: viva-sent-line 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) 0.7s both;
}

/* viva-admin-contact-form mu-plugin 의 인라인 스타일 덮어쓰기 */
.viva-contact .viva-admin-contact {
	background: transparent;
	max-width: none;
}

.viva-contact .viva-admin-contact form {
	align-items: end;
	row-gap: 1.75rem;
	column-gap: 2rem;
}

.viva-contact .viva-admin-contact label {
	color: inherit;
	font-size: 0.875rem;
	font-weight: 500;
}

.viva-contact .viva-admin-contact input,
.viva-contact .viva-admin-contact textarea {
	margin-top: 0.35rem;
	padding: 0.65rem 0;
	background: transparent;
	color: inherit;
	border: 0;
	border-bottom: 1px solid var(--field-line);
	border-radius: 0;
	font-size: 1rem;
}

.viva-contact .viva-admin-contact textarea {
	height: 160px;
	border: 1px solid var(--field-line);
	padding: 0.75rem;
	margin-top: 0.6rem;
}

.viva-contact .viva-admin-contact input:focus,
.viva-contact .viva-admin-contact textarea:focus {
	outline: none;
	border-color: var(--viva);
}

.viva-contact .viva-admin-contact button {
	min-height: 3.1rem;
	padding: 0.8rem 2.2rem;
	background: var(--viva);
	color: var(--ink);
	border-radius: 0;
	font: 600 0.95rem/1.2 var(--sans);
}

.viva-contact .viva-admin-contact button:hover {
	background: var(--paper);
}

.viva-contact--page .viva-admin-contact button:hover {
	background: var(--ink);
	color: var(--paper);
}

/* ---------- 저널 필터·페이지 넘김 ---------- */

.viva-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.75rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--rule);
}

.viva-filter a {
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--muted);
	text-decoration: none;
	padding-block: 0.3rem;
	border-bottom: 2px solid transparent;
}

.viva-filter a:hover {
	color: var(--ink);
}

.viva-filter a[aria-current="page"] {
	color: var(--ink);
	border-bottom-color: var(--viva);
}

/* 글쓰기 (글 작성 권한이 있는 로그인 사용자에게만 보임) — 카테고리 메뉴 오른쪽 끝 */
.viva-filter .viva-write {
	margin-left: auto;
	padding: 0.35rem 1.1rem;
	border: 1px solid var(--ink);
	border-bottom-width: 1px;
	color: var(--ink);
	font-weight: 600;
}

.viva-filter .viva-write::before {
	content: "+ ";
}

.viva-filter .viva-write:hover {
	background: var(--ink);
	color: var(--paper);
}

/* 글쓰기 결과 안내 (예: 검토 요청 접수) */
.viva-notice {
	margin-bottom: 2rem;
	padding: 0.9rem 1.1rem;
	border-left: 3px solid var(--viva);
	background: var(--stone);
	font-size: 0.95rem;
}

/* ---------- 사이트 안 글쓰기 화면 ---------- */

.viva-write-form {
	max-width: calc(960px + 2 * var(--gutter));
	margin-left: 0;
	padding-bottom: var(--section);
}

@media (min-width: 960px) {
	.viva-write-form {
		margin-left: max(0px, calc((100vw - var(--max)) / 2));
	}
}

.viva-write-form__error {
	margin-bottom: 1.5rem;
	padding: 0.9rem 1.1rem;
	border-left: 3px solid #b3261e;
	background: #fdf1ef;
	color: #8c1d18;
	font-size: 0.95rem;
}

.viva-write-form__row {
	display: grid;
	gap: 1.5rem;
	margin-bottom: 2rem;
}

@media (min-width: 760px) {
	.viva-write-form__row {
		grid-template-columns: 1fr 240px;
		column-gap: 2rem;
	}
}

.viva-write-form__field,
.viva-write-form__label {
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
}

.viva-write-form__field span {
	display: block;
	margin-bottom: 0.4rem;
}

.viva-write-form__field input,
.viva-write-form__field select {
	width: 100%;
	padding: 0.7rem 0;
	border: 0;
	border-bottom: 1px solid var(--field-line);
	border-radius: 0;
	background: transparent;
	font: inherit;
	font-weight: 400;
	color: var(--ink);
}

.viva-write-form__field--title input {
	font-family: var(--serif);
	font-size: 1.5rem;
	font-weight: 300;
}

.viva-write-form__field input:focus,
.viva-write-form__field select:focus {
	outline: none;
	border-color: var(--viva);
}

.viva-write-form__label {
	margin-bottom: 0.6rem;
}

/* 대표 사진: 저널 카드와 같은 4:3 로 미리보기 */
.viva-write-form__thumb {
	margin-bottom: 2rem;
}

.viva-write-form__thumb-box {
	position: relative;
	width: min(100%, 360px);
	aspect-ratio: 4 / 3;
	border: 1px dashed var(--field-line);
	background: var(--stone);
	display: grid;
	place-items: center;
	overflow: hidden;
}

.viva-write-form__thumb.has-image .viva-write-form__thumb-box {
	border-style: solid;
	border-color: var(--rule);
}

.viva-write-form__thumb-box img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.viva-write-form__thumb-empty {
	padding: 1rem 1.25rem;
	font-size: 0.85rem;
	text-align: center;
}

.viva-write-form__thumb.has-image .viva-write-form__thumb-empty {
	visibility: hidden;
}

.viva-write-form__thumb-actions {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	margin-top: 0.9rem;
}

.viva-write-form__thumb-actions .viva-button--outline {
	min-height: 2.6rem;
	padding: 0.55rem 1.2rem;
}

[hidden] {
	display: none !important;
}

.viva-write-form__editor .wp-editor-wrap {
	border: 1px solid var(--rule);
}

.viva-write-form__editor .viva-muted {
	margin-top: 0.75rem;
	font-size: 0.85rem;
}

.viva-write-form__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-top: 2rem;
}

/* 글 수정·삭제 (viva-post-manage mu-plugin 이 본문 끝에 붙이는 버튼) — 인라인 스타일보다 우선 */
.viva-prose .vbi-post-toolbar {
	display: flex;
	gap: 0.75rem;
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--rule);
}

.viva-prose .vbi-post-toolbar a {
	padding: 0.55rem 1.2rem;
	border-radius: 0;
	font: 600 0.875rem/1.2 var(--sans);
	text-decoration: none;
}

.viva-prose .vbi-post-toolbar .vbi-post-edit-btn {
	background: var(--ink);
	border: 1px solid var(--ink);
	color: var(--paper);
}

.viva-prose .vbi-post-toolbar .vbi-post-edit-btn:hover {
	background: var(--viva);
	border-color: var(--viva);
	color: var(--ink);
}

.viva-prose .vbi-post-toolbar .vbi-post-delete-btn {
	background: transparent;
	border: 1px solid #b3261e;
	color: #b3261e;
}

.viva-prose .vbi-post-toolbar .vbi-post-delete-btn:hover {
	background: #b3261e;
	color: var(--paper);
}

.viva-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	margin-top: 4rem;
	padding-top: 2rem;
	border-top: 1px solid var(--rule);
}

.viva-pagination .page-numbers {
	text-decoration: none;
	color: var(--muted);
}

.viva-pagination .current {
	color: var(--ink);
	font-weight: 600;
}

/* ---------- 글 상세 ---------- */

.viva-article__head {
	max-width: 900px;
	padding-top: clamp(3rem, 7vw, 6rem);
	padding-bottom: 2.5rem;
	text-align: center;
}

.viva-article__title {
	font-size: calc(clamp(2rem, 4.6vw, 3.6rem) * var(--k-display, 1));
	margin-bottom: 1.25rem;
}

.viva-article__cover {
	max-width: calc(760px + 2 * var(--gutter));
	margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.viva-article__cover img {
	height: auto;
	object-fit: contain;
}

.viva-article__body {
	max-width: calc(680px + 2 * var(--gutter));
	font-size: calc(1.075rem * var(--k-body, 1));
	line-height: calc(1.95 * var(--k-lead, 1));
}

.viva-article__edit {
	max-width: calc(680px + 2 * var(--gutter));
	margin-top: 2rem;
}

.viva-prose > * + * {
	margin-top: 1.2em;
}

.viva-prose h2,
.viva-prose h3,
.viva-prose h4 {
	font-family: var(--serif);
	font-weight: 500;
	line-height: 1.45;
	margin-top: 2.2em;
}

.viva-prose h2 {
	font-size: calc(1.55rem * var(--k-heading, 1));
}

.viva-prose h3 {
	font-size: calc(1.3rem * var(--k-heading, 1));
}

.viva-prose a {
	text-decoration-color: var(--viva);
	text-underline-offset: 0.25em;
}

.viva-prose ul,
.viva-prose ol {
	padding-left: 1.3em;
}

.viva-prose blockquote {
	padding-left: 1.25rem;
	border-left: 2px solid var(--viva);
	font-family: var(--serif);
	font-size: 1.15rem;
}

.viva-prose hr,
.viva-prose .wp-block-separator {
	border: 0;
	border-top: 1px solid var(--rule);
	margin-block: 2.5em;
	width: 100%;
}

.viva-prose figure {
	margin-block: 2em;
}

.viva-prose img {
	margin-inline: auto;
}

.viva-prose figcaption,
.viva-prose .wp-element-caption {
	margin-top: 0.6rem;
	font-size: 0.8125rem;
	color: var(--muted);
	text-align: center;
}

.viva-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
}

.viva-prose th,
.viva-prose td {
	border-bottom: 1px solid var(--rule);
	padding: 0.6rem 0.4rem;
	text-align: left;
}

.viva-page-body {
	padding-bottom: var(--section);
}

.viva-page-body > * {
	max-width: 760px;
}

.viva-related {
	padding-top: var(--section);
}

/* ---------- 댓글 ---------- */

.viva-comments-wrap {
	max-width: calc(680px + 2 * var(--gutter));
	padding-bottom: var(--section);
}

.viva-comments {
	border-top: 1px solid var(--rule);
	padding-top: 2.5rem;
}

.viva-comments__list {
	list-style: none;
	padding: 0;
	margin: 1.5rem 0 2.5rem;
}

.viva-comments__list .comment-body {
	padding-block: 1.25rem;
	border-bottom: 1px solid var(--rule);
	font-size: 0.975rem;
}

.viva-comments__list .comment-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.25rem 0.75rem;
	font-size: 0.85rem;
	color: var(--muted);
}

.viva-comments__list .comment-meta .fn {
	font-weight: 600;
	color: var(--ink);
}

.viva-comments__list .comment-content {
	margin-top: 0.5rem;
}

.viva-comments__list .children {
	list-style: none;
	padding-left: 1.5rem;
	border-left: 1px solid var(--rule);
}

/* 답글 · 삭제 */
.viva-comment-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 1.25rem;
	margin-top: 0.6rem;
	font-size: 0.85rem;
}

.viva-comment-actions a,
.viva-comment-actions > button {
	padding: 0;
	border: 0;
	background: none;
	color: var(--muted);
	font: inherit;
	text-decoration: underline;
	text-decoration-color: var(--rule);
	text-underline-offset: 0.3em;
	cursor: pointer;
}

.viva-comment-actions a:hover,
.viva-comment-actions > button:hover {
	color: var(--ink);
}

.viva-comment-actions .viva-comment-delete:hover {
	color: #b3261e;
	text-decoration-color: #b3261e;
}

/* 비회원 본인 삭제: 비밀번호 칸 */
.viva-comment-pw {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.viva-comment-pw input {
	width: 11rem;
	padding: 0.4rem 0.6rem;
	border: 1px solid var(--rule);
	font: inherit;
}

.viva-comment-pw button {
	padding: 0.4rem 0.9rem;
	border: 1px solid var(--ink);
	background: var(--paper);
	font: inherit;
	cursor: pointer;
}

.viva-comment-pw button[type="submit"] {
	border-color: #b3261e;
	background: #b3261e;
	color: var(--paper);
}

.viva-comments #commentform #submit {
	padding: 0.8rem 1.6rem;
	background: var(--ink);
	color: var(--paper);
	border: 0;
	border-radius: 0;
	font: 600 0.95rem/1.2 var(--sans);
	cursor: pointer;
}

.viva-comments #commentform #submit:hover {
	background: var(--viva);
	color: var(--ink);
}

.viva-comments .comment-form p {
	margin-top: 1rem;
}

.viva-comments .comment-form label {
	display: block;
	font-size: 0.875rem;
	font-weight: 500;
}

.viva-comments .comment-form input[type="text"],
.viva-comments .comment-form input[type="number"],
.viva-comments .comment-form textarea {
	width: 100%;
	margin-top: 0.35rem;
	padding: 0.7rem;
	border: 1px solid var(--rule);
	font: inherit;
	background: var(--paper);
}

/* ---------- 푸터 ---------- */

.viva-footer {
	border-top: 1px solid var(--rule);
	font-size: 0.95rem;
}

.viva-band--night + .viva-footer,
.viva-band + .viva-footer {
	border-top: 0;
}

.viva-footer__inner {
	display: grid;
	gap: 2.5rem;
	max-width: var(--max);
	margin-inline: auto;
	padding: clamp(3.5rem, 7vw, 6rem) var(--gutter) 3rem;
}

.viva-footer__motto {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(1.5rem, 2.4vw, 2rem);
	line-height: 1.35;
	margin-bottom: 1.75rem;
}

.viva-footer__heading {
	font-size: 0.875rem;
	font-weight: 600;
	margin-bottom: 0.9rem;
}

.viva-footer address {
	font-style: normal;
	line-height: 1.9;
	color: var(--muted);
}

.viva-footer ul {
	list-style: none;
	padding: 0;
	line-height: 2;
}

.viva-footer a {
	text-decoration: none;
	color: var(--muted);
}

.viva-footer a:hover {
	color: var(--ink);
	text-decoration: underline;
}

.viva-footer .viva-button--solid {
	color: var(--paper);
}

.viva-footer .viva-button--solid:hover {
	color: var(--ink);
	text-decoration: none;
}

.viva-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	max-width: var(--max);
	margin-inline: auto;
	padding: 1.5rem var(--gutter) 2.5rem;
	position: relative;
	font-size: 0.8125rem;
	color: var(--muted);
}

.viva-footer__legal::before {
	content: "";
	position: absolute;
	top: 0;
	left: var(--gutter);
	right: var(--gutter);
	border-top: 1px solid var(--rule);
}

.viva-footer__legal p {
	margin-right: auto;
}

@media (min-width: 960px) {
	.viva-footer__inner {
		grid-template-columns: repeat(12, 1fr);
		column-gap: 2rem;
	}

	.viva-footer__brand {
		grid-column: 1 / 6;
	}

	.viva-footer__col:nth-of-type(2) {
		grid-column: 6 / 9;
	}

	.viva-footer__col:nth-of-type(3) {
		grid-column: 9 / 11;
	}

	.viva-footer__col:nth-of-type(4) {
		grid-column: 11 / 13;
	}
}

@media (min-width: 600px) and (max-width: 959px) {
	.viva-footer__inner {
		grid-template-columns: repeat(3, 1fr);
	}

	.viva-footer__brand {
		grid-column: 1 / -1;
	}
}

/* ---------- 모바일 헤더 ---------- */

@media (max-width: 859px) {
	.admin-bar .viva-header {
		top: 46px;
	}

	.viva-header__top {
		grid-template-columns: 1fr auto;
		padding-block: 0.9rem;
	}

	.viva-logo {
		grid-column: 1;
		position: relative;
		z-index: 2;
	}

	.viva-logo img {
		height: 32px;
	}

	.viva-header__place,
	.viva-header__cta {
		display: none;
	}

	.viva-menu-toggle {
		display: inline-flex;
		align-items: center;
		grid-column: 2;
		position: relative;
		z-index: 2;
		min-height: 44px;
		padding: 0 0.25rem;
		background: none;
		border: 0;
		font: 600 0.95rem var(--sans);
		color: var(--ink);
		cursor: pointer;
	}

	.viva-nav {
		display: none;
	}

	.viva-header.is-open .viva-nav {
		display: flex;
		flex-direction: column;
		position: fixed;
		inset: 0;
		z-index: 1;
		padding: 5.5rem var(--gutter) 2rem;
		background: var(--paper);
		overflow-y: auto;
	}

	.viva-header.is-open .viva-header__top {
		position: relative;
		z-index: 3;
	}

	.viva-nav__list {
		flex-direction: column;
		gap: 0;
	}

	.viva-nav__list li {
		border-bottom: 1px solid var(--rule);
	}

	.viva-nav__list a {
		display: block;
		padding-block: 1rem;
		font-family: var(--serif);
		font-weight: 300;
		font-size: 1.6rem;
		border-bottom: 0;
	}

	.viva-nav__list a[aria-current="page"] {
		color: var(--viva);
	}

	.viva-nav__cta {
		display: inline-flex;
		align-self: flex-start;
		margin-top: 2rem;
		padding: 0.8rem 1.6rem;
		background: var(--ink);
		color: var(--paper);
		font-weight: 600;
		text-decoration: none;
	}
}

/* ---------- 페이지 전환: 지금 페이지가 반으로 갈라짐 ---------- */

/* 복제한 현재 화면의 왼쪽·오른쪽 반쪽 */
.viva-split {
	position: fixed;
	inset: 0;
	z-index: 200;
	pointer-events: none;
}

.viva-split__half {
	position: absolute;
	inset: 0;
	overflow: hidden;
	transition: transform 1.1s cubic-bezier(0.7, 0, 0.2, 1);
	will-change: transform;
}

.viva-split {
	--split-top: 0px;
}

.viva-split__half--l {
	clip-path: inset(var(--split-top) 50% 0 0);
}

.viva-split__half--r {
	clip-path: inset(var(--split-top) 0 0 50%);
}

.viva-split.is-opening .viva-split__half--l {
	transform: translateX(-52%);
}

.viva-split.is-opening .viva-split__half--r {
	transform: translateX(52%);
}

/* 갈라진 단면에 그림자를 드리워 두께감 */
.viva-split__half::after {
	content: "";
	position: absolute;
	top: var(--split-top);
	bottom: 0;
	width: 48px;
	opacity: 0;
	transition: opacity 0.4s ease;
}

.viva-split__half--l::after {
	left: calc(50% - 48px);
	background: linear-gradient(to right, transparent, rgba(19, 20, 26, 0.18));
}

.viva-split__half--r::after {
	left: 50%;
	background: linear-gradient(to left, transparent, rgba(19, 20, 26, 0.18));
}

.viva-split.is-opening .viva-split__half::after {
	opacity: 1;
}

.viva-split__page {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background: var(--paper);
}

/* 복제본에서는 등장 효과를 다시 재생하지 않는다 */
.viva-split__page,
.viva-split__page *,
.viva-split__page *::before,
.viva-split__page *::after {
	animation: none !important;
	transition: none !important;
}

.viva-split [data-reveal].is-revealed .viva-line {
	opacity: 1;
	filter: none;
}

/* 뒤에서 새 페이지가 안에서 밖으로 커지며 나온다.
   끝 상태를 transform: none 으로 두어야 고정 위치 요소(모바일 메뉴)가 틀에 갇히지 않는다. */
@keyframes viva-emerge {
	from {
		opacity: 0.2;
		transform: scale(0.9);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.viva-stage {
	transform-origin: 50% 50vh;
}

.viva-swapping .viva-stage {
	animation: viva-emerge 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

/* 갈라지는 동안 제목 안개는 조금 늦게 */
.viva-swapping .viva-hero__title .viva-line,
.viva-swapping .viva-page-head__title .viva-line {
	animation-delay: calc(0.55s + var(--i, 0) * 0.45s);
}

.viva-swapping .viva-hero__body {
	animation-delay: 1.4s;
}

/* ---------- 페이지 전환: 누른 자리에서 번지는 빛 (버튼) ---------- */

.viva-ripple {
	--split-top: 0px;
	position: fixed;
	inset: 0;
	z-index: 200;
	pointer-events: none;
	clip-path: inset(var(--split-top) 0 0 0); /* 헤더는 가리지 않는다 */
}

/* 지금 화면의 복제본. (x, y)에서 구멍이 커지며 가장자리는 부드럽게 번진다 */
.viva-ripple__veil {
	position: absolute;
	inset: 0;
	-webkit-mask-image: radial-gradient(circle at var(--x) var(--y), transparent var(--viva-r), #000 calc(var(--viva-r) + 70px));
	mask-image: radial-gradient(circle at var(--x) var(--y), transparent var(--viva-r), #000 calc(var(--viva-r) + 70px));
}

/* 원 가장자리를 따라 퍼지는 오렌지빛 고리 */
.viva-ripple__ring {
	position: absolute;
	left: var(--x);
	top: var(--y);
	border-radius: 50%;
	border: 1px solid rgba(240, 136, 32, 0.85);
	box-shadow:
		0 0 36px 8px rgba(240, 136, 32, 0.28),
		inset 0 0 36px 4px rgba(240, 136, 32, 0.22);
	transform: scale(0);
}

/* 번지는 동안 새 페이지 제목의 안개는 조금 늦게 */
.viva-rippling .viva-hero__title .viva-line,
.viva-rippling .viva-page-head__title .viva-line {
	animation-delay: calc(0.45s + var(--i, 0) * 0.45s);
}

.viva-rippling .viva-hero__body {
	animation-delay: 1.3s;
}

/* ---------- 페이지 전환: 저널 카드 사진이 글의 대표 사진으로 ---------- */

.viva-morph {
	--split-top: 0px;
	position: fixed;
	inset: 0;
	z-index: 200;
	pointer-events: none;
	clip-path: inset(var(--split-top) 0 0 0); /* 헤더는 가리지 않는다 */
}

.viva-morph__veil {
	position: absolute;
	inset: 0;
}

.viva-morph__img {
	position: absolute;
	max-width: none;
	object-fit: cover;
	background: var(--stone);
	filter: saturate(0.88) contrast(0.97); /* 카드·대표 사진과 같은 색감 */
	box-shadow: 0 24px 60px -30px rgba(19, 20, 26, 0.45);
}

/* 사진이 날아가는 동안 글 본문은 은은하게 나타난다 */
.viva-morphing .viva-stage {
	animation: viva-fade 0.7s ease 0.25s both;
}

/* ---------- 페이지 전환: 책장 넘김 (저널 카테고리·페이지 번호) ---------- */

.viva-turn {
	--split-top: 0px;
	position: fixed;
	inset: 0;
	z-index: 200;
	pointer-events: none;
	clip-path: inset(var(--split-top) 0 0 0); /* 헤더는 가리지 않는다 */
}

.viva-turn__base,
.viva-turn__shade,
.viva-turn__book {
	position: absolute;
	inset: 0;
}

/* 넘어가는 종이 밑에 드리우는 그림자 (책등 쪽이 짙다) */
.viva-turn__shade {
	background: linear-gradient(to right, rgba(19, 20, 26, 0.28), rgba(19, 20, 26, 0.08) 45%, transparent 75%);
	opacity: 0;
}

.viva-turn__book {
	perspective: 2200px;
	perspective-origin: 0% 50%;
}

/* 종이 한 장: 왼쪽 가장자리가 책등 */
.viva-turn__page {
	position: absolute;
	inset: 0;
	overflow: hidden;
	transform-origin: 0% 50%;
	backface-visibility: hidden;
	will-change: transform;
	box-shadow: 18px 0 40px -20px rgba(19, 20, 26, 0.35);
}

.viva-turn--backward .viva-turn__page {
	transform: rotateY(-100deg);
	opacity: 0;
}

/* 종이가 기울수록 어두워지는 면 */
.viva-turn__gloss {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to left, rgba(19, 20, 26, 0.4), rgba(19, 20, 26, 0.12) 50%, rgba(255, 255, 255, 0.08));
	opacity: 0;
}

/* ---------- 페이지 전환: 목차가 펼쳐짐 (네 가지 영역 → 서비스) ---------- */

.viva-unfold,
.viva-slide {
	--split-top: 0px;
	position: fixed;
	inset: 0;
	z-index: 200;
	pointer-events: none;
	clip-path: inset(var(--split-top) 0 0 0); /* 헤더는 가리지 않는다 */
}

.viva-unfold__veil,
.viva-slide__veil {
	position: absolute;
	inset: 0;
}

.viva-unfold__dim {
	position: absolute;
	inset: 0;
	background: var(--paper);
	opacity: 0;
}

.viva-unfold__panel {
	position: absolute;
	background: var(--paper);
}

.viva-unfold__line {
	position: absolute;
	height: 1px;
	background: var(--ink);
}

.viva-unfold__name {
	position: absolute;
	margin: 0;
	white-space: nowrap;
	color: var(--ink);
	transform-origin: 0 0;
	will-change: transform;
}

/* 펼쳐지는 동안 새 서비스 페이지 제목의 안개는 늦게 */
.viva-unfolding .viva-page-head__title .viva-line {
	animation-delay: calc(0.8s + var(--i, 0) * 0.45s);
}

/* ---------- 페이지 전환: 옆 장으로 (서비스 → 다른 서비스) ---------- */

.viva-slide__veil {
	background: var(--paper);
	box-shadow: 0 0 60px rgba(19, 20, 26, 0.12);
}

.viva-slide__sweep {
	position: absolute;
	top: 55%;
	left: 0;
	white-space: nowrap;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(5rem, 16vw, 15rem);
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--ink);
	opacity: 0;
}

/* 밀려 들어오는 동안 가로 스크롤이 생기지 않게 */
.viva-sliding,
.viva-sliding body {
	overflow-x: clip;
}

.viva-sliding .viva-page-head__title .viva-line {
	animation-delay: calc(0.6s + var(--i, 0) * 0.45s);
}

/* ---------- 글쓰기·등록·수정·삭제 애니메이션 (viva.js 의 viva-arrive 참고) ---------- */

/* 글쓰기 버튼: 빈 종이가 아래에서 올라와 헤더 아래를 덮는다 */
.viva-sheet {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 45; /* 헤더(50) 아래 */
	background: var(--paper);
	box-shadow: 0 -24px 48px -24px rgba(19, 20, 26, 0.35);
	transform: translateY(100%);
	transition: transform 0.6s cubic-bezier(0.7, 0, 0.2, 1);
	pointer-events: none;
}

.viva-sheet.is-up {
	transform: translateY(0);
}

@keyframes viva-rise {
	from {
		opacity: 0;
		transform: translateY(36px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.viva-arrive--write .viva-stage {
	animation: viva-rise 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

/* 글쓰기 취소: 글쓰기 화면(종이)이 아래로 내려가며 사라지고, 이전 목록이 은은하게 나타난다 */
.viva-stage.is-sheet-down {
	background: var(--paper);
	box-shadow: 0 -24px 48px -24px rgba(19, 20, 26, 0.35);
}

.viva-arrive--cancelled .viva-stage {
	animation: viva-fade 0.5s ease both;
}

/* 등록·수정 완료: 글이 종이가 내려앉듯 */
@keyframes viva-place {
	from {
		opacity: 0;
		transform: translateY(-28px) scale(0.97);
		filter: blur(6px);
	}
	to {
		opacity: 1;
		transform: none;
		filter: none;
	}
}

.viva-arrive--published .viva-article,
.viva-arrive--updated .viva-article {
	transform-origin: 50% 0;
	animation: viva-place 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.viva-toast {
	position: fixed;
	left: 50%;
	bottom: 2rem;
	z-index: 210;
	padding: 0.85rem 1.4rem;
	background: var(--ink);
	color: var(--paper);
	font-size: 0.95rem;
	font-weight: 500;
	box-shadow: 0 12px 32px -12px rgba(19, 20, 26, 0.5);
	transform: translateX(-50%);
	animation: viva-toast-in 0.5s cubic-bezier(0.2, 0.7, 0.2, 1) 0.6s both;
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.viva-toast.is-gone {
	opacity: 0;
	transform: translate(-50%, 12px);
}

@keyframes viva-toast-in {
	from {
		opacity: 0;
		transform: translate(-50%, 16px);
	}
	to {
		opacity: 1;
		transform: translateX(-50%);
	}
}

/* 삭제 뒤 카테고리 목록: 안내가 내려오고 목록이 떠오른다 */
.viva-arrive--deleted .viva-notice {
	animation: viva-rise 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.viva-arrive--deleted .viva-card--feature,
.viva-arrive--deleted .viva-grid {
	animation: viva-rise 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) 0.15s both;
}

/* 수정 버튼: 대표 사진을 표지로 한 양문형 앨범이 양쪽으로 열린다 */
.viva-doors {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 45; /* 헤더(50) 아래 */
	perspective: 2200px;
	pointer-events: none;
}

.viva-arrive--doors .viva-doors,
.viva-doors--leave {
	display: block;
}

.viva-doors--leave {
	animation: viva-fade 0.35s ease both;
}

.viva-doors__leaf {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50%;
	overflow: hidden;
	backface-visibility: hidden;
	will-change: transform;
}

.viva-doors__leaf--l {
	left: 0;
	transform-origin: 0 50%;
	box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.25);
}

.viva-doors__leaf--r {
	right: 0;
	transform-origin: 100% 50%;
	box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25);
}

/* 표지 한 장을 두 문이 반씩 나눠 가진다 */
.viva-doors__face {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 200%;
	display: grid;
	place-items: center;
	background: var(--night) center / cover no-repeat;
}

.viva-doors__leaf--r .viva-doors__face {
	left: -100%;
}

.viva-doors__face::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(rgba(19, 20, 26, 0.25), rgba(19, 20, 26, 0.55));
}

.viva-doors__title {
	position: relative;
	max-width: 16em;
	padding: 0 var(--gutter);
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(1.8rem, 4vw, 3.4rem);
	line-height: 1.3;
	text-align: center;
	color: var(--paper);
	text-wrap: balance;
}

/* 여닫이 쪽이 어두워지는 면 */
.viva-doors__leaf::after {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0;
}

.viva-doors__leaf--l::after {
	background: linear-gradient(to left, rgba(0, 0, 0, 0.55), transparent 70%);
}

.viva-doors__leaf--r::after {
	background: linear-gradient(to right, rgba(0, 0, 0, 0.55), transparent 70%);
}

@keyframes viva-door-l {
	from { transform: rotateY(0); opacity: 1; }
	85% { opacity: 1; }
	to { transform: rotateY(-108deg); opacity: 0; }
}

@keyframes viva-door-r {
	from { transform: rotateY(0); opacity: 1; }
	85% { opacity: 1; }
	to { transform: rotateY(108deg); opacity: 0; }
}

@keyframes viva-door-shade {
	from { opacity: 0; }
	to { opacity: 1; }
}

.viva-arrive--doors .viva-doors__leaf--l {
	animation: viva-door-l 1.3s cubic-bezier(0.6, 0, 0.2, 1) 0.35s both;
}

.viva-arrive--doors .viva-doors__leaf--r {
	animation: viva-door-r 1.3s cubic-bezier(0.6, 0, 0.2, 1) 0.35s both;
}

.viva-arrive--doors .viva-doors__leaf::after {
	animation: viva-door-shade 1.3s ease 0.35s both;
}

/* 문이 열리는 동안 수정 화면은 안쪽에서 살짝 다가온다.
   .viva-stage 에 걸면 그 안의 고정 위치 문(.viva-doors)이 화면이 아니라 본문 전체 크기로 늘어나므로 제목·폼에만 건다 */
.viva-arrive--doors .viva-page-head,
.viva-arrive--doors .viva-write-form {
	transform-origin: 50% 0;
	animation: viva-emerge 1.3s cubic-bezier(0.2, 0.7, 0.2, 1) 0.35s both;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
		animation: none !important;
	}

	.viva-js [data-reveal] .viva-line {
		opacity: 1;
		filter: none;
	}
}

/* ---------- 소개: 원장 소개 (어두운 장면) ---------- */

.viva-director {
	padding-bottom: var(--section);
}

.viva-director .viva-spread__title .viva-kicker {
	margin-bottom: 1rem;
}

.viva-director__name {
	margin-top: 2rem;
	font-family: var(--serif);
	font-size: 1.15rem;
}

.viva-director .viva-prose p + p {
	margin-top: 1em;
}

/* ---------- 원장 프로필 사진 ---------- */

/* 어두운 장면 안의 인물 사진은 다른 사진처럼 가라앉히지 않고 얼굴이 밝게 보이게 한다 */
.viva-director .viva-figure {
	max-width: 300px;
	margin-top: 2rem;
}

.viva-night .viva-director .viva-figure img {
	filter: none;
}

.viva-night .viva-director .viva-figure::after {
	display: none;
}

.viva-instructor__body {
	display: grid;
	gap: 1.5rem;
	align-content: start;
}

.viva-instructor .viva-figure {
	max-width: 320px;
}

@media (min-width: 960px) {
	.viva-instructor__body {
		grid-template-columns: minmax(0, 320px) 1fr;
		column-gap: 3rem;
		align-items: start;
	}
}

/* ---------- PTI 이해 / 개념 목록 / 비교표 ---------- */

.viva-letters__mark {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(3rem, 6vw, 4.5rem);
	line-height: 1;
	margin-bottom: 0.75rem;
}

.viva-letters__note {
	max-width: 44rem;
	margin-top: clamp(2rem, 4vw, 3rem);
}

.viva-letters__note p + p {
	margin-top: 1em;
}

.viva-compare {
	width: 100%;
	border-collapse: collapse;
}

.viva-compare th {
	text-align: left;
	font-weight: 500;
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	color: var(--muted);
	padding: 0 1rem 0.75rem 0;
	border-bottom: 1px solid var(--ink);
}

.viva-compare td {
	padding: 1.1rem 1rem 1.1rem 0;
	border-bottom: 1px solid var(--rule);
	vertical-align: top;
}

.viva-compare td + td {
	font-weight: 500;
}

.viva-compare__note {
	margin-top: 1.75rem;
	max-width: 40rem;
}

@media (max-width: 639px) {
	.viva-compare thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.viva-compare tr,
	.viva-compare td {
		display: block;
	}

	.viva-compare tr {
		padding: 1rem 0;
		border-bottom: 1px solid var(--rule);
	}

	.viva-compare td {
		border: 0;
		padding: 0.25rem 0;
	}

	.viva-compare td::before {
		content: attr(data-label);
		display: block;
		font-size: 0.75rem;
		font-weight: 400;
		color: var(--muted);
	}
}

.viva-steps__ask {
	font-family: var(--serif);
	font-size: 1.05rem;
	margin-bottom: 0.5rem;
}

.viva-learn__lede,
.viva-learn__more {
	max-width: 40rem;
}

.viva-learn__lede {
	margin-bottom: 2.5rem;
}

.viva-learn__more {
	margin-top: 2rem;
}

.viva-concepts__lede {
	margin-top: 1rem;
	max-width: 22rem;
}

.viva-defs {
	margin: 0;
}

.viva-defs__row {
	display: grid;
	gap: 0.25rem;
	padding: 1rem 0;
	border-bottom: 1px solid var(--rule);
}

.viva-defs__row:first-child {
	border-top: 1px solid var(--rule);
}

.viva-defs dt {
	font-family: var(--serif);
	font-size: 1.15rem;
}

.viva-defs dd {
	margin: 0;
}

@media (min-width: 640px) {
	.viva-defs__row {
		grid-template-columns: 11rem 1fr;
		column-gap: 2rem;
		align-items: baseline;
	}
}

/* 원장 소개: 오른쪽 칸을 핵심 이력으로 채워 사진 옆이 비어 보이지 않게 한다 */

.viva-director .viva-figure {
	max-width: 340px;
	margin-top: 2.5rem;
}

.viva-director__facts {
	margin-top: 2.5rem;
}

/* 어두운 장면 안에서는 구분선과 글자색을 밤색 톤에 맞춘다 */
.viva-night .viva-defs__row {
	border-color: rgba(235, 231, 223, 0.2);
}

.viva-night .viva-defs dd {
	color: var(--night-muted);
}

.viva-director__places-label {
	margin-top: 2rem;
}

.viva-director__places {
	margin-top: 0.75rem;
}

.viva-night .viva-tags li {
	border-color: rgba(235, 231, 223, 0.3);
}

.viva-director__more {
	display: inline-block;
	margin-top: 2rem;
}

/* ---------- 공지 ---------- */

.viva-notices {
	padding-top: clamp(1.5rem, 3vw, 2.5rem);
}

.viva-notices__list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--ink);
}

.viva-notices__row {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.25rem 1rem;
	align-items: baseline;
	padding: 1rem 0;
	border-bottom: 1px solid var(--rule);
	text-decoration: none;
	color: inherit;
}

.viva-notices__badge {
	display: inline-block;
	padding: 0.1rem 0.6rem;
	border: 1px solid var(--viva);
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--viva);
}

.viva-notices__title {
	font-family: var(--serif);
	font-size: clamp(1.05rem, 2vw, 1.25rem);
}

.viva-notices__row:hover .viva-notices__title {
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

.viva-notices__meta {
	grid-column: 2;
	font-size: 0.8125rem;
	color: var(--muted);
}

@media (min-width: 760px) {
	.viva-notices__row {
		grid-template-columns: auto 1fr auto;
	}

	.viva-notices__meta {
		grid-column: auto;
		text-align: right;
	}
}

/* 홈: 헤더 바로 아래, 첫 화면 맨 위에 둔다 (히어로가 아래로 조금 밀린다) */
.viva-notices--home {
	padding-top: clamp(1.25rem, 2.5vw, 2rem);
}

.viva-notices--home + .viva-hero {
	padding-top: clamp(2.5rem, 6vw, 5rem);
}

.viva-article__notice {
	margin-top: 0.5rem;
	font-size: 0.8125rem;
	color: var(--muted);
}

/* 글쓰기 화면: 공지 지정 */
.viva-write-form__notice {
	border: 0;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1rem;
}

.viva-write-form__check {
	display: flex;
	gap: 0.6rem;
	align-items: center;
	font-size: 0.95rem;
	cursor: pointer;
}

.viva-write-form__check input {
	width: 1.1rem;
	height: 1.1rem;
	accent-color: var(--viva);
}

.viva-write-form__field--date {
	max-width: 14rem;
}

/* ---------- BMS (몸 · 마음 · 배움) ---------- */

.viva-bms__lede {
	max-width: 44rem;
	margin-top: 1.25rem;
}

.viva-bms .viva-display {
	margin-top: 1rem;
}

.viva-bms--overview .viva-bms__cols {
	margin-top: clamp(2rem, 4vw, 3rem);
}

.viva-bms__closing {
	margin-top: 2rem;
	max-width: 40rem;
}

.viva-bms__tag {
	display: inline-block;
	padding: 0.1rem 0.6rem;
	border: 1px solid var(--viva);
	border-radius: 999px;
	font-family: var(--sans);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--viva);
	vertical-align: middle;
}

.viva-bms--service .viva-bms__cols {
	margin-top: 1.5rem;
}

.viva-bms__homeline {
	margin-bottom: 2rem;
	max-width: 44rem;
}

.viva-bms__sub {
	margin-top: clamp(3rem, 6vw, 5rem);
	margin-bottom: 1.25rem;
}

.viva-bms .viva-steps--four {
	margin-top: 1.5rem;
}

@media (min-width: 900px) {
	.viva-bms .viva-steps--four {
		grid-template-columns: repeat(4, 1fr);
	}
}

/* PTI 해석상담 프로그램 표는 세 칸이라 둘째 칸 굵기를 비교표와 다르게 */
.viva-programs td + td {
	font-weight: 400;
}

.viva-programs td:first-child {
	font-weight: 500;
}

/* ---------- 전문가 과정 보강 ---------- */

.viva-codepairs {
	margin-top: 1.25rem;
}

.viva-codepairs__code {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(1.6rem, 3vw, 2.25rem);
	line-height: 1.1;
	margin: 0.5rem 0;
}

.viva-codetable td:not(:first-child) {
	font-weight: 400;
}

.viva-codetable td:nth-child(2),
.viva-codetable td:nth-child(3) {
	font-family: var(--serif);
}

.viva-weeks__no {
	display: inline-block;
	min-width: 2rem;
	color: var(--viva);
	font-family: var(--serif);
}

@media (min-width: 640px) {
	.viva-weeks .viva-defs__row {
		grid-template-columns: 22rem 1fr;
	}

	.viva-fields .viva-defs__row {
		grid-template-columns: 17rem 1fr;
	}

	.viva-codepairs--two {
		grid-template-columns: repeat(2, 1fr);
	}
}

.viva-fields {
	margin-top: 2.5rem;
}

@media (min-width: 900px) {
	.viva-steps--two {
		grid-template-columns: repeat(2, 1fr);
	}
}

.viva-audience__closing {
	margin-top: 2.5rem;
	max-width: 36rem;
}

.viva-voices {
	margin-top: clamp(2rem, 4vw, 3rem);
}

.viva-voices__item {
	margin: 0;
	border-top-color: rgba(235, 231, 223, 0.3);
}

.viva-voices__item blockquote {
	margin: 0 0 1rem;
}

.viva-voices__item blockquote p {
	font-family: var(--serif);
	font-size: 1.05rem;
	line-height: 1.8;
}

.viva-voices__note {
	margin-top: 2rem;
}

.viva-codepairs + .viva-compare {
	margin-top: 2.5rem;
}

.viva-cohort .viva-kicker .viva-notices__badge {
	margin-right: 0.5rem;
}

/* ---------- 전문가 과정: 모집 안내 수정(관리자용) ---------- */

.viva-cohort-edit {
	padding-top: clamp(1rem, 2vw, 1.5rem);
}

.viva-cohort-edit summary {
	display: inline-block;
	cursor: pointer;
	list-style: none;
}

.viva-cohort-edit summary::-webkit-details-marker {
	display: none;
}

.viva-cohort-edit__form {
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--rule);
	display: grid;
	gap: 1.25rem;
	max-width: 44rem;
}