/* 온숲병원 건강검진센터 — 광고 랜딩페이지형(가운데 정렬 긴 상세페이지).
   얼굴: 깊은 숲 초록 + 민트 + 베이지 종이 · 수채화 번짐(손으로 짠 SVG 필터) · Black Han Sans 제목 + Nanum Pen Script 손글씨.
   글꼴: Pretendard(SIL OFL 1.1) · Black Han Sans · Nanum Pen Script(둘 다 SIL OFL 1.1, Google Fonts) — 상업 사용 가능.
   ⚠️ 키트 부품(.hero·.sec·.btn …)과 이름이 겹치지 않게 이 사이트 부품은 전부 `os-` 로 시작한다.
   ⚠️ Black Han Sans 는 굵기가 400 하나뿐이다 — 제목에 font-weight 를 올리면 가짜 굵게가 된다(항상 400 으로 둘 것).
   🔴 수채화 번짐은 **요소가 아니라 가상 요소의 배경**으로 깐다(.os-washed::before · 판 바깥은 body::before/after).
      절대 위치 요소로 섹션 밖에 걸쳐 두면 화면 밖으로 나간 장식도 렌더 실측(scripts/check-render.mjs)이 잘림으로 센다(2026-09-22). */

:root {
  --f-sans: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
  --f-display: 'Black Han Sans', 'Pretendard Variable', Pretendard, sans-serif;
  --f-hand: 'Nanum Pen Script', 'Pretendard Variable', cursive;
  --f-latin: var(--f-sans);
  --w-body: 400;
  --w-strong: 700;

  /* 색 — 본문 대비는 베이지(#EFECE6)·흰 바탕 모두 AA 이상으로 잡았다 */
  --c-bg: #F3F1EC;          /* 세로 판 바깥 */
  --c-paper: #EFECE6;       /* 베이지 종이 */
  --c-ink: #13241B;
  --c-body: #3C4842;        /* 베이지 위 8.2:1 */
  --c-mute: #59655F;        /* 베이지 위 5.0:1 */
  --c-line: #DDD8CE;
  --c-line-strong: #C4BEB2;
  --c-panel: #F6F4F0;
  --c-accent: #12673F;      /* 작은 초록 글자 — 베이지 위 5.9:1 */
  --c-green: #157A4B;       /* 브랜드 초록 — 흰 바탕 5.4:1 · 베이지 4.6:1 */
  --c-deep: #0F3D2A;        /* 깊은 숲 */
  --c-mint: #CDEBDD;
  --c-mint-2: #E3F2EA;
  --c-mint-on-dark: #A8E2C6;
  --c-kakao: #FEE500;
  --c-dark: #0B2C1F;

  --radius: 12px;
  --hd-h: 4.5rem;
  --col: 67.5rem;           /* 1080px — 가운데 세로 판 */
  --pad-x: clamp(1.25rem, 5.5vw, 4.5rem);
  --pad-y: clamp(4.5rem, 3rem + 5vw, 7.5rem);
  --margin-x: calc((100vw - var(--col)) / 2);   /* 판 바깥 여백 한쪽 폭(넓은 화면에서만 의미가 있다) */
}
@media (max-width: 640px) { :root { --hd-h: 4rem; } }

body.os { background: var(--c-bg); }
body.os b, body.os strong { font-weight: 700; }
/* 짙은 초록 면 위 포커스 링 — 키트의 파랑(--c-focus #2f6bff)은 #0F3D2A 위 2.71:1 · #0B2C1F 위 3.35:1 이라 링이 묻힌다.
   이 면에서만 민트로 바꾼다(8.3:1 / 10.3:1 · 2026-09-22 재검증). 밝은 면은 파랑 그대로(베이지 위 3.8:1). */
.os-care, .os-apply__aside, .os-ft { --c-focus: var(--c-mint-on-dark); }
.os-nw { white-space: nowrap; }

/* ── 판 바깥(1180px 이상) — 양옆 물감 + 왼쪽 세로 표제 + 오른쪽 목차 ─────────── */
@media (min-width: 1180px) {
  body.os::before, body.os::after { content: ''; position: fixed; top: 0; bottom: 0; z-index: -1; width: calc(var(--margin-x) + 4rem); pointer-events: none; background-repeat: no-repeat; opacity: 0.62; }
  body.os::before { left: 0; background-image: url(../img/wash-mint.svg), url(../img/wash-sun.svg); background-position: left -9vw top 3vh, left -4vw bottom 6vh; background-size: 30vw auto, 17vw auto; }
  body.os::after { right: 0; background-image: url(../img/wash-sky.svg), url(../img/wash-green.svg); background-position: right -10vw bottom -4vh, right -3vw top 12vh; background-size: 32vw auto, 13vw auto; }
}
.os-side, .os-toc { display: none; }
@media (min-width: 1360px) {
  /* 왼쪽 세로 표제 — 인쇄물의 책등처럼 */
  .os-side { position: fixed; z-index: 5; top: 50%; left: calc(var(--margin-x) / 2); display: flex; align-items: center; gap: 1rem; writing-mode: vertical-rl; text-orientation: sideways; transform: translate(-50%, -50%); font-size: 0.875rem; font-weight: 700; color: var(--c-accent); white-space: nowrap; pointer-events: none; }
  .os-side span[lang] { letter-spacing: 0.28em; }
  .os-side span:last-child { font-weight: 600; letter-spacing: 0.04em; color: var(--c-mute); }
  .os-side i { width: 1px; height: 3.5rem; background: currentColor; opacity: 0.45; }

  /* 오른쪽 목차 — 지금 보는 섹션에 불이 켜진다(site.js) */
  .os-toc { display: block; position: fixed; z-index: 5; top: 50%; right: calc((var(--margin-x) - 9rem) / 2); width: 9rem; transform: translateY(-50%); }
  .os-toc ol { position: relative; display: grid; gap: 0.125rem; }
  .os-toc ol::before { content: ''; position: absolute; left: 0.375rem; top: 1.375rem; bottom: 1.375rem; width: 1px; background: var(--c-line-strong); }
  .os-toc a { position: relative; display: flex; align-items: center; gap: 0.625rem; min-height: 2.75rem; padding-left: 1.5rem; font-size: 0.875rem; font-weight: 600; color: var(--c-body); transition: color 0.25s; }
  .os-toc a::before { content: ''; position: absolute; left: 0.125rem; top: 50%; width: 0.5625rem; height: 0.5625rem; border-radius: 50%; background: var(--c-bg); box-shadow: inset 0 0 0 1.5px var(--c-line-strong); transform: translateY(-50%); transition: background-color 0.25s, box-shadow 0.25s, transform 0.25s var(--ease); }
  .os-toc__no { font-size: 0.875rem; font-weight: 700; letter-spacing: 0.04em; color: var(--c-mute); transition: color 0.25s; }   /* 바탕 #F3F1EC 위 5.3:1 */
  .os-toc a:hover { color: var(--c-ink); }
  .os-toc a[aria-current='true'] { color: var(--c-deep); font-weight: 800; }
  .os-toc a[aria-current='true']::before { background: var(--c-green); box-shadow: 0 0 0 4px rgba(21, 122, 75, 0.16); transform: translateY(-50%) scale(1.25); }
  .os-toc a[aria-current='true'] .os-toc__no { color: var(--c-green); }
}

/* 가운데 세로 판 */
.os-sheet { position: relative; max-width: var(--col); margin-inline: auto; background: var(--c-paper); overflow: clip; isolation: isolate; box-shadow: 0 0 0 1px rgba(15, 61, 42, 0.06), 0 40px 90px -60px rgba(15, 61, 42, 0.3); }
.os-sec { position: relative; isolation: isolate; padding: var(--pad-y) var(--pad-x); }

/* 수채화 번짐 — 섹션 안쪽에서만 칠한다(가상 요소 · 배경 레이어). 위치·크기·세기는 섹션마다 변수로 */
.os-washed::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: var(--wash); background-repeat: no-repeat; background-position: var(--wash-at, left top); background-size: var(--wash-size, 46%) auto; opacity: var(--wash-op, 0.55); }

/* 공통 글자 */
.os-eyebrow { font-size: 0.875rem; font-weight: 700; line-height: 1.4; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-accent); }
.os-eyebrow--light { color: var(--c-mint-on-dark); }
.os-hand { font-family: var(--f-hand); font-weight: 400; font-size: clamp(1.625rem, 1.3rem + 1.1vw, 2.125rem); line-height: 1.15; color: var(--c-green); transform: rotate(-2deg); }
.os-hand--left { transform-origin: left center; }
.os-hand--light { color: var(--c-mint-on-dark); }
.os-title { font-family: var(--f-display); font-weight: 400; font-size: clamp(2rem, 1.3rem + 2.8vw, 3.375rem); line-height: 1.24; letter-spacing: -0.005em; color: var(--c-ink); }
.os-title--light { color: #fff; }
.os-title--light span { color: var(--c-mint-on-dark); }
.os-head { position: relative; max-width: 46rem; margin: 0 auto clamp(2.75rem, 5vw, 4rem); text-align: center; }
.os-head .os-eyebrow { margin-bottom: 0.875rem; }
.os-head .os-hand { margin-bottom: 0.375rem; }
.os-desc { margin-top: 1.125rem; font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem); color: var(--c-body); }
.os-staged { position: absolute; left: 0.5rem; bottom: 0.5rem; z-index: 1; padding: 0.125rem 0.5rem; border-radius: 6px; background: rgba(12, 30, 22, 0.66); color: #fff; font-size: 0.875rem; font-weight: 600; line-height: 1.5; }

/* 버튼 */
.os-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 3.5rem; padding: 0 1.75rem; border-radius: 999px; font-size: 1.0625rem; font-weight: 700; letter-spacing: -0.01em; transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease), background-color 0.3s var(--ease); }
.os-btn:hover { transform: translateY(-2px); }
.os-btn--solid { background: var(--c-green); color: #fff; box-shadow: 0 14px 28px -14px rgba(21, 122, 75, 0.7); }
.os-btn--solid:hover { background: var(--c-deep); }
.os-btn--kakao { background: var(--c-kakao); color: #1E1B05; box-shadow: 0 14px 28px -16px rgba(120, 100, 0, 0.55); }
.os-btn--kakao .ico path, .os-kakao__ic .ico path, .os-dock__kakao .ico path, .os-mbar__kakao .ico path, .os-faq__more .ico path { fill: currentColor; }
.os-btn--block { width: 100%; }
.os-btn--lg { min-height: 3.75rem; font-size: 1.125rem; }
.os-btn .ico { transition: transform 0.3s var(--ease); }
.os-btn:hover .ico:last-child { transform: translateX(3px); }

/* ── 헤더 — 랜딩이라 최소(로고 · 언어 · 상담 신청) ─────────────────────── */
.os-hd { background: rgba(255, 255, 255, 0.86); border-bottom-color: rgba(15, 61, 42, 0.08); }
.os-hd__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 100%; max-width: calc(var(--col) + 2rem); margin-inline: auto; padding-inline: clamp(1rem, 3vw, 1.75rem); }
.os-logo { display: inline-flex; align-items: center; gap: 0.625rem; min-height: 2.75rem; color: var(--c-ink); white-space: nowrap; }
.os-mark { flex-shrink: 0; }
.os-logo__txt { display: inline-flex; align-items: baseline; gap: 0.5rem; line-height: 1; }
/* 🔴 로고 글자는 <b> 가 아니라 span — `body.os b { 700 }` 이 이겨 Black Han Sans 가 가짜 굵게 그려졌다(2026-09-22 검증) */
.os-logo__name { font-family: var(--f-display); font-weight: 400; font-size: 1.4375rem; letter-spacing: -0.01em; }
.os-logo__sub { font-size: 0.9375rem; font-weight: 600; color: var(--c-mute); }
.os-hd__right { display: flex; align-items: center; gap: clamp(0.5rem, 2vw, 1.25rem); }
.os-lang { display: flex; align-items: center; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.06em; }
.os-lang li { display: flex; align-items: center; }
.os-lang li + li::before { content: ''; width: 1px; height: 0.75rem; background: var(--c-line-strong); }
.os-lang a { display: inline-flex; align-items: center; min-height: 2.75rem; min-width: 2.75rem; justify-content: center; padding: 0 0.5rem; color: var(--c-mute); transition: color 0.2s; }
.os-lang a:hover { color: var(--c-ink); }
.os-lang a[aria-current] { color: var(--c-green); }
.os-hd__cta { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1.25rem; border-radius: 999px; background: var(--c-deep); color: #fff; font-size: 0.9375rem; font-weight: 700; transition: background-color 0.25s; }
.os-hd__cta:hover { background: var(--c-green); }

/* ── ① 첫 화면 ─────────────────────────────────────────────────────────── */
.os-hero { position: relative; padding-top: var(--hd-h); }
.os-hero__visual { position: relative; height: clamp(17.5rem, 10rem + 24vw, 28rem); }
.os-hero__visual::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: url(../img/wash-mint.svg) right -6% top -46% / 40% auto no-repeat, url(../img/wash-sun.svg) left -4% top -10% / 24% auto no-repeat; mix-blend-mode: multiply; opacity: 0.85; }
.os-hero__photo { position: absolute; inset: 0; -webkit-mask: url(../img/mask-hero.svg) center / 100% 100% no-repeat; mask: url(../img/mask-hero.svg) center / 100% 100% no-repeat; }
.os-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 80%; filter: saturate(0.92) contrast(1.02); }

/* 여행 가방 꼬리표 — 손글씨 약속 한 줄 */
.os-tag { position: absolute; z-index: 2; right: 8%; top: 20%; padding: 0 1.5rem 1rem 2.625rem; border-radius: 12px; background: #FFFDF8; box-shadow: 0 22px 40px -22px rgba(15, 40, 30, 0.55), 0 0 0 1px rgba(15, 61, 42, 0.06); transform: rotate(5deg); text-align: left; }
.os-tag::before { content: ''; position: absolute; left: 0.875rem; top: 58%; width: 0.75rem; height: 0.75rem; border-radius: 50%; background: var(--c-paper); box-shadow: inset 0 0 0 2px rgba(15, 61, 42, 0.22); }
.os-tag::after { content: ''; position: absolute; left: -2.75rem; top: 52%; width: 3.25rem; height: 1.5rem; border: 2px solid #C7A36A; border-color: transparent transparent #C7A36A #C7A36A; border-radius: 0 0 0 60%; transform: rotate(-18deg); }
.os-tag__top { display: block; margin: 0 -1.5rem 0.75rem -2.625rem; padding: 0.375rem 1.25rem; border-radius: 12px 12px 0 0; background: var(--c-green); color: #fff; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.1em; white-space: nowrap; }
.os-tag__hand { display: block; font-family: var(--f-hand); font-size: 1.625rem; line-height: 1.15; color: var(--c-deep); white-space: nowrap; }

.os-hero__body { position: relative; z-index: 2; isolation: isolate; margin-top: clamp(-4.75rem, -3.4vw, -1.25rem); padding: 0 var(--pad-x) clamp(3.75rem, 6vw, 5.5rem); text-align: center; --wash: url(../img/wash-sky.svg); --wash-at: left -12% bottom 0; --wash-size: 44%; --wash-op: 0.7; }
.os-hero .os-eyebrow { margin-bottom: 1rem; }
.os-hero__title { font-family: var(--f-display); font-weight: 400; font-size: clamp(2.25rem, 1.1rem + 4.1vw, 4.375rem); line-height: 1.17; letter-spacing: -0.01em; color: var(--c-ink); }
.os-hero__title > span { display: block; }
.os-hero__title .is-green { color: var(--c-green); }
.os-hero__title .is-green em { font-style: normal; background: linear-gradient(180deg, transparent 60%, rgba(205, 235, 221, 0.95) 60%, rgba(205, 235, 221, 0.95) 92%, transparent 92%); -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: 0 0.08em; }
.os-hero__sub { margin-top: 1.125rem; font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); font-weight: 800; letter-spacing: -0.02em; color: var(--c-green); }
.os-hero__lead { margin-top: 0.625rem; font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem); color: var(--c-body); }
.os-hero__cta { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.75rem; margin-top: 2rem; }
.os-hero__points { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.5rem 1.5rem; margin-top: 1.5rem; font-size: 0.9375rem; font-weight: 600; color: var(--c-body); }
.os-hero__points li { display: inline-flex; align-items: center; gap: 0.375rem; }
.os-hero__points .ico { color: var(--c-green); }

/* ── ② 소개 · 누구에게 ─────────────────────────────────────────────────── */
.os-intro { background: #fff; --wash: url(../img/wash-mint.svg); --wash-at: left -14% top -3%; --wash-size: 46%; --wash-op: 0.5; }
.os-intro__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(2.5rem, 5vw, 4.5rem); align-items: center; }
.os-intro__text .os-eyebrow { margin-bottom: 0.875rem; }
.os-intro__lead { margin-top: 1.25rem; font-size: clamp(1.0313rem, 0.97rem + 0.3vw, 1.1875rem); line-height: 1.85; color: var(--c-body); }
.os-intro__lead b { color: var(--c-ink); background: linear-gradient(180deg, transparent 62%, var(--c-mint) 62%); }
.os-intro__photos { position: relative; padding: 0 0 3.5rem 3rem; }
.os-intro__main { border-radius: 26px 26px 26px 120px; overflow: hidden; aspect-ratio: 4 / 3.3; box-shadow: 0 30px 60px -40px rgba(15, 61, 42, 0.5); }
.os-intro__main img { width: 100%; height: 100%; object-fit: cover; }
.os-intro__sub { position: absolute; left: 0; bottom: 0; width: 40%; aspect-ratio: 1; border-radius: 22px; overflow: hidden; border: 6px solid #fff; box-shadow: 0 24px 40px -24px rgba(15, 61, 42, 0.55); }
.os-intro__sub img { width: 100%; height: 100%; object-fit: cover; }
.os-intro__cap { position: absolute; right: 0.5rem; bottom: 0.25rem; font-family: var(--f-hand); font-size: 1.625rem; line-height: 1.1; color: var(--c-green); transform: rotate(-4deg); text-align: right; }

.os-who { position: relative; margin-top: clamp(3.5rem, 7vw, 5.5rem); }
.os-who__label { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; font-size: 1rem; font-weight: 800; color: var(--c-deep); }
.os-who__label::before, .os-who__label::after { content: ''; flex: 1; height: 1px; background: var(--c-line); }
.os-who__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.os-who__item { padding: 1.75rem 1.5rem 1.625rem; border-radius: 20px; background: var(--c-paper); }
.os-who__ic { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; margin-bottom: 1.125rem; border-radius: 50%; background: #fff; color: var(--c-green); }
.os-who__t { font-size: 1.125rem; font-weight: 800; color: var(--c-ink); letter-spacing: -0.01em; }
.os-who__d { margin-top: 0.375rem; font-size: 0.9375rem; line-height: 1.65; color: var(--c-mute); }

/* ── ③ 검진 구성 — 사진 카드 ─────────────────────────────────────────── */
.os-prog { background: var(--c-paper); --wash: url(../img/wash-sun.svg); --wash-at: right -8% bottom 2%; --wash-size: 34%; --wash-op: 0.5; }
.os-prog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; }
.os-card { position: relative; display: flex; flex-direction: column; padding: 0.625rem 0.625rem 1.5rem; border-radius: 24px; background: #fff; color: var(--c-body); box-shadow: 0 1px 0 rgba(15, 61, 42, 0.04), 0 28px 50px -36px rgba(15, 61, 42, 0.45); }
.os-card__top { position: relative; }
.os-card__media { aspect-ratio: 16 / 10.5; border-radius: 18px; overflow: hidden; background: var(--c-mint-2); }
.os-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.os-card:hover .os-card__media img { transform: scale(1.04); }
.os-card__tag { position: absolute; left: 1rem; bottom: -0.9375rem; display: inline-flex; align-items: center; gap: 0.625rem; padding: 0.375rem 0.875rem; border-radius: 6px; background: var(--c-green); color: #fff; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.1em; box-shadow: 0 8px 16px -10px rgba(15, 61, 42, 0.6); }
.os-card__tag i { width: 1px; height: 0.875rem; background: currentColor; opacity: 0.6; }
.os-card__body { flex: 1; display: flex; flex-direction: column; padding: 1.75rem 1.125rem 0; }
.os-card__hand { font-family: var(--f-hand); font-size: 1.5rem; line-height: 1.15; color: var(--c-green); transform: rotate(-2deg); transform-origin: left center; }
.os-card__title { margin-top: 0.25rem; font-family: var(--f-display); font-weight: 400; font-size: clamp(1.75rem, 1.5rem + 0.7vw, 2.125rem); line-height: 1.2; color: var(--c-ink); }
.os-card__time { display: flex; align-items: center; gap: 0.375rem; margin-top: 0.75rem; font-size: 0.9375rem; font-weight: 700; color: var(--c-accent); }
.os-card__for { margin-top: 0.75rem; padding-bottom: 1.25rem; border-bottom: 1px dashed var(--c-line-strong); font-size: 0.9375rem; line-height: 1.7; color: var(--c-mute); }
.os-card__base { display: inline-flex; align-items: center; gap: 0.375rem; align-self: flex-start; margin-top: 1.25rem; padding: 0.375rem 0.75rem; border-radius: 999px; background: var(--c-mint-2); color: var(--c-deep); font-size: 0.875rem; font-weight: 700; }
.os-card__list { display: grid; gap: 0.625rem; margin: 1.25rem 0 2rem; }
.os-card__list li { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 1rem; line-height: 1.5; color: var(--c-ink); }
.os-card__list .ico { margin-top: 0.125rem; color: var(--c-green); }
.os-card__cta { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; min-height: 3.25rem; padding: 0 1.25rem; border-radius: 999px; border: 1.5px solid var(--c-green); color: var(--c-green); font-weight: 700; font-size: 1rem; transition: background-color 0.25s, color 0.25s; }
.os-card__cta:hover { background: var(--c-green); color: #fff; }
.os-card--featured { background: linear-gradient(165deg, #17603F 0%, var(--c-deep) 62%); color: rgba(255, 255, 255, 0.8); transform: translateY(-14px); box-shadow: 0 40px 60px -34px rgba(15, 61, 42, 0.8); }
.os-card--featured .os-card__tag { background: var(--c-mint); color: var(--c-deep); }
.os-card--featured .os-card__hand, .os-card--featured .os-card__time { color: var(--c-mint-on-dark); }
.os-card--featured .os-card__title { color: #fff; }
.os-card--featured .os-card__for { color: rgba(255, 255, 255, 0.76); border-color: rgba(255, 255, 255, 0.22); }
.os-card--featured .os-card__base { background: rgba(255, 255, 255, 0.12); color: #fff; }
.os-card--featured .os-card__list li { color: #fff; }
.os-card--featured .os-card__list .ico { color: var(--c-mint-on-dark); }
.os-card--featured .os-card__cta { background: #fff; border-color: #fff; color: var(--c-deep); }
.os-card--featured .os-card__cta:hover { background: var(--c-mint); border-color: var(--c-mint); }

.os-extra { position: relative; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.75rem 1.25rem; margin-top: 2.75rem; padding: 1rem 1.5rem; border-radius: 999px; background: rgba(255, 255, 255, 0.72); border: 1px dashed rgba(21, 122, 75, 0.4); }
.os-extra__t { display: inline-flex; align-items: center; gap: 0.375rem; font-weight: 800; color: var(--c-deep); }
.os-extra__t .ico { color: var(--c-green); }
.os-extra__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; }
.os-extra__list li { padding: 0.3125rem 0.875rem; border-radius: 999px; background: var(--c-mint-2); color: var(--c-deep); font-size: 0.9375rem; font-weight: 600; }
.os-note { position: relative; display: flex; align-items: flex-start; justify-content: center; gap: 0.5rem; max-width: 46rem; margin: 1.5rem auto 0; font-size: 0.9375rem; line-height: 1.65; color: var(--c-mute); }
.os-note .ico { margin-top: 0.1875rem; color: var(--c-green); }
.os-note b { color: var(--c-ink); }

/* ── ④ 원스톱 케어(어두운 면 · 사진 머리) ─────────────────────────────── */
.os-care { padding-top: 0; background: radial-gradient(50% 40% at 100% 100%, rgba(56, 166, 114, 0.18), transparent 70%), var(--c-deep); color: rgba(255, 255, 255, 0.78); }
.os-care__visual { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; min-height: clamp(30rem, 20rem + 18vw, 36rem); margin: 0 calc(var(--pad-x) * -1); padding: clamp(6rem, 10vw, 8rem) var(--pad-x) clamp(1.5rem, 3vw, 2.5rem); }
.os-care__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 72% 40%; filter: saturate(0.75); }
/* 아래로 섹션 바탕(--c-deep)에 정확히 녹아야 경계선이 안 보인다 — 세로 그라디언트를 **위 층**에 둔다 */
.os-care__visual::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(15, 61, 42, 0) 50%, var(--c-deep) 100%), linear-gradient(90deg, rgba(10, 42, 29, 0.95) 0%, rgba(10, 42, 29, 0.82) 36%, rgba(10, 42, 29, 0.28) 72%, rgba(10, 42, 29, 0.12) 100%); }
.os-care__head { max-width: 34rem; }
.os-care__head .os-eyebrow { margin-bottom: 0.75rem; }
.os-care__head .os-hand { margin-bottom: 0.25rem; }
.os-care__desc { margin-top: 1.25rem; max-width: 30em; font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem); color: rgba(255, 255, 255, 0.82); }
.os-care__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); margin-top: clamp(1.5rem, 3vw, 2.5rem); border-top: 1px solid rgba(255, 255, 255, 0.16); }
.os-care__item { padding: 2.25rem 0 2.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
.os-bubble { position: relative; display: inline-block; margin-bottom: 1.5rem; padding: 0.5rem 1.25rem 0.4375rem; border-radius: 999px; background: var(--c-mint); color: var(--c-deep); font-family: var(--f-hand); font-size: 1.5rem; line-height: 1.2; }
.os-bubble::after { content: ''; position: absolute; left: 1.5rem; top: calc(100% - 1px); width: 1.125rem; height: 0.875rem; background: inherit; clip-path: polygon(0 0, 100% 0, 0 100%); }
.os-care__t { display: flex; align-items: baseline; gap: 0.75rem; font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem); font-weight: 800; letter-spacing: -0.02em; color: #fff; }
.os-care__no { font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.06em; color: var(--c-mint-on-dark); }
.os-care__d { margin-top: 0.75rem; font-size: 1rem; line-height: 1.75; color: rgba(255, 255, 255, 0.76); }

/* ── ⑤ 편의 서비스 체크리스트 + 카카오톡 ─────────────────────────────── */
.os-svc { background: var(--c-mint-2); --wash: url(../img/wash-green.svg); --wash-at: right -12% top -2%; --wash-size: 50%; --wash-op: 0.35; }
.os-svc__grid { position: relative; display: grid; grid-template-columns: minmax(0, 0.84fr) minmax(0, 1.16fr); gap: clamp(2rem, 4.5vw, 3.75rem); align-items: stretch; max-width: 60rem; margin: 0 auto; }
.os-svc__photo { position: relative; min-height: 25rem; border-radius: 28px 28px 110px 28px; overflow: hidden; box-shadow: 0 34px 60px -40px rgba(15, 61, 42, 0.6); }
.os-svc__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.os-svc__cap { position: absolute; left: 1.25rem; top: 1.25rem; padding: 0.5rem 1rem 0.375rem; border-radius: 12px; background: #FFFDF8; color: var(--c-deep); font-family: var(--f-hand); font-size: 1.5rem; line-height: 1.1; box-shadow: 0 16px 30px -18px rgba(15, 40, 30, 0.6); transform: rotate(-3deg); }
.os-svc__list { display: grid; align-content: start; border-top: 2px solid var(--c-deep); }
.os-svc__row { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr) 1.875rem; align-items: center; gap: 1.125rem; padding: 1.125rem 0.25rem; border-bottom: 1px solid rgba(15, 61, 42, 0.15); }
.os-svc__ic { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: #fff; color: var(--c-green); box-shadow: 0 8px 18px -12px rgba(15, 61, 42, 0.5); }
.os-svc__txt { display: grid; gap: 0.125rem; }
.os-svc__txt b { font-size: 1.125rem; font-weight: 800; letter-spacing: -0.01em; color: var(--c-ink); }
.os-svc__txt span { font-size: 0.9375rem; line-height: 1.6; color: var(--c-body); }
.os-tick { color: var(--c-green); }

.os-talk { position: relative; display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 5rem); align-items: center; max-width: 56rem; margin: clamp(4.5rem, 9vw, 6.5rem) auto 0; }
.os-phone { display: flex; flex-direction: column; width: 100%; aspect-ratio: 9 / 17.5; border: 9px solid #15231C; border-radius: 2.75rem; background: #fff; overflow: hidden; box-shadow: 0 50px 70px -40px rgba(15, 61, 42, 0.6); transform: rotate(-4deg); }
.os-phone__bar { display: flex; align-items: center; gap: 0.5rem; padding: 1.625rem 1rem 0.75rem; border-bottom: 1px solid rgba(15, 61, 42, 0.08); font-size: 0.9375rem; color: var(--c-ink); }
.os-phone__av .os-mark { border-radius: 8px; }
.os-phone__chat { flex: 1; display: flex; flex-direction: column; gap: 0.625rem; padding: 1rem 0.75rem; background: #DCEBE3; }
.os-msg { align-self: flex-start; max-width: 88%; padding: 0.5625rem 0.8125rem; border-radius: 1rem 1rem 1rem 0.25rem; background: #fff; color: var(--c-ink); font-size: 0.875rem; line-height: 1.5; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); }
.os-msg--me { align-self: flex-end; border-radius: 1rem 1rem 0.25rem 1rem; background: #FFEB6E; }
.os-talk__title { margin-top: 0.5rem; font-family: var(--f-display); font-weight: 400; font-size: clamp(1.875rem, 1.3rem + 2vw, 2.625rem); line-height: 1.25; color: var(--c-ink); }
.os-talk__desc { margin-top: 1rem; color: var(--c-body); }
.os-talk__chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.25rem; }
.os-talk__chips li { padding: 0.3125rem 0.875rem; border-radius: 999px; background: #fff; border: 1px solid rgba(15, 61, 42, 0.12); color: var(--c-deep); font-size: 0.9375rem; font-weight: 700; }
.os-kakao { display: flex; align-items: center; gap: 1rem; margin-top: 2rem; min-height: 5rem; padding: 0.75rem 1.5rem 0.75rem 0.75rem; border-radius: 999px; background: #1B1C1A; color: #fff; box-shadow: 0 24px 40px -24px rgba(0, 0, 0, 0.6); transition: transform 0.3s var(--ease), background-color 0.3s; }
.os-kakao:hover { transform: translateY(-3px); background: #000; }
.os-kakao__ic { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--c-kakao); color: #1B1C1A; flex-shrink: 0; }
.os-kakao__txt { flex: 1; display: grid; line-height: 1.3; }
.os-kakao__txt small { font-size: 0.875rem; color: rgba(255, 255, 255, 0.72); }
.os-kakao__txt b { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.01em; }

/* ── ⑥ 일정 흐름 — 사진 원 + 점선 ─────────────────────────────────────── */
.os-flow { background: #fff; }
.os-flow__list { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }
.os-flow__list::before { content: ''; position: absolute; top: 3.5rem; left: 10%; right: 10%; border-top: 2px dashed rgba(21, 122, 75, 0.35); }
.os-flow__step { position: relative; text-align: center; }
.os-flow__pic { position: relative; z-index: 1; display: block; width: 7rem; height: 7rem; margin: 0 auto 1.375rem; padding: 5px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px var(--c-mint), 0 18px 30px -18px rgba(15, 61, 42, 0.6); }
.os-flow__pic img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.os-flow__ic { position: absolute; right: -0.125rem; bottom: -0.125rem; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--c-green); color: #fff; border: 3px solid #fff; }
.os-flow__step.is-last .os-flow__pic { box-shadow: 0 0 0 2px var(--c-green), 0 18px 30px -18px rgba(15, 61, 42, 0.6); }
.os-flow__step.is-last .os-flow__ic { background: var(--c-deep); }
.os-flow__d { font-family: var(--f-display); font-size: 1.375rem; line-height: 1.2; color: var(--c-green); }
.os-flow__t { margin-top: 0.25rem; font-size: 1.125rem; font-weight: 800; color: var(--c-ink); }
.os-flow__x { margin-top: 0.5rem; font-size: 0.9375rem; line-height: 1.65; color: var(--c-mute); }
.os-flow__note { margin-top: 2.75rem; text-align: center; font-size: 0.9375rem; color: var(--c-mute); }

/* ── ⑦ 자주 묻는 질문 — 옆 사진 ───────────────────────────────────────── */
.os-faq { background: var(--c-paper); --wash: url(../img/wash-sky.svg); --wash-at: right -10% top 1%; --wash-size: 40%; --wash-op: 0.45; }
.os-faq__grid { position: relative; display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); gap: clamp(2rem, 4.5vw, 3.75rem); align-items: start; }
.os-faq__photo { position: sticky; top: calc(var(--hd-h) + 1.5rem); aspect-ratio: 3 / 4; border-radius: 26px 110px 26px 26px; overflow: hidden; box-shadow: 0 34px 60px -40px rgba(15, 61, 42, 0.55); }
.os-faq__photo img { width: 100%; height: 100%; object-fit: cover; }
.os-faq__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 42, 29, 0) 38%, rgba(10, 42, 29, 0.62) 68%, rgba(10, 42, 29, 0.92) 100%); pointer-events: none; }
.os-faq__cap { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; display: grid; justify-items: start; gap: 0.625rem; padding: 1.5rem; }
.os-faq__cap .os-hand { font-size: 1.75rem; text-shadow: 0 1px 12px rgba(6, 26, 18, 0.7); }
.os-faq__more { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; padding: 0 1.125rem; border-radius: 999px; background: var(--c-kakao); color: #1E1B05; font-size: 0.9375rem; font-weight: 700; transition: transform 0.3s var(--ease); }
.os-faq__more:hover { transform: translateY(-2px); }
.os-faq__list { border-top: 2px solid var(--c-deep); }
.os-faq__item { border-bottom: 1px solid var(--c-line-strong); }
.os-faq__item summary { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) 2.75rem; align-items: center; gap: 0.75rem; min-height: 3.5rem; padding: 1.125rem 0.25rem; cursor: pointer; list-style: none; }
.os-faq__item summary::-webkit-details-marker { display: none; }
.os-faq__q { font-family: var(--f-display); font-size: 1.5rem; line-height: 1; color: var(--c-green); }
.os-faq__qt { font-size: clamp(1.0313rem, 1rem + 0.2vw, 1.125rem); font-weight: 700; line-height: 1.5; color: var(--c-ink); }
.os-faq__ic { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: #fff; color: var(--c-green); transition: transform 0.35s var(--ease), background-color 0.3s, color 0.3s; }
.os-faq__item[open] .os-faq__ic { transform: rotate(45deg); background: var(--c-green); color: #fff; }
.os-faq__item summary:hover .os-faq__qt { color: var(--c-green); }
.os-faq__item summary:focus-visible { outline-offset: -2px; border-radius: 8px; }
.os-faq__a { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: 0.75rem; padding: 0 3.75rem 1.75rem 0.25rem; }
.os-faq__al { font-family: var(--f-display); font-size: 1.5rem; line-height: 1.2; color: var(--c-line-strong); }
.os-faq__a p { color: var(--c-body); line-height: 1.8; }

/* ── ⑧ 상담 신청 ───────────────────────────────────────────────────────── */
.os-apply { background: var(--c-paper); }
.os-faq + .os-apply { padding-top: 0; }
.os-apply__card { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); border-radius: 28px; overflow: hidden; background: #fff; box-shadow: 0 40px 80px -50px rgba(15, 61, 42, 0.5); }
.os-apply__aside { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; padding: clamp(2rem, 4vw, 3rem); background: var(--c-deep); color: rgba(255, 255, 255, 0.82); }
.os-apply__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; }
.os-apply__aside::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(15, 61, 42, 0.93) 0%, rgba(15, 61, 42, 0.88) 58%, rgba(15, 61, 42, 0.6) 100%); }
.os-apply__aside .os-eyebrow { margin-bottom: 0.75rem; }
.os-apply__title { margin-top: 0.25rem; font-family: var(--f-display); font-weight: 400; font-size: clamp(2rem, 1.5rem + 1.8vw, 2.75rem); line-height: 1.2; color: #fff; }
.os-apply__desc { margin-top: 1rem; line-height: 1.75; }
.os-apply__info { display: grid; gap: 1.25rem; margin: 2rem 0; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.2); }
.os-apply__info dt { display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; font-weight: 700; color: var(--c-mint-on-dark); }
.os-apply__info dd { margin-top: 0.25rem; font-size: 1.0625rem; font-weight: 600; line-height: 1.6; color: #fff; }
.os-apply__info small { font-size: 0.875rem; font-weight: 500; color: rgba(255, 255, 255, 0.76); }
.os-apply__tel { display: inline-flex; align-items: center; min-height: 2.75rem; font-family: var(--f-display); font-weight: 400; font-size: 1.875rem; letter-spacing: 0.02em; color: #fff; }   /* dd 의 600 을 물려받으면 가짜 굵게 */
.os-apply__aside .os-btn { margin-top: auto; }

.os-form { display: grid; gap: 1.25rem; align-content: start; padding: clamp(1.75rem, 4vw, 3rem); }
.os-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.os-form .input, .os-form .select, .os-form .textarea { border-color: var(--c-line-strong); background: #fff; font-size: 1rem; }
.os-form .input::placeholder, .os-form .textarea::placeholder { color: #66706A; }   /* 흰 입력칸 위 5.1:1 — 형식 안내(「숫자만 입력」)도 글자다(예전 #737D78 = 4.26) */
.os-form .select { -webkit-appearance: none; appearance: none; padding-right: 2.5rem; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23157A4B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 0.875rem center / 1.125rem no-repeat; }
.os-form .input[aria-invalid='true'], .os-form .select[aria-invalid='true'] { border-color: #B3261E; box-shadow: 0 0 0 3px rgba(179, 38, 30, 0.12); }
.os-form .field__label { font-size: 0.9375rem; }
.os-tel { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: 0.5rem; }
.os-opt { margin-left: 0.25rem; font-size: 0.875rem; font-weight: 500; color: var(--c-mute); }
.os-pick { margin: 0; padding: 0; border: 0; min-width: 0; }
.os-pick legend { margin-bottom: 0.5rem; padding: 0; }
.os-pick__list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.os-pick__opt { position: relative; }
.os-pick__opt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.os-pick__opt span { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1.125rem; border-radius: 999px; border: 1px solid var(--c-line-strong); font-size: 0.9375rem; font-weight: 600; color: var(--c-body); transition: background-color 0.2s, color 0.2s, border-color 0.2s; }
.os-pick__opt input:checked + span { background: var(--c-green); border-color: var(--c-green); color: #fff; }
.os-pick__opt input:focus-visible + span { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.os-pick.is-picked .os-pick__opt input:checked + span { animation: os-pop 0.6s var(--ease); }
@keyframes os-pop { 0% { transform: scale(1); } 40% { transform: scale(1.08); } 100% { transform: scale(1); } }
/* 동의 상자 — 수집 항목·목적·기간·거부권을 체크 바로 위에 요약한다(전문은 privacy/) */
.os-agree { display: grid; gap: 0.25rem; padding: 1rem 0.5rem 0.375rem 1rem; border-radius: 14px; background: var(--c-panel); }
.os-agree__terms { display: grid; gap: 0.375rem; padding: 0 0.5rem 0.5rem 0; font-size: 0.875rem; line-height: 1.6; }
/* 샘플 표기(§6.6) — 요약 맨 끝에 붙이고, 체크 줄과 가르는 선은 이 줄이 진다 */
.os-agree__sample { padding: 0 0.5rem 0.75rem 0; border-bottom: 1px solid var(--c-line); font-size: 0.875rem; line-height: 1.6; color: var(--c-mute); }
.os-agree__terms div { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 0.5rem; }
.os-agree__terms dt { font-weight: 700; color: var(--c-ink); }
.os-agree__terms dd { color: var(--c-body); }
.os-agree__row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.os-agree .check { align-items: center; }
.os-agree .check input { margin-top: 0; }
.os-agree .check input[aria-invalid='true'] { outline: 2px solid #B3261E; outline-offset: 2px; }
.os-agree .check b { color: var(--c-accent); }
.os-agree__more { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.5rem; white-space: nowrap; font-size: 0.9375rem; font-weight: 700; color: var(--c-accent); text-decoration: underline; text-underline-offset: 3px; }
.os-form__note { font-size: 0.875rem; text-align: center; color: var(--c-mute); }
.os-form__hint { display: flex; align-items: flex-start; gap: 0.375rem; font-size: 0.875rem; line-height: 1.55; color: var(--c-mute); }
.os-form__hint .ico { flex-shrink: 0; margin-top: 0.0625rem; color: var(--c-green); }

/* ── ⑨ 위치 ────────────────────────────────────────────────────────────── */
.os-loc { background: #fff; }
.os-loc__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(2rem, 4vw, 3rem); align-items: center; }
.os-loc__visual { position: relative; padding-bottom: 3.5rem; }
.os-map { position: relative; aspect-ratio: 7 / 5; border-radius: 24px; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(15, 61, 42, 0.06); }
.os-map__svg { width: 100%; height: 100%; }
.os-map__lb { position: absolute; display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.375rem 0.75rem; border-radius: 999px; background: #fff; color: var(--c-deep); font-size: 0.875rem; font-weight: 700; white-space: nowrap; box-shadow: 0 10px 22px -12px rgba(15, 61, 42, 0.55); transform: translate(-50%, calc(-100% - 0.875rem)); }
.os-map__lb .ico { color: var(--c-green); }
.os-map__lb--a { left: 12.5%; top: 82.5%; }
.os-map__lb--b { left: 40.2%; top: 55%; }
.os-map__lb--c { left: 66.4%; top: 37.5%; padding: 0.3125rem 0.875rem 0.3125rem 0.3125rem; background: var(--c-deep); color: #fff; font-size: 0.9375rem; }
.os-map__lb--c .os-mark { border-radius: 50%; }
.os-loc__photo { position: absolute; right: 0.75rem; bottom: 0; width: 42%; border-radius: 18px; overflow: hidden; border: 5px solid #fff; box-shadow: 0 24px 40px -22px rgba(15, 61, 42, 0.6); transform: rotate(2.5deg); }
.os-loc__photo img { width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; }
.os-loc__photo figcaption { position: absolute; left: 0.5rem; bottom: 0.5rem; padding: 0.125rem 0.5rem; border-radius: 6px; background: rgba(12, 30, 22, 0.66); color: #fff; font-size: 0.875rem; font-weight: 600; }
.os-loc__info { border-top: 2px solid var(--c-deep); }
.os-loc__row { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1rem; padding: 1.0625rem 0.25rem; border-bottom: 1px solid var(--c-line); }
.os-loc__row dt { display: flex; align-items: center; gap: 0.5rem; font-weight: 700; color: var(--c-ink); }
.os-loc__row dt .ico { color: var(--c-green); }
.os-loc__row dd { color: var(--c-body); line-height: 1.65; }
.os-loc__line { display: block; }

/* ── ⑩ 푸터 ────────────────────────────────────────────────────────────── */
/* 푸터도 판 폭 안에 — 넓은 화면에서 판 바깥 목차·표제가 어두운 면 위로 올라가 흐려지지 않게 */
.os-ft { max-width: var(--col); margin-inline: auto; background: var(--c-dark); color: rgba(255, 255, 255, 0.66); font-size: 0.875rem; padding: 3.5rem 0 5.5rem; }
.os-ft__inner { max-width: var(--col); margin-inline: auto; padding-inline: var(--pad-x); }
.os-ft__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.os-logo--light { color: #fff; }
.os-logo--light .os-logo__sub { color: rgba(255, 255, 255, 0.7); }
.os-ft__links { display: flex; flex-wrap: wrap; gap: 0 1.5rem; }
.os-ft__links a { display: inline-flex; align-items: center; min-height: 2.75rem; font-size: 0.9375rem; font-weight: 600; color: rgba(255, 255, 255, 0.86); transition: color 0.2s; }
.os-ft__links li:first-child a { color: var(--c-mint-on-dark); font-weight: 700; }
.os-ft__links a:hover { color: #fff; }
.os-ft__info { display: grid; gap: 0.25rem; margin-top: 1.5rem; line-height: 1.7; }
.os-ft__bottom { display: grid; gap: 0.5rem; margin-top: 1.5rem; }
.os-ft__demo { max-width: 50em; color: rgba(255, 255, 255, 0.58); }

/* ── 떠 있는 버튼 · 모바일 하단 상담 바 ───────────────────────────────── */
.os-dock { position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 90; display: grid; gap: 0.75rem; }
.os-dock a { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; box-shadow: 0 14px 28px -12px rgba(0, 0, 0, 0.4); transition: transform 0.3s var(--ease), opacity 0.3s, visibility 0.3s, background-color 0.25s; }
.os-dock a:hover { transform: translateY(-3px); }
.os-dock__kakao { background: var(--c-kakao); color: #1B1C1A; }
.os-dock__top { background: var(--c-green); color: #fff; }
.os-dock__top:hover { background: var(--c-deep); }
.os-dock__top .ico { transform: rotate(180deg); }
html:not(.os-scrolled) .os-dock__top { opacity: 0; visibility: hidden; transform: translateY(10px); }
.os-mbar { display: none; }
html.fm-open .os-dock, html.fm-open .os-mbar { display: none; }

/* ── 개인정보 안내 지면 ─────────────────────────────────────────────────── */
.os-doc { padding-top: calc(var(--hd-h) + clamp(3rem, 6vw, 5rem)); --wash: url(../img/wash-mint.svg); --wash-at: right -12% top 0; --wash-size: 52%; --wash-op: 0.5; }
.os-doc > * { position: relative; }
.os-doc__title { margin-top: 0.75rem; font-family: var(--f-display); font-weight: 400; font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); line-height: 1.25; color: var(--c-ink); }
.os-doc__lead { margin-top: 1rem; max-width: 38em; font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem); color: var(--c-body); }
.os-doc__sample { margin-top: 0.5rem; font-size: 0.9375rem; color: var(--c-mute); }
.os-doc__body { display: grid; gap: 2rem; margin-top: 2.5rem; padding: clamp(1.5rem, 4vw, 3rem); border-radius: 24px; background: #fff; box-shadow: 0 30px 60px -50px rgba(15, 61, 42, 0.5); }
.os-doc__h { display: flex; align-items: baseline; gap: 0.75rem; font-size: 1.25rem; font-weight: 800; color: var(--c-ink); }
.os-doc__h span { font-size: 0.9375rem; font-weight: 700; color: var(--c-green); }
.os-doc__sec ul { display: grid; gap: 0.375rem; margin-top: 0.75rem; }
.os-doc__sec li { position: relative; padding-left: 1rem; color: var(--c-body); }
.os-doc__sec li::before { content: ''; position: absolute; left: 0; top: 0.72em; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--c-green); }
.os-doc__demo { display: flex; align-items: flex-start; gap: 0.5rem; margin: 1.5rem 0 2rem; font-size: 0.9375rem; color: var(--c-mute); }
.os-doc__demo .ico { margin-top: 0.125rem; color: var(--c-green); }

/* ── 반응형 ────────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  .os-prog__grid { grid-template-columns: minmax(0, 1fr); max-width: 34rem; margin-inline: auto; gap: 2rem; }
  .os-card--featured { transform: none; }
  .os-who__list { grid-template-columns: minmax(0, 1fr); }
  .os-who__item { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); column-gap: 1rem; align-items: center; padding: 1.25rem; }
  .os-who__ic { grid-row: span 2; margin: 0; }
  .os-who__d br { display: none; }
  .os-faq__grid { grid-template-columns: minmax(0, 1fr); }
  .os-faq__photo { position: relative; top: auto; aspect-ratio: 16 / 9; border-radius: 22px 80px 22px 22px; }
  .os-faq__photo img { object-position: 50% 80%; }   /* 찻잔을 위로 올려 캡션이 탁자 위(어두운 면)에 앉게 */
}
@media (max-width: 860px) {
  .os-hd__cta { display: none; }
  .os-intro__grid { grid-template-columns: minmax(0, 1fr); }
  .os-intro__photos { max-width: 34rem; }
  .os-care__visual { min-height: 0; padding-top: clamp(12rem, 40vw, 16rem); }
  .os-care__visual::before { background: linear-gradient(180deg, rgba(10, 42, 29, 0.1) 0%, rgba(10, 42, 29, 0.55) 34%, rgba(15, 61, 42, 0.94) 62%, var(--c-deep) 100%); }
  .os-care__bg { object-position: 70% 0%; height: 70%; }
  .os-care__list { grid-template-columns: minmax(0, 1fr); }
  .os-svc__grid { grid-template-columns: minmax(0, 1fr); }
  .os-svc__photo { min-height: 0; aspect-ratio: 16 / 11; border-radius: 22px 22px 80px 22px; }
  .os-talk { grid-template-columns: minmax(0, 1fr); }
  .os-phone { max-width: 16rem; margin-inline: auto; transform: rotate(-3deg); }
  .os-flow__list { grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 32rem; margin-inline: auto; }
  .os-flow__list::before { top: 2.5rem; bottom: 3rem; left: 2.25rem; right: auto; border-top: 0; border-left: 2px dashed rgba(21, 122, 75, 0.35); }
  .os-flow__step { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); column-gap: 1.25rem; text-align: left; padding-bottom: 1.75rem; }
  .os-flow__pic { grid-row: span 3; width: 4.5rem; height: 4.5rem; margin: 0; padding: 3px; }
  .os-flow__ic { width: 1.875rem; height: 1.875rem; right: -0.375rem; bottom: -0.25rem; border-width: 2px; }
  .os-flow__ic .ico { width: 16px; height: 16px; }
  .os-flow__d { font-size: 1.25rem; }
  .os-apply__card { grid-template-columns: minmax(0, 1fr); }
  .os-apply__aside .os-btn { margin-top: 0; }
  .os-loc__grid { grid-template-columns: minmax(0, 1fr); }
  .os-extra { border-radius: 22px; }

  /* 하단 고정 상담 바 */
  .os-mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr) minmax(0, 1.3fr); gap: 0.5rem; padding: 0.5rem 0.75rem calc(0.5rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, 0.95); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid rgba(15, 61, 42, 0.1); box-shadow: 0 -12px 30px -22px rgba(0, 0, 0, 0.35); }
  .os-mbar a { display: flex; align-items: center; justify-content: center; gap: 0.375rem; min-height: 3.25rem; border-radius: 14px; font-size: 0.9375rem; font-weight: 700; white-space: nowrap; }
  .os-mbar__kakao { background: var(--c-kakao); color: #1B1C1A; }
  .os-mbar__call { background: var(--c-mint-2); color: var(--c-deep); }
  .os-mbar__apply { background: var(--c-green); color: #fff; }
  .os-dock { right: 0.75rem; bottom: calc(4.25rem + env(safe-area-inset-bottom) + 0.75rem); }
  .os-dock__kakao { display: none !important; }
  .os-dock a { width: 3rem; height: 3rem; }
  :root { --badge-bottom: calc(4.25rem + env(safe-area-inset-bottom) + 0.75rem); }   /* 키트 변수 — 표식을 하단 바 위로 */
  /* 키보드로 옮겨 간 칸(FAQ·select)이 하단 바·표식 줄 뒤에 숨지 않게 */
  html { scroll-padding-bottom: calc(8.5rem + env(safe-area-inset-bottom)); }
  .os-ft { padding-bottom: calc(4.25rem + env(safe-area-inset-bottom) + 4.5rem); }
}
@media (max-width: 640px) {
  .os-logo__name { font-size: 1.3125rem; }
  .os-logo__sub { font-size: 0.875rem; }
  .os-lang a { padding: 0 0.25rem; }
  .os-eyebrow { letter-spacing: 0.12em; }
  .os-hero__visual { height: 15.5rem; }
  .os-hero__body { margin-top: -1.5rem; }
  /* 모바일은 사진이 거의 잘리지 않아 인물이 가운데에 선다 — 꼬리표를 왼쪽 위 창틀 자리로 작게(인물 머리를 가리지 않게) */
  .os-tag { right: auto; left: 3.5%; top: 3.5%; padding: 0 0.75rem 0.5rem 1.625rem; transform: rotate(-4deg); }
  .os-tag__top { margin: 0 -0.75rem 0.3125rem -1.625rem; padding: 0.125rem 0.625rem; letter-spacing: 0.04em; }
  .os-tag__hand { font-size: 1.125rem; line-height: 1.1; }
  .os-tag::before { left: 0.5rem; width: 0.625rem; height: 0.625rem; }
  .os-tag::after { display: none; }
  .os-hero__title { font-size: 2.125rem; }
  .os-hero__sub { margin-top: 0.875rem; font-size: 1.1875rem; }
  .os-hero__cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; margin-top: 1.5rem; }
  .os-hero__cta .os-btn { padding: 0 0.75rem; font-size: 1rem; }
  .os-hero__lead br { display: none; }
  .os-hero__points { gap: 0.25rem 0.875rem; margin-top: 1.125rem; font-size: 0.875rem; }
  .os-hero__body { padding-bottom: 3rem; }
  .os-card { padding: 0.5rem 0.5rem 1.25rem; }
  .os-card__body { padding: 1.625rem 0.875rem 0; }
  .os-form__row { grid-template-columns: minmax(0, 1fr); }
  .os-tel { grid-template-columns: minmax(0, 9.5rem) minmax(0, 1fr); }
  .os-agree { padding: 0.875rem 0.75rem 0.375rem 1rem; }
  .os-agree__terms div { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .os-agree__row { flex-direction: column; align-items: flex-start; gap: 0; }
  .os-agree__more { padding: 0; margin-left: 1.875rem; }
  .os-faq__item summary { grid-template-columns: 1.75rem minmax(0, 1fr) 2.75rem; gap: 0.5rem; }
  .os-faq__a { grid-template-columns: 1.75rem minmax(0, 1fr); gap: 0.5rem; padding-right: 0.25rem; }
  .os-faq__photo { aspect-ratio: 4 / 3; }
  .os-svc__row { grid-template-columns: 3rem minmax(0, 1fr) 1.625rem; gap: 0.875rem; }
  .os-svc__ic { width: 3rem; height: 3rem; }
  .os-svc__cap { font-size: 1.3125rem; }
  .os-loc__row { grid-template-columns: minmax(0, 1fr); gap: 0.25rem; }
  .os-loc__visual { padding-bottom: 2.75rem; }
  .os-loc__photo { width: 48%; right: 0.25rem; }
  .os-map__lb { font-size: 0.875rem; padding: 0.25rem 0.625rem; }
  .os-intro__photos { padding: 0 0 2.5rem 1.5rem; }
  .os-intro__cap { font-size: 1.375rem; }
  .os-kakao { min-height: 4.5rem; padding-right: 1.125rem; }
  .os-kakao__txt b { font-size: 1.125rem; }
}
@media (prefers-reduced-motion: reduce) {
  .os-card:hover .os-card__media img { transform: none; }
}
