/* ==========================================================================
   Firstier v2 — 24시 응급 페이지 (블랙). page-templates/page-v2-24h.php
   Parts: template-parts/v2/24h/{hero,signs,steps,after,cost,faq,location}.php
   Base tokens · header · footer · buttons: v2.css
   Breakpoints: 1099 (tablet) / 767 (phone)
   ========================================================================== */

/* ---------- shared section scaffolding ---------- */
.v2e-sec { background: var(--v2-night); padding: var(--v2-section-y) 0; }
.v2e-sec--alt { background: var(--v2-night-2); }

.v2e-stack { display: flex; flex-direction: column; gap: 56px; }
.v2e-head { display: flex; flex-direction: column; gap: 24px; }

/* two-column split: 5 / 7, wraps to one column under ~1020px */
.v2e-split { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 56px 40px; }
.v2e-split--stretch { align-items: stretch; }
.v2e-split__main { flex: 5 1 360px; min-width: 0; }
.v2e-split__side { flex: 7 1 520px; min-width: 0; }

/* ---------- type ---------- */
.v2e-h2 { font-size: clamp(34px, 3.7vw, 52px); line-height: 1.2; font-weight: 600; letter-spacing: -0.03em; color: var(--v2-ink-n); }
.v2e-h3 { font-size: clamp(22px, 2vw, 28px); line-height: 1.4; font-weight: 600; letter-spacing: -0.02em; color: var(--v2-ink-n); }
.v2e-h3--sm { font-size: clamp(20px, 1.7vw, 24px); }
.v2e-lead { max-width: 36em; font-size: clamp(18px, 1.45vw, 20px); line-height: 1.75; letter-spacing: -0.01em; color: var(--v2-body-n); }
.v2e-body { font-size: clamp(16px, 1.2vw, 17px); line-height: 1.8; color: var(--v2-body-n); }
.v2e-body--meta { color: var(--v2-meta-n); }

/* ---------- buttons (on top of .v2-btn) ---------- */
.v2e-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.v2e-btn--line { padding: 0 24px; border-color: rgba(236, 239, 241, .42); }
.v2e-btn--md { height: 52px; padding: 0 24px; }

/* ---------- figure ---------- */
.v2e-figure { margin: 0; display: flex; flex-direction: column; gap: 12px; }
.v2e-figure img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: var(--v2-night-2); }
.v2e-figure figcaption { font-size: 14px; line-height: 1.5; font-weight: 500; color: var(--v2-meta-n); }

/* ==========================================================================
   HERO — 밤 상가 영상
   ========================================================================== */
.v2e-hero {
	position: relative; overflow: hidden;
	display: flex; flex-direction: column; justify-content: flex-end;
	min-height: calc(100vh - var(--v2-header-h));
	min-height: calc(100svh - var(--v2-header-h));
	background: #0B0F14; color: #FFFFFF;
}
.v2e-hero__media { position: absolute; inset: 0; }
.v2e-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.v2e-hero__shade { position: absolute; inset: 0; pointer-events: none; }
.v2e-hero__shade--side { background: linear-gradient(90deg, rgba(10, 14, 18, .74) 0%, rgba(10, 14, 18, .36) 40%, rgba(10, 14, 18, 0) 66%); }
.v2e-hero__shade--foot { background: linear-gradient(0deg, rgba(15, 21, 27, 1) 0%, rgba(15, 21, 27, .62) 30%, rgba(15, 21, 27, 0) 62%); }
.v2e-hero__shade--top { bottom: auto; height: 200px; background: linear-gradient(180deg, rgba(10, 14, 18, .58) 0%, rgba(10, 14, 18, 0) 100%); }

.v2e-hero__body { position: relative; z-index: 1; }
.v2e-hero__in { padding-top: 48px; padding-bottom: clamp(48px, 6vw, 80px); }
.v2e-hero__copy { max-width: 920px; display: flex; flex-direction: column; gap: 22px; }
.v2e-hero__label { font-size: 16px; line-height: 1.4; font-weight: 600; color: rgba(255, 255, 255, .86); }
.v2e-hero__title { font-size: clamp(42px, 5.6vw, 80px); line-height: 1.13; font-weight: 600; letter-spacing: -0.035em; color: #FFFFFF; }
.v2e-hero__lead { max-width: 34em; font-size: clamp(17px, 1.4vw, 19px); line-height: 1.7; color: rgba(255, 255, 255, .86); }
.v2e-hero__actions { padding-top: 14px; display: flex; flex-direction: column; gap: 28px; }
.v2e-hero__tel { display: flex; align-items: center; gap: 18px; width: fit-content; max-width: 100%; color: #FFFFFF; }
.v2e-hero__tel-dot { display: block; flex: none; width: 14px; height: 14px; background: var(--v2-lamp-n); }
.v2e-hero__tel-num {
	font-family: var(--v2-num); font-feature-settings: 'tnum' 1;
	font-size: clamp(40px, 4.6vw, 64px); line-height: 1; font-weight: 500; letter-spacing: -0.03em; white-space: nowrap;
}

/* ==========================================================================
   이럴 때는 바로 오세요 — 6 rows × 2 columns, shared row heights
   ========================================================================== */
.v2e-signs__list {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(6, auto);
	grid-auto-flow: column; column-gap: 40px;
}
.v2e-signs__list li {
	padding: 22px 0; border-bottom: 1px solid var(--v2-line-n);
	font-size: clamp(17px, 1.4vw, 20px); line-height: 1.6; font-weight: 500; letter-spacing: -0.01em; color: var(--v2-ink-n);
}
.v2e-signs__list li:nth-child(1), .v2e-signs__list li:nth-child(7) { border-top: 1px solid var(--v2-line-n); }

/* ==========================================================================
   24시 응급·중환자 센터 — 응급 진단·처치 | 중환자 집중 치료 (2열, 폰 1열)
   ========================================================================== */
.v2e-care__grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 40px; }
.v2e-care__group { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.v2e-care__list { margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--v2-line-n); }
.v2e-care__list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding: 20px 0; border-top: 1px solid var(--v2-line-n); }
.v2e-care__list strong { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.6; font-weight: 500; letter-spacing: -0.01em; color: var(--v2-ink-n); }
.v2e-care__list span { font-size: 15px; line-height: 1.6; color: var(--v2-meta-n); }
@media (max-width: 1099px) {
	.v2e-care__grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
}
@media (max-width: 767px) {
	.v2e-care__list li { padding: 16px 0; }
}

/* ==========================================================================
   밤에 오시는 순서
   ========================================================================== */
.v2e-steps__grid { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 56px 40px; }
.v2e-steps__col { min-width: 0; display: flex; flex-direction: column; gap: 32px; }
.v2e-steps__col--one { flex: 1 1 280px; }
.v2e-steps__col--two { flex: 2 1 560px; }
.v2e-steps__img { width: 100%; height: clamp(300px, 36vw, 520px); object-fit: cover; background: var(--v2-night); }
.v2e-steps__list--pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 32px 40px; }
.v2e-item { display: flex; flex-direction: column; gap: 12px; }

/* ==========================================================================
   도착 후에는 — timeline (square marker + connecting rule)
   ========================================================================== */
.v2e-timeline { display: flex; flex-direction: column; }
.v2e-timeline__item {
	--v2e-fs: clamp(20px, 1.7vw, 24px);
	--v2e-mark: calc(var(--v2e-fs) * 0.7 - 5px);
	position: relative; padding: 0 0 40px 34px;
	display: flex; flex-direction: column; gap: 8px;
}
.v2e-timeline__item::before {
	content: ''; position: absolute; left: 0; top: var(--v2e-mark);
	width: 10px; height: 10px; box-sizing: border-box; border: 1px solid var(--v2-meta-n);
}
.v2e-timeline__item::after {
	content: ''; position: absolute; left: 4.5px; width: 1px; bottom: 0;
	top: calc(var(--v2e-mark) + 22px); background: var(--v2-line-n);
}
.v2e-timeline__item:last-child { padding-bottom: 0; }
.v2e-timeline__item:last-child::after { display: none; }

/* ==========================================================================
   야간 비용 안내
   ========================================================================== */
.v2e-cost__body { display: flex; flex-direction: column; gap: 24px; }
.v2e-cost__list { margin: 0; border-bottom: 1px solid var(--v2-line-n); }
.v2e-cost__row {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 24px;
	padding: 28px 0; border-top: 1px solid var(--v2-line-n);
}
.v2e-cost__row dt { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.6; font-weight: 500; letter-spacing: -0.01em; color: var(--v2-ink-n); }
.v2e-cost__row dd {
	font-family: 'Instrument Sans', var(--v2-font); font-feature-settings: 'tnum' 1;
	font-size: clamp(20px, 1.7vw, 24px); line-height: 1.4; font-weight: 500; letter-spacing: -0.01em; color: var(--v2-ink-n);
}

/* ==========================================================================
   자주 묻는 질문 — <details>, open by default (as drawn)
   ========================================================================== */
.v2e-faq__list { display: flex; flex-direction: column; gap: 48px; }
.v2e-faq__item summary {
	display: flex; justify-content: space-between; align-items: flex-start; gap: 24px;
	list-style: none; cursor: pointer;
}
.v2e-faq__item summary::-webkit-details-marker { display: none; }
.v2e-faq__item summary::marker { content: ''; }
.v2e-faq__q { font-size: clamp(19px, 1.55vw, 22px); line-height: 1.4; font-weight: 600; letter-spacing: -0.02em; color: var(--v2-ink-n); }
.v2e-faq__toggle {
	position: relative; flex: none; width: 14px; height: 14px;
	margin-top: calc((clamp(19px, 1.55vw, 22px) * 1.4 - 14px) / 2);
}
.v2e-faq__toggle::before, .v2e-faq__toggle::after { content: ''; position: absolute; background: var(--v2-meta-n); }
.v2e-faq__toggle::before { left: 0; right: 0; top: 6.5px; height: 1px; }
.v2e-faq__toggle::after { top: 0; bottom: 0; left: 6.5px; width: 1px; }
.v2e-faq__item[open] .v2e-faq__toggle::after { display: none; }
.v2e-faq__item > .v2e-body { margin-top: 12px; }

/* ==========================================================================
   오시는 길 (간단판)
   ========================================================================== */
.v2e-loc__info { display: flex; flex-direction: column; gap: 56px; }
.v2e-loc__body { display: flex; flex-direction: column; gap: 40px; }
.v2e-loc__list { margin: 0; display: flex; flex-direction: column; gap: 20px; }
.v2e-loc__row { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 16px; }
.v2e-loc__row dt { font-size: 15px; line-height: 1.8; font-weight: 600; color: var(--v2-meta-n); }
.v2e-loc__row dd { font-size: clamp(16px, 1.2vw, 17px); line-height: 1.8; color: var(--v2-body-n); }
.v2e-loc__row dd.is-strong { color: var(--v2-ink-n); }
.v2e-loc__media { display: flex; flex-direction: column; gap: 24px; }
.v2e-loc__map {
	flex: 1 1 auto; min-height: clamp(260px, 20vw, 300px); background: var(--v2-night);
	display: flex; align-items: center; justify-content: center;
}

/* ==========================================================================
   Tablet ≤1099
   ========================================================================== */
@media (max-width: 1099px) {
	.v2e-signs__list { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-flow: row; }
	.v2e-signs__list li:nth-child(7) { border-top: 0; }
}

/* ==========================================================================
   Phone ≤767
   ========================================================================== */
@media (max-width: 767px) {
	.v2e-hero__title { font-size: clamp(32px, 9.4vw, 40px); line-height: 1.2; }
	.v2e-hero {
		min-height: calc(100vh - var(--v2-header-h));
		min-height: calc(100svh - var(--v2-header-h)); /* 하단 바는 첫 화면에선 숨어 있다 */
	}
	.v2e-hero__shade--side { background: linear-gradient(90deg, rgba(10, 14, 18, .6) 0%, rgba(10, 14, 18, .2) 100%); }
	.v2e-hero__shade--foot { background: linear-gradient(0deg, rgba(15, 21, 27, 1) 0%, rgba(15, 21, 27, .72) 45%, rgba(15, 21, 27, 0) 78%); }
	.v2e-hero__in { padding-top: 40px; padding-bottom: 40px; }
	.v2e-hero__copy { gap: 18px; }
	.v2e-hero__lead br { display: none; }
	.v2e-hero__actions { gap: 24px; }
	.v2e-hero__tel { gap: 14px; }
	.v2e-hero__tel-dot { width: 12px; height: 12px; }
	.v2e-hero__tel-num { font-size: clamp(30px, 10vw, 40px); }

	.v2e-btns { flex-direction: column; }
	.v2e-btns .v2-btn { width: 100%; }

	.v2e-stack { gap: 40px; }
	.v2e-split { gap: 40px; }
	.v2e-steps__grid { gap: 48px; }
	.v2e-steps__col { gap: 24px; }
	.v2e-steps__list--pair { gap: 24px; }
	.v2e-signs__list li { padding: 18px 0; }
	.v2e-timeline__item { padding-bottom: 32px; }
	.v2e-cost__row { padding: 22px 0; }
	.v2e-faq__list { gap: 36px; }
	.v2e-loc__info { gap: 40px; }
	.v2e-loc__body { gap: 32px; }
	.v2e-loc__row { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; }

	.v2e-figure figcaption { font-size: 15px; }
}