/* daycare-home/intro/intro.css — 요양시설요양 «프로그램 소개» 랜딩 (2026-09-28)
 *  접두어 nh- (nursing home). 뼈대·메뉴·푸터는 test.css · lp-nav · lp-footer 그대로, 여기엔 이 페이지 몸만.
 *  흐름: 히어로(밤) → 폰 세 대(밤) → 한 문장 세 기록(밤) → 운영 화면(낮) → 약속(낮) → 마무리(밤)
 */
.nh-page {
	--nh-ink: #070a17;
	--nh-ink2: #0c1127;
	--nh-line: rgba(148, 163, 255, .14);
	--nh-txt: #e8ebff;
	--nh-mute: #a9b1d6;
	--nh-v: #8b5cf6;
	--nh-i: #6366f1;
	--nh-b: #60a5fa;
	--nh-t: #2dd4bf;
	--nh-grad: linear-gradient(100deg, #c4b5fd 0%, #818cf8 32%, #60a5fa 58%, #5eead4 100%);
	background: var(--nh-ink);
	color: var(--nh-txt);
	font-family: 'Pretendard Variable', Pretendard, -apple-system, 'Malgun Gothic', sans-serif;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}
.nh-page *, .nh-page *::before, .nh-page *::after { box-sizing: border-box; }
.nh-wrap { width: min(1200px, 100% - 40px); margin: 0 auto; position: relative; }
.nh-grad { background: var(--nh-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nh-br-m { display: none; }

/* ── 단추 ── */
.nh-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.nh-cta--c { justify-content: center; }
.nh-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 56px; padding: 0 28px;
	border-radius: 999px; font-size: 16.5px; font-weight: 750; letter-spacing: -.01em; text-decoration: none; white-space: nowrap;
	transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s, background .25s, border-color .25s;
}
.nh-btn i { font-size: 14px; }
.nh-btn--glow {
	color: #0b0f24; background: linear-gradient(100deg, #ddd6fe, #a5b4fc 40%, #93c5fd 70%, #99f6e4);
	box-shadow: 0 10px 40px -8px rgba(129, 140, 248, .65), inset 0 1px 0 rgba(255, 255, 255, .7);
}
.nh-btn--glow:hover { transform: translateY(-2px); box-shadow: 0 16px 56px -8px rgba(129, 140, 248, .85), inset 0 1px 0 rgba(255, 255, 255, .7); }
.nh-btn--ghost { color: var(--nh-txt); border: 1px solid rgba(199, 210, 254, .28); background: rgba(255, 255, 255, .04); backdrop-filter: blur(10px); }
.nh-btn--ghost:hover { border-color: rgba(199, 210, 254, .6); background: rgba(255, 255, 255, .08); transform: translateY(-2px); }

/* ═════════ 히어로 ═════════ */
.nh-hero { position: relative; height: 200vh; background: radial-gradient(120% 80% at 70% 10%, #141a3d 0%, var(--nh-ink) 60%); }
.nh-hero__stick { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: clip; }
.nh-gl { position: absolute; inset: 0; }
.nh-gl--top { z-index: 3; pointer-events: none; }   /* 마이크로 빨려 드는 입자 — 폰 위를 지나간다(hero3d.js) */
.nh-gl canvas { display: block; width: 100% !important; height: 100% !important; }
.nh-hero__veil {
	position: absolute; inset: 0; pointer-events: none;
	background:
		radial-gradient(60% 70% at 18% 55%, rgba(7, 10, 23, .82) 0%, rgba(7, 10, 23, .35) 55%, rgba(7, 10, 23, 0) 80%),
		linear-gradient(180deg, rgba(7, 10, 23, 0) 70%, var(--nh-ink) 100%);
}
.nh-hero__in {
	position: relative; z-index: 2; height: 100%; width: min(1240px, 100% - 40px); margin: 0 auto;
	display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); align-items: center; gap: 40px;
	padding-top: var(--lp-nav-h, 74px);
}
/* 스크롤하면 글은 걷히고(--p = 히어로 붙박이 구간 진행) 폰은 가운데로 간다(--q, --dx = 가운데까지 거리) — intro.js */
.nh-hero__txt { opacity: calc(1 - clamp(0, (var(--p, 0) - .05) * 3.4, 1)); transform: translateY(calc(var(--p, 0) * -70px)); }
.nh-eyebrow {
	display: inline-flex; align-items: center; gap: 10px; margin: 0; padding: 8px 16px 8px 12px; border-radius: 999px;
	font-size: 14px; font-weight: 700; letter-spacing: .02em; color: #c7d2fe;
	border: 1px solid rgba(165, 180, 252, .25); background: rgba(99, 102, 241, .1); backdrop-filter: blur(8px);
}
.nh-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--nh-t); box-shadow: 0 0 0 4px rgba(45, 212, 191, .18), 0 0 18px var(--nh-t); animation: nhPulse 2.4s ease-in-out infinite; }
@keyframes nhPulse { 50% { box-shadow: 0 0 0 7px rgba(45, 212, 191, .06), 0 0 26px var(--nh-t); } }
.nh-h1 {
	margin: 26px 0 0; font-size: clamp(48px, 7.4vw, 104px); line-height: 1.04; font-weight: 820; letter-spacing: -.05em; color: #fff;
	word-break: keep-all;
}
.nh-lead { margin: 28px 0 0; max-width: 560px; font-size: clamp(16px, 1.45vw, 19px); line-height: 1.8; color: var(--nh-mute); word-break: keep-all; }
.nh-lead b { color: #eef0ff; font-weight: 700; }
.nh-proof { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 34px 0 0; padding: 0; list-style: none; font-size: 14px; font-weight: 600; color: #b8c0e6; }
.nh-proof i { color: var(--nh-t); margin-right: 6px; }

.nh-hero__dev { position: relative; display: flex; justify-content: center; perspective: 1400px;
	transform: translate(calc(var(--dx, 0px) * var(--q, 0)), calc((var(--dy, 0px) - 14px) * var(--q, 0))) scale(calc(1 - var(--q, 0) * .1)); }
.nh-float {
	position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 9px; padding: 12px 18px; border-radius: 16px;
	font-size: 14.5px; font-weight: 700; color: #eef0ff; white-space: nowrap;
	background: rgba(20, 26, 61, .6); border: 1px solid rgba(165, 180, 252, .25); backdrop-filter: blur(14px) saturate(160%);
	box-shadow: 0 20px 50px -14px rgba(0, 0, 0, .6);
	animation: nhBob 6s ease-in-out infinite;
	opacity: 0; transition: opacity .6s;
}
.nh-float.is-show { opacity: calc(1 - var(--q, 0) * 2.5); }
.nh-float i { color: #a5b4fc; }
.nh-float--a { top: 16%; left: 2%; }
.nh-float--b { bottom: 18%; right: -2%; animation-delay: -3s; }
.nh-float--b i { color: var(--nh-t); }
@keyframes nhBob { 50% { transform: translateY(-10px); } }

.nh-morph-cap {
	position: absolute; z-index: 2; left: 50%; bottom: 84px; transform: translateX(-50%); margin: 0;
	display: flex; align-items: center; gap: 14px; font-size: 15px; font-weight: 650; letter-spacing: .04em; color: #c7d2fe;
	opacity: 0; transition: opacity .4s; white-space: nowrap;
}
.nh-morph-cap i { font-size: 14px; color: var(--nh-t); }
.nh-morph-cap b { color: #fff; font-weight: 750; }
@media (min-width: 961px) { .nh-morph-cap { bottom: 34px; } }   /* 가운데로 온 폰 발치와 겹치지 않게 */
.nh-scroll { opacity: calc(1 - var(--p, 0) * 6); position: absolute; z-index: 2; left: 50%; bottom: 26px; width: 26px; height: 42px; margin-left: -13px; border: 2px solid rgba(199, 210, 254, .35); border-radius: 14px; }
.nh-scroll span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: #c7d2fe; animation: nhWheel 1.8s ease-in-out infinite; }
@keyframes nhWheel { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(14px); } }

/* ── 폰 틀 ── */
.nh-phone {
	position: relative; width: 300px; aspect-ratio: 390 / 844; border-radius: 32px; padding: 11px;   /* 10-04 48 → 32 「요즘 휴대폰 너무 둥근 형태는 아니니까」 */
	background: linear-gradient(145deg, #2b3152, #0d1124 45%, #1b2040);
	box-shadow: 0 0 0 1px rgba(199, 210, 254, .18), 0 1px 0 1px rgba(255, 255, 255, .06) inset,
		0 50px 100px -30px rgba(0, 0, 0, .85), 0 30px 80px -40px rgba(99, 102, 241, .55);
	transform-style: preserve-3d; transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}
.nh-phone::after {   /* 유리 반사 */
	content: ''; position: absolute; inset: 11px; border-radius: 22px; pointer-events: none;
	background: linear-gradient(125deg, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 32%);
}
.nh-phone__screen { width: 100%; height: 100%; border-radius: 22px; overflow: hidden; background: #fff; }
.nh-phone__screen img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
/* 앞 카메라 — 요즘 폰처럼 작은 구멍 하나(2026-09-28 사장님 「카메라 구멍 1개만 작게」) */
.nh-phone__island { position: absolute; z-index: 2; top: 19px; left: 50%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #2a3350 0 18%, #05060d 45%); box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .06); }
/* 히어로 폰 — 가운데로 가면서 똑바로 선다. 키가 낮은 화면에선 폰도 줄인다 */
.nh-phone--hero {
	width: min(330px, 26vw, calc((100svh - 190px) * .462)); transition: none;
	transform: rotateY(calc(-16deg * (1 - var(--q, 0)))) rotateX(calc(6deg * (1 - var(--q, 0)))) rotateZ(calc(1deg * (1 - var(--q, 0))));
}

/* ── 히어로 폰 화면 = AI 자동 업무 «누르고 말하기» 창(daycare-home/ai-work.css .aw-hold)을 390 폭 기준으로 줄인 것 ──
 *  크기는 cqw(폰 화면 폭의 1%) — 390px 에서 1px = 0.2564cqw */
.nh-phone__screen--live { background: #0f172a; container-type: inline-size; }
.nh-live { position: relative; height: 100%; display: flex; flex-direction: column; padding: 0 5.1cqw 9cqw; color: #fff; text-align: left; }
.nh-live__x { position: absolute; top: 14cqw; right: 3.1cqw; width: 11.3cqw; height: 11.3cqw; display: grid; place-items: center;
	border-radius: 50%; background: rgba(255, 255, 255, .14); font-size: 5.1cqw; }
.nh-live__text { flex: 1; margin: 0; padding: 30cqw 1cqw 5cqw; font-size: 6.15cqw; line-height: 1.5; font-weight: 700;
	word-break: keep-all; overflow-wrap: anywhere; }
.nh-live__ph { color: rgba(255, 255, 255, .55); font-weight: 500; }
.nh-live__mid { color: rgba(255, 255, 255, .6); }
.nh-live__foot { display: flex; flex-direction: column; align-items: center; gap: 4.1cqw; }
.nh-live__mic { position: relative; width: 27.7cqw; height: 27.7cqw; display: grid; place-items: center; border-radius: 50%;
	font-size: 10.3cqw; color: #fff; background: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);
	animation: nhMicIdle 2.4s ease-in-out infinite; transition: transform .15s ease, background .15s ease; }
.nh-live__mic.is-on { background: #dc2626; transform: scale(1.12); animation: nhMicPulse 1.2s ease-out infinite; }
.nh-live__mic.is-on::before, .nh-live__mic.is-on::after { content: ''; position: absolute; inset: 0; border-radius: 50%;
	border: 3px solid rgba(248, 113, 113, .75); animation: nhMicWave 1.6s ease-out infinite; pointer-events: none; }
.nh-live__mic.is-on::after { animation-delay: .8s; }
/* 스크롤로 빨아들이는 동안 — 모인 목소리만큼(--f) 빛이 부푼다 */
.nh-live__mic.is-pull { animation: none;
	box-shadow: 0 0 0 calc(var(--f, 0) * 3cqw) rgba(248, 113, 113, .16),
		0 0 calc(8cqw + var(--f, 0) * 26cqw) calc(var(--f, 0) * 5cqw) rgba(239, 68, 68, calc(.35 + var(--f, 0) * .4)); }
.nh-live__mic.is-pull::before, .nh-live__mic.is-pull::after { animation-duration: 1.1s; }
.nh-live__st { min-height: 5.6cqw; padding: 0 3cqw; text-align: center; font-size: 3.85cqw; font-weight: 600; color: rgba(255, 255, 255, .85); }
.nh-live__st.is-live { color: #fff; }
.nh-live__mic.is-pull ~ .nh-live__st, .nh-live__mic.is-pull ~ .nh-live__put { opacity: calc(1 - var(--f, 0) * 1.5); }   /* 모여드는 입자에 글자가 덮이니 비킨다 */
/* [입력창에 넣기] — 운영 창 .aw-hold__put 모양. 받아 적기를 멈추면 켜진다 */
.nh-live__put { display: inline-flex; align-items: center; gap: 2cqw; height: 12.3cqw; padding: 0 6.2cqw; border-radius: 999px;
	font-size: 4.1cqw; font-weight: 700; color: rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .12); transition: background .3s, color .3s; }
.nh-live__put i { font-size: 3.6cqw; }
.nh-live__put.is-ready { color: #0f172a; background: #fff; }
@keyframes nhMicIdle { 0%, 100% { box-shadow: 0 2.6cqw 7.7cqw rgba(124, 58, 237, .45), 0 0 0 0 rgba(168, 85, 247, .35); }
	50% { box-shadow: 0 2.6cqw 7.7cqw rgba(124, 58, 237, .45), 0 0 0 3.6cqw rgba(168, 85, 247, 0); } }
@keyframes nhMicPulse { 0% { box-shadow: 0 0 0 0 rgba(220, 38, 38, .55); } 100% { box-shadow: 0 0 0 7.2cqw rgba(220, 38, 38, 0); } }
@keyframes nhMicWave { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.9); opacity: 0; } }

/* ── 좁은 화면의 마이크(폰을 숨기는 자리) — 스크롤하면 가운데에 나타나 입자를 빨아들인다 ── */
.nh-orb { display: none; }
.nh-orb__mic { position: absolute; left: -52px; top: -52px; width: 104px; height: 104px; display: grid; place-items: center;
	border-radius: 50%; font-size: 38px; color: #fff; background: #dc2626;
	transform: scale(calc(.82 + var(--f, 0) * .18));
	box-shadow: 0 0 0 calc(var(--f, 0) * 12px) rgba(248, 113, 113, .16), 0 0 40px 6px rgba(239, 68, 68, .45); }
/* 큰 빛 번짐은 그림자 대신 둥근 그라데이션 — 그림자 번짐을 크게 주면 네모로 잘려 보인다 */
.nh-orb::before { content: ''; position: absolute; left: -190px; top: -190px; width: 380px; height: 380px; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(239, 68, 68, .42), rgba(239, 68, 68, .12) 55%, rgba(239, 68, 68, 0));
	opacity: calc(.35 + var(--f, 0) * .65); }
.nh-orb__mic::before, .nh-orb__mic::after { content: ''; position: absolute; inset: 0; border-radius: 50%;
	border: 3px solid rgba(248, 113, 113, .75); animation: nhMicWave 1.3s ease-out infinite; pointer-events: none; }
.nh-orb__mic::after { animation-delay: .65s; }

/* ── 모인 말이 정리된 기록 셋 — 가운데로 온 폰의 양옆(--ph = 폰 폭의 절반) ── */
.nh-recs { position: absolute; inset: 0; z-index: 4; margin: 0; padding: 0; list-style: none; pointer-events: none;
	--ph: min(165px, 13vw, calc((100svh - 190px) * .231)); }
.nh-rec {
	position: absolute; display: flex; align-items: center; gap: 14px; min-width: 250px; padding: 14px 20px 14px 14px; border-radius: 20px;
	background: rgba(20, 26, 61, .66); border: 1px solid rgba(165, 180, 252, .26); backdrop-filter: blur(16px) saturate(160%);
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7);
	opacity: 0; transform: translateY(18px) scale(.96); transition: opacity .7s cubic-bezier(.2, .8, .2, 1), transform .7s cubic-bezier(.2, .8, .2, 1);
}
.nh-rec.is-in { opacity: 1; transform: none; }
.nh-rec > i { width: 42px; height: 42px; flex: none; display: grid; place-items: center; border-radius: 12px; font-size: 17px; color: #fff; }
.nh-rec b { display: block; font-size: 15px; font-weight: 800; color: #fff; }
.nh-rec span { display: block; margin-top: 3px; font-size: 13.5px; font-weight: 600; color: #c7cdef; white-space: nowrap; }
.nh-rec--care  { top: 30%; right: calc(50% + var(--ph) + 44px); }
.nh-rec--care > i { background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.nh-rec--nurse { top: 42%; left: calc(50% + var(--ph) + 44px); }
.nh-rec--nurse > i { background: linear-gradient(135deg, #fb7185, #e11d48); }
.nh-rec--meal  { top: 56%; right: calc(50% + var(--ph) + 44px); }
.nh-rec--meal > i { background: linear-gradient(135deg, #5eead4, #0d9488); }

/* ═════════ 공통 단 ═════════ */
.nh-sec { position: relative; padding: clamp(96px, 12vw, 168px) 0; overflow-x: clip; }   /* 뒤에 깐 빛 번짐이 폰 폭을 넘기지 않게 */
.nh-head { text-align: center; max-width: 820px; margin: 0 auto clamp(48px, 6vw, 80px); }
.nh-kicker { margin: 0 0 18px; font-size: 14px; font-weight: 800; letter-spacing: .2em; color: #a5b4fc; }
.nh-h2 { margin: 0; font-size: clamp(34px, 4.6vw, 62px); line-height: 1.16; font-weight: 800; letter-spacing: -.045em; color: #fff; word-break: keep-all; }
.nh-h2--xl { font-size: clamp(44px, 6.4vw, 92px); line-height: 1.08; }
.nh-sub { margin: 24px auto 0; max-width: 640px; font-size: clamp(16px, 1.4vw, 18.5px); line-height: 1.8; color: var(--nh-mute); word-break: keep-all; }
.nh-sub b { color: #fff; }

/* 나타나기 — 스크립트가 있을 때만 숨겨 둔다(없으면 그냥 보인다) */
.nh-js [data-reveal] { opacity: 0; transform: translateY(36px); transition: opacity 1s cubic-bezier(.2, .8, .2, 1) var(--d, 0ms), transform 1s cubic-bezier(.2, .8, .2, 1) var(--d, 0ms); }
.nh-js [data-reveal].is-in { opacity: 1; transform: none; }

/* ═════════ 직접 해 보기 — 시연(아이프레임) ═════════ */
.nh-demo { background: linear-gradient(180deg, var(--nh-ink) 0%, var(--nh-ink2) 50%, var(--nh-ink) 100%); }
.nh-demo::before {
	content: ''; position: absolute; left: 62%; top: 50%; width: 900px; height: 700px; transform: translate(-50%, -50%); pointer-events: none;
	background: radial-gradient(closest-side, rgba(99, 102, 241, .22), rgba(99, 102, 241, 0));
}
.nh-demo__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(40px, 6vw, 100px); align-items: center; }
.nh-demo__txt .nh-sub { margin-left: 0; }
.nh-demo__steps { list-style: none; margin: 36px 0 0; padding: 0; display: grid; gap: 12px; max-width: 560px; }
.nh-demo__steps li { display: flex; gap: 16px; padding: 16px 20px; border-radius: 18px; border: 1px solid var(--nh-line); background: rgba(255, 255, 255, .03);
	transition: border-color .4s, background .4s, box-shadow .4s; }
.nh-demo__steps b { flex: none; padding-top: 3px; font-size: 13px; font-weight: 800; letter-spacing: .14em; color: #a5b4fc; }
.nh-demo__steps strong { display: block; font-size: 17px; font-weight: 750; color: #fff; }
.nh-demo__steps span { display: block; margin-top: 4px; font-size: 14.5px; line-height: 1.6; color: var(--nh-mute); word-break: keep-all; }
.nh-demo__steps li.is-now { border-color: rgba(165, 180, 252, .6); background: rgba(99, 102, 241, .14); box-shadow: 0 16px 40px -18px rgba(99, 102, 241, .7); }
.nh-demo__steps li.is-done b { color: var(--nh-t); }
.nh-demo__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.nh-btn--sm { height: 44px; padding: 0 18px; font-size: 14.5px; }
.nh-demo__note { margin: 18px 0 0; font-size: 13.5px; line-height: 1.6; color: #8b93bf; word-break: keep-all; }
.nh-demo__note i { margin-right: 6px; color: var(--nh-t); }
.nh-phone--demo { width: min(360px, 86vw); }
.nh-phone--demo::after { display: none; }   /* 유리 반사가 흰 화면을 뿌옇게 덮는다 */
.nh-demo__screen { position: relative; background: #111a33; }   /* 위 30px 은 폰의 상태 표시줄 자리 — 카메라 구멍이 앱 머리를 가리지 않게 */
/* 폰 속은 390px 폭 화면을 줄여 넣는다 — --s(줄임)·높이는 intro.js ⑥ 이 잰다 */
.nh-demo__screen iframe { position: absolute; left: 0; top: 30px; width: 390px; height: 844px; border: 0; display: block; background: #fff;
	transform-origin: 0 0; transform: scale(var(--s, .82)); }

/* ═════════ 폰 세 대 (2026-09-28 시연으로 바꿔 지금은 안 쓴다) ═════════ */
.nh-steps { background: linear-gradient(180deg, var(--nh-ink) 0%, var(--nh-ink2) 50%, var(--nh-ink) 100%); }
.nh-steps::before {
	content: ''; position: absolute; left: 50%; top: 38%; width: 1100px; height: 700px; transform: translate(-50%, -50%); pointer-events: none;
	background: radial-gradient(closest-side, rgba(99, 102, 241, .22), rgba(99, 102, 241, 0));
}
.nh-phones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); align-items: start; }
.nh-stp { margin: 0; display: flex; flex-direction: column; align-items: center; }
.nh-stp:nth-child(2) { margin-top: 64px; }
.nh-stp .nh-phone { width: min(300px, 100%); }
.nh-stp figcaption { margin-top: 36px; max-width: 320px; text-align: center; display: flex; flex-direction: column; gap: 10px; }
.nh-stp__n { font-size: 13px; font-weight: 800; letter-spacing: .2em; color: var(--nh-t); }
.nh-stp figcaption b { font-size: 24px; font-weight: 800; letter-spacing: -.03em; color: #fff; }
.nh-stp figcaption span:last-child { font-size: 15.5px; line-height: 1.75; color: var(--nh-mute); word-break: keep-all; }

/* ═════════ 한 문장 → 세 기록 ═════════ */
.nh-split { background: radial-gradient(80% 60% at 50% 30%, #11173a 0%, var(--nh-ink) 70%); }
.nh-quote {
	position: relative; margin: 0 auto 64px; max-width: 900px; padding: 26px 32px 26px 74px; border-radius: 24px;
	font-size: clamp(17px, 1.7vw, 22px); line-height: 1.7; font-weight: 600; color: #eef0ff; word-break: keep-all;
	background: rgba(255, 255, 255, .04); border: 1px solid var(--nh-line); backdrop-filter: blur(10px);
}
.nh-quote > i { position: absolute; left: 26px; top: 30px; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; font-size: 14px; color: #fff; background: linear-gradient(135deg, #ef4444, #f97316); box-shadow: 0 0 24px rgba(239, 68, 68, .5); }
.nh-caret { display: inline-block; width: 2px; height: 1.1em; margin-left: 3px; vertical-align: -3px; background: #a5b4fc; animation: nhBlink 1s steps(1) infinite; }
@keyframes nhBlink { 50% { opacity: 0; } }
.nh-stage { position: relative; max-width: 980px; margin: 0 auto; }
.nh-browser {
	position: relative; border-radius: 18px; overflow: hidden; background: #fff;
	box-shadow: 0 0 0 1px rgba(199, 210, 254, .2), 0 60px 120px -30px rgba(0, 0, 0, .8), 0 0 120px -20px rgba(99, 102, 241, .45);
}
.nh-browser__bar { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px; background: #eef1f7; border-bottom: 1px solid #e2e8f0; }
.nh-browser__bar i { width: 11px; height: 11px; border-radius: 50%; background: #f87171; }
.nh-browser__bar i:nth-child(2) { background: #fbbf24; }
.nh-browser__bar i:nth-child(3) { background: #34d399; }
.nh-browser__bar span { margin: 0 auto; padding: 5px 18px; border-radius: 8px; background: #fff; font-size: 12.5px; font-weight: 600; color: #475569; }
.nh-browser img { display: block; width: 100%; height: auto; }
.nh-tag {
	position: absolute; z-index: 2; display: flex; align-items: center; gap: 14px; padding: 16px 20px; border-radius: 18px; min-width: 250px;
	background: rgba(15, 20, 48, .78); border: 1px solid rgba(165, 180, 252, .3); backdrop-filter: blur(16px) saturate(160%);
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7);
	animation: nhBob 7s ease-in-out infinite;
}
.nh-tag > i { width: 42px; height: 42px; flex: none; display: grid; place-items: center; border-radius: 12px; font-size: 17px; color: #fff; }
.nh-tag b { display: block; font-size: 15px; font-weight: 800; color: #fff; }
.nh-tag span { display: block; margin-top: 3px; font-size: 13.5px; font-weight: 600; color: #c7cdef; white-space: nowrap; }
.nh-tag--care  { top: 30%; left: -140px; }
.nh-tag--care > i { background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.nh-tag--nurse { top: 52%; right: -150px; animation-delay: -2.4s; }
.nh-tag--nurse > i { background: linear-gradient(135deg, #fb7185, #e11d48); }
.nh-tag--meal  { bottom: 12%; left: -110px; animation-delay: -4.6s; }
.nh-tag--meal > i { background: linear-gradient(135deg, #5eead4, #0d9488); }

/* ═════════ 운영 화면 (낮) ═════════ */
.nh-erp { background: #f5f6fb; color: #0f172a; }
.nh-erp .nh-kicker { color: #4f46e5; }
.nh-erp .nh-h2 { color: #0b1020; }
.nh-erp .nh-sub { color: #475569; }
.nh-erp .nh-sub b { color: #0b1020; }
.nh-bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.nh-card {
	position: relative; display: flex; flex-direction: column; gap: 28px; padding: 36px; border-radius: 28px; overflow: hidden;
	background: #fff; border: 1px solid #e6e8f2; box-shadow: 0 1px 0 rgba(15, 23, 42, .03), 0 30px 60px -40px rgba(30, 41, 99, .35);
}
.nh-card--wide { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: 44px; }
.nh-card--rev { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); }
.nh-card--rev .nh-card__t { order: 2; }
.nh-card__t h3 { margin: 16px 0 0; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.25; font-weight: 800; letter-spacing: -.04em; color: #0b1020; word-break: keep-all; }
.nh-card__t p { margin: 14px 0 0; font-size: 16px; line-height: 1.8; color: #475569; word-break: keep-all; }
.nh-chip { display: inline-block; padding: 6px 13px; border-radius: 999px; font-size: 13px; font-weight: 800; color: #4338ca; background: #eef2ff; }
.nh-shot {
	position: relative; border-radius: 18px; overflow: hidden; border: 1px solid #e2e8f0; background: #fff;
	box-shadow: 0 30px 60px -30px rgba(30, 41, 99, .35);
	transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}
.nh-card:hover .nh-shot { transform: translateY(-4px) scale(1.01); }
.nh-shot img { display: block; width: 100%; height: auto; }
.nh-shot--sm { margin-top: auto; }
.nh-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nh-tiles li { display: grid; grid-template-columns: 38px minmax(0, 1fr); column-gap: 12px; row-gap: 2px; padding: 14px; border-radius: 16px; background: #f7f8fc; border: 1px solid #eceef6; }
.nh-tiles i { grid-row: span 2; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; font-size: 15px; color: #4f46e5; background: #eef2ff; }
.nh-tiles b { font-size: 15px; font-weight: 800; color: #0b1020; letter-spacing: -.02em; }
.nh-tiles span { font-size: 13.5px; line-height: 1.55; color: #475569; word-break: keep-all; }

/* ═════════ 약속 (낮) ═════════ */
.nh-trust { background: #fff; color: #0f172a; padding: clamp(72px, 9vw, 120px) 0; border-top: 1px solid #eceef6; }
.nh-trust__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.nh-trust__grid > div { display: flex; flex-direction: column; gap: 12px; }
.nh-trust__grid i { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; font-size: 20px; color: #fff; background: linear-gradient(135deg, #818cf8, #4f46e5); box-shadow: 0 14px 30px -12px rgba(79, 70, 229, .6); }
.nh-trust__grid b { margin-top: 8px; font-size: 22px; font-weight: 800; letter-spacing: -.03em; color: #0b1020; }
.nh-trust__grid span { font-size: 15.5px; line-height: 1.8; color: #475569; word-break: keep-all; }

/* ═════════ 마무리 (밤) ═════════ */
.nh-final { position: relative; overflow: hidden; padding: clamp(120px, 14vw, 200px) 0; text-align: center; background: var(--nh-ink); }
.nh-final__glow {
	position: absolute; left: 50%; top: 50%; width: 1200px; height: 800px; transform: translate(-50%, -50%); pointer-events: none;
	background: conic-gradient(from 180deg at 50% 50%, rgba(139, 92, 246, .35), rgba(96, 165, 250, .25), rgba(45, 212, 191, .3), rgba(139, 92, 246, .35));
	filter: blur(120px); border-radius: 50%; opacity: .8; animation: nhSpin 24s linear infinite;
}
@keyframes nhSpin { to { transform: translate(-50%, -50%) rotate(360deg); } }

/* ═════════ 좁은 화면 ═════════ */
@media (max-width: 1180px) {
	.nh-tag--care { left: -24px; } .nh-tag--nurse { right: -24px; } .nh-tag--meal { left: -16px; }
}
@media (max-width: 960px) {
	.nh-hero { height: 240vh; }   /* 기록 카드 셋을 스크롤 한 번에 한 장씩 — 붙박이 구간을 늘렸다(intro.js REC_GAP) */
	.nh-hero__in { grid-template-columns: 1fr; align-content: center; gap: 0; text-align: left; }
	/* 좁은 화면도 말하는 폰을 보인다(2026-09-28 사장님 「모바일 첫화면 … 텍스트보다 두번째 스샷 부분을 표현 … 약간 축소」).
	   글 아래에 줄여 두고, 스크롤하면 가운데로 올라와(--dy) 입자를 빨아들인다 — 가운데 빨간 원(.nh-orb)은 이제 안 쓴다 */
	.nh-hero__in { gap: 18px; }
	.nh-phone--hero { width: min(220px, 54vw, calc((100svh - 350px) * .462)); }
	/* 좌측 위 · 우측 가운데 · 좌측 아래로 엇갈려 — 서로 겹치지 않는다(사장님 2026-09-28) */
	.nh-rec { min-width: 0; width: min(188px, 50vw); gap: 10px;
		padding: 9px 12px 9px 10px; border-radius: 14px; transform: translateY(14px) scale(.96); }
	.nh-rec.is-in { transform: none; }
	.nh-rec > i { width: 32px; height: 32px; border-radius: 10px; font-size: 14px; }
	.nh-rec b { font-size: 13px; }
	.nh-rec span { margin-top: 1px; font-size: 12px; }
	.nh-rec span { white-space: normal; }
	.nh-rec--care  { top: 32%; left: 14px; right: auto; }
	.nh-rec--nurse { top: calc(32% + 11svh); right: 14px; left: auto; }
	.nh-rec--meal  { top: calc(32% + 22svh); left: 14px; right: auto; }   /* 간격을 화면 높이에 비례 — 키 작은 폰에서 마이크에 걸리지 않게 */
	.nh-hero__veil { background: radial-gradient(90% 60% at 30% 50%, rgba(7, 10, 23, .78), rgba(7, 10, 23, .2) 80%), linear-gradient(180deg, rgba(7, 10, 23, 0) 70%, var(--nh-ink) 100%); }
	.nh-phones { grid-template-columns: 1fr; gap: 72px; }
	.nh-demo__grid { grid-template-columns: 1fr; }
	.nh-demo__dev { display: flex; justify-content: center; }
	.nh-stp:nth-child(2) { margin-top: 0; }
	.nh-stp .nh-phone { width: min(280px, 72vw); }
	.nh-card--wide { grid-template-columns: 1fr; gap: 28px; }
	.nh-card--rev .nh-card__t { order: 0; }
	.nh-bento { grid-template-columns: 1fr; }
	.nh-tag { position: relative; inset: auto !important; margin: 12px 0 0; min-width: 0; width: 100%; animation: none; }
	.nh-tag span { white-space: normal; }
	.nh-trust__grid { grid-template-columns: 1fr; gap: 36px; }
}
@media (max-width: 600px) {
	.nh-wrap { width: calc(100% - 32px); }
	.nh-hero__in { width: calc(100% - 32px); }
	.nh-br-m { display: inline; }
	.nh-btn { height: 52px; padding: 0 22px; font-size: 15.5px; width: 100%; }
	.nh-cta { flex-direction: column; }
	.nh-quote { padding: 20px 20px 20px 62px; }
	.nh-quote > i { left: 18px; top: 22px; }
	.nh-card { padding: 24px 20px; border-radius: 22px; }
	.nh-tiles { grid-template-columns: 1fr; }
	.nh-morph-cap { gap: 8px; bottom: 80px; font-size: 13px; letter-spacing: 0; }
	/* 폰 첫 화면 — 제목 · 단추 · 폰. 긴 설명과 세 줄 꼬리표는 아래 단들이 다시 말한다 */
	.nh-hero__in { justify-items: center; text-align: center; }
	.nh-hero .nh-h1 { margin-top: 16px; font-size: 40px; }
	.nh-hero .nh-lead, .nh-hero .nh-proof, .nh-scroll { display: none; }   /* 스크롤 표시는 폰과 겹친다 */
	.nh-hero .nh-cta { flex-direction: row; justify-content: center; gap: 8px; margin-top: 20px; }
	/* 단추 둘을 한 줄에 두니 짧막해 보였다(사장님 「말로 기록해 보기 버튼은 빼자」) — 시작하기 하나만, 넉넉하게 */
	.nh-hero .nh-cta .nh-btn--ghost { display: none; }
	.nh-hero .nh-btn { flex: 0 0 auto; width: min(280px, 100%); height: 52px; padding: 0 28px; font-size: 16px; }
	.nh-float { gap: 6px; padding: 8px 12px; border-radius: 12px; font-size: 12px; }
	.nh-float--a { top: 1%; left: 0; }      /* 폰 위 가장자리 — 받아 적는 글을 가리지 않게 */
	.nh-float--b { bottom: 30%; right: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.nh-page *, .nh-page *::before, .nh-page *::after { animation: none !important; transition: none !important; }
	.nh-js [data-reveal] { opacity: 1; transform: none; }
	.nh-hero { height: auto; min-height: 100svh; }
	.nh-hero__stick { position: relative; }
	.nh-hero__txt, .nh-hero__dev, .nh-phone--hero { opacity: 1 !important; transform: none !important; }
	.nh-orb, .nh-recs, .nh-gl--top { display: none !important; }
}

/* ═════════ 기관평가 — 0점에서 100점까지 (2026-10-02, intro.js ⑦) ═════════
   대시보드는 실제 기관평가 관리 화면 꼴을 다시 그린 가상 화면(nh-evd) — 직종 카드 여섯(nh-evc) · 아래 요약 넷(nh-evs) · 다 차면 도장(nh-evd__stamp) */
.nh-ev { background: radial-gradient(80% 60% at 50% 30%, #11173a 0%, var(--nh-ink) 70%); }
.nh-ev::before {
	content: ''; position: absolute; left: 50%; top: 58%; width: 1300px; height: 800px; transform: translate(-50%, -50%); pointer-events: none;
	background: radial-gradient(closest-side, rgba(16, 185, 129, .16), rgba(99, 102, 241, .12) 55%, rgba(99, 102, 241, 0));
}
.nh-badge {
	display: inline-flex; align-items: center; gap: 8px; margin: 0 0 22px; padding: 9px 18px; border-radius: 999px;
	font-size: 15px; font-weight: 800; letter-spacing: -.01em; color: #052e1c;
	background: linear-gradient(100deg, #a7f3d0, #6ee7b7 45%, #5eead4); box-shadow: 0 10px 34px -10px rgba(16, 185, 129, .7), inset 0 1px 0 rgba(255, 255, 255, .7);
}
.nh-badge i { font-size: 15px; }
.nh-evstage { position: relative; max-width: 1120px; margin: 0 auto; }
.nh-browser--ev { background: #f3f5fa; }
.nh-evd { position: relative; padding: clamp(14px, 2vw, 22px); color: #0f172a; font-variant-numeric: tabular-nums; }
.nh-evd__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.nh-evd__t b { display: flex; align-items: center; gap: 8px; font-size: 17px; font-weight: 800; letter-spacing: -.02em; }
.nh-evd__t b i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; font-size: 14px; color: #fff; background: linear-gradient(135deg, #818cf8, #4f46e5); }
.nh-evd__t span { display: block; margin: 4px 0 0 38px; font-size: 12.5px; font-weight: 600; color: #64748b; }
.nh-evd__total { display: flex; align-items: baseline; gap: 10px; padding: 8px 16px; border-radius: 14px; background: #fff; border: 1px solid #e2e8f0; }
.nh-evd__total > span { font-size: 12.5px; font-weight: 700; color: #475569; }
.nh-evd__total b { font-size: 28px; font-weight: 850; letter-spacing: -.03em; color: #0f172a; }
.nh-evd__total b em { font-style: normal; }
.nh-evd__total small { font-size: 14px; font-weight: 700; color: #64748b; }
.nh-evstage.is-full .nh-evd__total { border-color: #6ee7b7; background: #ecfdf5; }
.nh-evstage.is-full .nh-evd__total b em { color: #059669; }

.nh-evd__roles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.nh-evc { position: relative; padding: 14px 16px 12px; border-radius: 14px; background: #fff; border: 1px solid #e2e8f0; border-top: 3px solid var(--c);
	box-shadow: 0 1px 0 rgba(15, 23, 42, .03); transition: box-shadow .5s, border-color .5s, transform .5s; }
.nh-evc__h { display: flex; align-items: center; gap: 10px; }
.nh-evc__ic { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 10px; font-size: 15px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, #fff); }
.nh-evc__h b { display: block; font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.nh-evc__h small { display: block; font-size: 11.5px; font-weight: 600; color: #64748b; }
.nh-evc__ok { margin-left: auto; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font-size: 12px; color: #fff; background: #10b981;
	transform: scale(0); transition: transform .45s cubic-bezier(.2, 1.6, .4, 1); }
.nh-evc.is-done .nh-evc__ok { transform: scale(1); }
.nh-evc.is-done { border-color: #a7f3d0; border-top-color: #10b981; box-shadow: 0 14px 30px -18px rgba(16, 185, 129, .55); }
.nh-evc__mid { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin: 12px 0 8px; }
.nh-evc__pct em { font-style: normal; font-size: 30px; font-weight: 850; letter-spacing: -.04em; line-height: 1; }
.nh-evc__pct small { font-size: 14px; font-weight: 700; margin-left: 1px; }
.nh-evc__pt { text-align: right; }
.nh-evc__pt small { display: block; font-size: 11px; font-weight: 600; color: #64748b; }
.nh-evc__pt b { font-size: 13px; font-weight: 800; color: #15803d; white-space: nowrap; }
.nh-evc__pt b em { font-style: normal; }
.nh-evc__bar { height: 7px; border-radius: 99px; background: #eef1f6; overflow: hidden; }
.nh-evc__bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #34d399, #10b981); }
.nh-evc__seg { display: flex; height: 4px; margin-top: 8px; border-radius: 99px; overflow: hidden; background: #eef1f6; }
.nh-evc__seg span { flex-basis: 0; transition: flex-grow .12s linear; }
.nh-evc__seg .s-miss { background: #ef4444; } .nh-evc__seg .s-need { background: #f59e0b; } .nh-evc__seg .s-rest { background: #a5b4fc; } .nh-evc__seg .s-fill { background: #10b981; }
.nh-evc__leg { display: flex; justify-content: space-between; gap: 6px; margin-top: 8px; font-size: 11.5px; font-weight: 650; color: #334155; white-space: nowrap; }
.nh-evc__leg span::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; vertical-align: 1px; }
.nh-evc__leg em { font-style: normal; font-weight: 800; }
.nh-evc__leg .l-miss::before { background: #ef4444; } .nh-evc__leg .l-miss em { color: #dc2626; }
.nh-evc__leg .l-need::before { background: #f59e0b; } .nh-evc__leg .l-need em { color: #d97706; }
.nh-evc__leg .l-fill::before { background: #10b981; } .nh-evc__leg .l-fill em { color: #059669; }

.nh-evd__sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.nh-evs { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: #fff; border: 1px solid #e2e8f0; min-width: 0; }
.nh-evs__ic { width: 38px; height: 38px; flex: none; display: grid; place-items: center; border-radius: 11px; font-size: 16px; }
.nh-evs > div { min-width: 0; flex: 1 1 auto; }
.nh-evs small { display: block; font-size: 12px; font-weight: 700; color: #334155; }
.nh-evs b { display: block; font-size: 13px; font-weight: 700; color: #475569; }
.nh-evs b em { font-style: normal; font-size: 24px; font-weight: 850; letter-spacing: -.03em; color: #0f172a; margin-right: 2px; }
.nh-evs > div > span { display: block; margin-top: 2px; font-size: 11.5px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nh-evs--late .nh-evs__ic { color: #dc2626; background: #fee2e2; } .nh-evs--late b em { color: #dc2626; }
.nh-evs--month .nh-evs__ic { color: #d97706; background: #fef3c7; } .nh-evs--month b em { color: #b45309; }
.nh-evs--day .nh-evs__ic { color: #4f46e5; background: #e0e7ff; }
.nh-evs--fill .nh-evs__ic { color: #059669; background: #d1fae5; } .nh-evs--fill b em { color: #059669; }
.nh-evs.is-zero { border-color: #a7f3d0; }
.nh-evs.is-zero .nh-evs__ic { color: #059669; background: #d1fae5; }
.nh-evs.is-zero b em { color: #059669; }
.nh-evs__bar { display: block; height: 6px; margin-top: 7px !important; border-radius: 99px; background: #eef1f6; overflow: hidden; }
.nh-evs__bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #34d399, #10b981); }
.nh-evs__pct { font-style: normal; align-self: flex-end; font-size: 13px; font-weight: 800; color: #059669; }

/* 다 차면 — 도장이 내려앉는다 */
.nh-evd__stamp {
	position: absolute; left: 50%; top: 50%; display: flex; align-items: center; gap: 14px; padding: 18px 28px 18px 22px; border-radius: 22px;
	color: #052e1c; background: linear-gradient(110deg, #ecfdf5, #d1fae5 50%, #ccfbf1); border: 2px solid #34d399;
	box-shadow: 0 30px 80px -20px rgba(5, 150, 105, .55), 0 0 0 10px rgba(52, 211, 153, .12);
	opacity: 0; transform: translate(-50%, -50%) scale(1.6) rotate(-6deg); pointer-events: none;
	transition: opacity .45s ease, transform .6s cubic-bezier(.2, 1.4, .3, 1);
}
.nh-evd__stamp > i { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; font-size: 26px; color: #fff; background: linear-gradient(135deg, #34d399, #059669); }
.nh-evd__stamp b { display: block; font-size: 28px; font-weight: 900; letter-spacing: -.03em; }
.nh-evd__stamp span { display: block; margin-top: 2px; font-size: 16px; font-weight: 800; color: #047857; }
.nh-evstage.is-full .nh-evd__stamp { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-4deg); }
.nh-js .nh-evstage:not(.is-full) .nh-evd__stamp { opacity: 0; }
.nh-ev__again { display: flex; margin: 22px auto 0; opacity: 0; pointer-events: none; transition: opacity .4s; }
.nh-evstage.is-full .nh-ev__again { opacity: 1; pointer-events: auto; }
/* 스크립트가 없으면 다 채운 모습 그대로 — 도장은 덮지 않게 숨긴다 */
html:not(.nh-js) .nh-evd__stamp, html:not(.nh-js) .nh-ev__again { display: none; }

.nh-evfeat { list-style: none; margin: clamp(56px, 7vw, 88px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.nh-evfeat li { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; row-gap: 4px; padding: 22px; border-radius: 20px;
	border: 1px solid var(--nh-line); background: rgba(255, 255, 255, .03); }
.nh-evfeat i { grid-row: span 2; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; font-size: 17px; color: #fff;
	background: linear-gradient(135deg, #34d399, #0d9488); box-shadow: 0 12px 28px -12px rgba(16, 185, 129, .7); }
.nh-evfeat b { font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.nh-evfeat span { font-size: 14.5px; line-height: 1.65; color: var(--nh-mute); word-break: keep-all; }
.nh-final .nh-badge { margin-bottom: 18px; }

@media (max-width: 960px) {
	.nh-evd__roles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nh-evd__sum { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nh-evfeat { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.nh-evd { padding: 10px; }
	.nh-evd__roles, .nh-evd__sum { gap: 8px; }
	.nh-evc { padding: 11px 11px 10px; }
	.nh-evc__ic { width: 28px; height: 28px; font-size: 13px; border-radius: 8px; }
	.nh-evc__h b { font-size: 13.5px; }
	.nh-evc__pct em { font-size: 24px; }
	.nh-evc__pt small { display: none; }
	.nh-evc__pt b { font-size: 11.5px; }
	.nh-evc__leg { font-size: 10.5px; flex-wrap: wrap; justify-content: flex-start; gap: 2px 8px; }
	.nh-evc__ok { width: 22px; height: 22px; font-size: 10px; }
	.nh-evs { padding: 10px; gap: 8px; }
	.nh-evs__ic { width: 30px; height: 30px; font-size: 13px; border-radius: 9px; }
	.nh-evs b em { font-size: 20px; }
	.nh-evs > div > span:not(.nh-evs__bar) { display: none; }
	.nh-evs__pct { display: none; }
	.nh-evd__total { padding: 6px 12px; }
	.nh-evd__total b { font-size: 22px; }
	.nh-evd__stamp { gap: 10px; padding: 12px 16px 12px 12px; border-radius: 16px; }
	.nh-evd__stamp > i { width: 40px; height: 40px; font-size: 19px; border-radius: 12px; }
	.nh-evd__stamp b { font-size: 21px; }
	.nh-evd__stamp span { font-size: 13.5px; white-space: nowrap; }
	.nh-badge { font-size: 14px; padding: 8px 15px; }
}
/* ═════════ 히어로 마지막 걸음 (2026-10-02, intro.js ⑤) ═════════
   사장님 「맨위에서부터 한개씩 없어지도록」 「2번 스샷 화면으로 넘어가지는 것을 마지막으로」 —
   기록 셋이 위에서부터 한 장씩 폰으로 들어가고(is-out), 폰 화면이 정리된 카드(#nhDone, AI 자동 업무 카드 꼴)로 넘어간다 */
.nh-rec.is-out { opacity: 0; transition-duration: .55s; }
.nh-rec--care.is-out, .nh-rec--meal.is-out { transform: translateX(calc(var(--ph) + 150px)) scale(.4); }
.nh-rec--nurse.is-out { transform: translateX(calc(-1 * (var(--ph) + 150px))) scale(.4); }
.nh-morph-cap__b { display: none; }
.nh-morph-cap.is-done .nh-morph-cap__a { display: none; }
.nh-morph-cap.is-done .nh-morph-cap__b { display: inline; }

/* 폰 속 카드 화면 — 크기는 cqw(폰 화면 폭의 1%). 390 폭 기준보다 조금 크게 — 폰이 작은 화면에서도 읽히게 */
.nh-phone__screen--live { position: relative; }
.nh-done { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; gap: 3.6cqw; padding: 16cqw 4.4cqw 8cqw;
	background: #f8fafc; color: #0f172a; text-align: left; overflow: hidden;
	opacity: 0; visibility: hidden; transition: opacity .55s, visibility 0s .55s; }
.nh-done.is-on { opacity: 1; visibility: visible; transition: opacity .55s; }
.nh-done__meta { margin: 0; font-size: 4.2cqw; line-height: 1.5; color: #4b5563; }
.nh-done__meta i { margin-right: .8cqw; color: #7c3aed; }
.nh-done__card { border: 1px solid #e5e7eb; border-radius: 3.6cqw; overflow: hidden; background: #fff; box-shadow: 0 2cqw 6cqw -3cqw rgba(15, 23, 42, .2); }
.nh-done__h { padding: 3.2cqw 4cqw; border-bottom: 1px solid #f3e8ff; background: #faf5ff; font-size: 5.4cqw; }
.nh-done__h b { margin-right: .6cqw; font-weight: 800; }
.nh-done__sec { padding: 3cqw 4cqw 2.4cqw; }
.nh-done__sec + .nh-done__sec { border-top: 1px dashed #eef0f3; }
.nh-done__t { margin: 0 0 1.4cqw; font-size: 4.5cqw; font-weight: 750; color: #6d28d9; }
.nh-done__t i { margin-right: 1cqw; }
.nh-done__it { display: flex; align-items: center; gap: 2.8cqw; padding: 1.4cqw 0; font-size: 5.1cqw; }
.nh-done__it b { flex: none; font-weight: 700; }
.nh-done__v { min-width: 0; margin-left: 1.4cqw; color: #334155; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nh-done__ck { flex: none; width: 6.8cqw; height: 6.8cqw; display: grid; place-items: center; border-radius: 1.8cqw; background: #7c3aed; color: #fff; font-size: 3.6cqw; }
.nh-done__ed { margin: .4cqw 0 1.2cqw 9.6cqw; padding: 2cqw 2.8cqw; border: 1px solid #e5e7eb; border-radius: 2.4cqw; font-size: 4.7cqw; line-height: 1.5; }
.nh-done__vit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.8cqw; margin: .6cqw 0 1.2cqw 9.6cqw; }
.nh-done__vit span { display: flex; flex-direction: column; gap: 1cqw; min-width: 0; padding: 2cqw 2.2cqw; border: 1px solid #e5e7eb; border-radius: 2.6cqw; }
.nh-done__vit em { font-style: normal; font-size: 3.7cqw; font-weight: 700; white-space: nowrap; }
.nh-done__vit small { font-size: 2.9cqw; font-weight: 400; color: #4b5563; }
.nh-done__vit b { min-height: 6.4cqw; font-size: 5cqw; font-weight: 800; text-align: center; white-space: nowrap; }
.nh-done__acts { display: flex; align-items: center; flex-wrap: wrap; gap: 2.4cqw 3.4cqw; margin-top: 1cqw; }
.nh-done__go { display: inline-flex; align-items: center; gap: 2cqw; height: 13.4cqw; padding: 0 6.4cqw; border-radius: 999px;
	background: #0f172a; color: #fff; font-size: 5cqw; font-weight: 750; }
.nh-done__acts small { font-size: 3.8cqw; color: #4b5563; }
/* 한 덩이씩 차례로 올라온다 — 다 올라오면 [기록하기] 가 숨 쉰다 */
.nh-done__meta, .nh-done__h, .nh-done__sec, .nh-done__acts { opacity: 0; transform: translateY(2.4cqw); transition: opacity .4s, transform .4s; }
.nh-done.is-on .nh-done__meta, .nh-done.is-on .nh-done__h, .nh-done.is-on .nh-done__sec, .nh-done.is-on .nh-done__acts { opacity: 1; transform: none; }
.nh-done.is-on .nh-done__h { transition-delay: .12s; }
.nh-done.is-on .nh-done__sec:nth-child(2) { transition-delay: .24s; }
.nh-done.is-on .nh-done__sec:nth-child(3) { transition-delay: .36s; }
.nh-done.is-on .nh-done__sec:nth-child(4) { transition-delay: .48s; }
.nh-done.is-on .nh-done__acts { transition-delay: .6s; }
.nh-done.is-on .nh-done__go { animation: nhGoPulse 1.8s ease-out 1.1s infinite; }
@keyframes nhGoPulse { 0% { box-shadow: 0 0 0 0 rgba(124, 58, 237, .5); } 100% { box-shadow: 0 0 0 3.6cqw rgba(124, 58, 237, 0); } }
@media (max-width: 960px) {
	/* 좁은 화면 — 장은 화면 가장자리(14px)에 붙어 있다: 가운데(폰)까지 */
	.nh-rec--care.is-out, .nh-rec--meal.is-out { transform: translateX(calc(50vw - 108px)) scale(.4); }
	.nh-rec--nurse.is-out { transform: translateX(calc(108px - 50vw)) scale(.4); }
}