/* =============================================================================
   클린미션 미니멀 개편 · 사이트 틀 (min.css)
   토대: cm-toss.css (스킬 원본 사본, 파일은 고치지 않는다) 위에 얹는다. 반드시 cm-toss.css 뒤에 불러온다.
   서체만 여기서 덮어쓴다(3차 지시 2026-10-02): 제목 · 버튼 · 본문 전부 Pretendard. 아래 :root 의 --cm-font.
   담는 것: 헤더 · 모바일 메뉴 · 푸터 · 상담 독 · 섹션 여백 · 제목 단계 · 버튼 줄 · 칩 ·
            고객 로고 띠 · 수상 배지 · 사례 카드 · 질문 접힘 · 실캡처 틀 · 상담 블록
   안별 형식(교대 행 · 카드+시트 · 탭 무대)은 여기 넣지 않는다. kit/v-<안>.css 에 둔다.
   겹침 순서: 독 40 < 헤더 50 < 시트 80 < 건너뛰기 100. /cm-popup.js 팝업(2147483000)과
   Tally 모달은 이보다 훨씬 위라서 충돌하지 않는다. 새 층을 만들 때 1000 을 넘기지 않는다.
   ============================================================================= */

:root {
  --min-hd-h: 64px;                 /* 헤더 높이 (safe-area 제외) */
  --min-z-dock: 40;
  --min-z-scrim: 45;
  --min-z-hd: 50;
  --min-z-sheet: 80;                /* 안별 시트가 쓸 자리 (b안) */
  --min-z-skip: 100;

  /* 서체 (3차 지시 2026-10-02, 대표 "폰트는 프리텐다드로"): 제목 · 버튼 · 본문 · 메뉴 · 칩 전부 Pretendard 한 벌.
     cm-toss.css 의 --cm-font 를 여기서 덮어쓴다. 그래서 .cm-btn · .cm-page 와 안별 css 의 var(--min-font-title) 도 같이 바뀐다.
     cm-toss.css 에 남아 있는 예전 제목 서체의 @font-face 는 쓰는 글자가 없어 파일을 받지 않는다(frame-check 가 요청 0건을 확인한다).
     서체 이름을 css 에 직접 적지 않는다. 반드시 var(--min-font-title) 또는 var(--min-font-body) 로 쓴다. */
  --cm-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;
  --min-font-title: var(--cm-font);
  --min-font-body: var(--cm-font);
  /* 제목 자간: Pretendard 는 큰 글자일수록 조금 더 좁힌다. 본문 · 메뉴 · 칩은 0 */
  --min-ls-h1: -0.025em;
  --min-ls-h2: -0.022em;
  --min-ls-h3: -0.018em;

  /* 제목 크기 한 벌 (히어로 · 섹션 · 카드) */
  --min-fs-h1: clamp(30px, 4.4vw, 52px);
  --min-fs-h2: clamp(24px, 3.1vw, 38px);
  --min-fs-h3: clamp(18px, 1.7vw, 22px);

  /* 섹션 여백 */
  --min-sec-y: clamp(56px, 7.5vw, 104px);
  --min-sec-y-tight: clamp(28px, 4vw, 48px);
  --min-head-gap: clamp(24px, 3.4vw, 44px);   /* 섹션 제목과 내용 사이 */

  --min-safe-t: env(safe-area-inset-top, 0px);
  --min-safe-b: env(safe-area-inset-bottom, 0px);
  --min-safe-l: env(safe-area-inset-left, 0px);
  --min-safe-r: env(safe-area-inset-right, 0px);
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--min-hd-h) + var(--min-safe-t) + 16px); }

.min-page { font-family: var(--min-font-body); }
.min-page main { display: block; overflow-x: clip; }
.min-page img, .min-page video { max-width: 100%; }
.min-page :where(a, button, summary, [tabindex]):focus-visible { outline: 2px solid var(--cm-brand); outline-offset: 2px; }
:where(.min-page a) { color: inherit; }
.min-page .cm-wrap { padding-left: max(var(--cm-gutter), var(--min-safe-l)); padding-right: max(var(--cm-gutter), var(--min-safe-r)); }

/* ---- 건너뛰기 링크 ------------------------------------------------------------ */
.min-skip {
  position: fixed; left: 16px; top: calc(10px + var(--min-safe-t)); z-index: var(--min-z-skip);
  padding: 10px 14px; border-radius: 12px; background: #fff; color: var(--cm-ink);
  font-size: 14px; font-weight: 700; text-decoration: none; box-shadow: var(--cm-shadow-3);
  transform: translateY(-220%); opacity: 0; pointer-events: none;
  transition: transform 180ms var(--cm-ease-out), opacity 180ms var(--cm-ease-out);
}
.min-skip:focus { transform: none; opacity: 1; pointer-events: auto; }

/* ---- 헤더 (반투명 고정 바 · 스크롤하면 그림자) ------------------------------------ */
/* 바탕 · 블러 · 그림자는 .cm-nav 가 맡는다. 여기서는 배치만. */
.min-hd { z-index: var(--min-z-hd); padding-top: var(--min-safe-t); }
.min-hd__row { display: flex; align-items: center; gap: 8px; height: var(--min-hd-h); }
.min-hd__logo {
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; margin-left: -4px; padding-right: 8px;
  color: var(--cm-ink); text-decoration: none; border-radius: 10px;
  font: 700 18px/1 var(--min-font-title); letter-spacing: -0.02em; white-space: nowrap;
}
.min-hd__logo img { display: block; width: 30px; height: 30px; }

.min-hd__nav { margin-inline: auto; }
.min-nav { display: none; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.min-nav > li { position: relative; margin: 0; padding: 0; }
.min-nav__link {
  -webkit-appearance: none; appearance: none; border: 0; background: transparent; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 14px; border-radius: 10px;
  color: var(--cm-ink-3); font: 500 15px/1 var(--min-font-body); text-decoration: none; white-space: nowrap;
  transition: background-color var(--cm-t-fast) ease, color var(--cm-t-fast) ease;
  -webkit-tap-highlight-color: transparent;
}
.min-nav__link[aria-current="page"],
.min-nav__link[data-current] { color: var(--cm-violet-500); }
.min-nav__link[aria-expanded="true"] { color: var(--cm-ink); background: var(--cm-row-tint); }
.min-nav__caret { width: 12px; height: 12px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.7; transition: transform var(--cm-t-fast) var(--cm-ease-out); }
.min-nav__link[aria-expanded="true"] .min-nav__caret { transform: rotate(180deg); }
@media (hover: hover) and (pointer: fine) {
  .min-nav__link:hover { color: var(--cm-ink); background: var(--cm-row-tint); }
}

/* 드롭다운: 누른 자리(위 가운데)에서 열린다. 나갈 때가 더 빠르다. */
.min-menu {
  position: absolute; top: 100%; left: 50%; z-index: 1; padding-top: 8px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateX(-50%) translateY(-4px) scale(0.97); transform-origin: top center;
  transition: opacity 120ms var(--cm-ease-out), transform 120ms var(--cm-ease-out), visibility 0s linear 120ms;
}
[data-min-menu][data-open] > .min-menu,
html:not(.cm-js) [data-min-menu]:focus-within > .min-menu {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%);
  transition: opacity 160ms var(--cm-ease-out), transform 200ms var(--cm-ease-out), visibility 0s;
}
@media (hover: hover) and (pointer: fine) {
  html:not(.cm-js) [data-min-menu]:hover > .min-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%); }
}
.min-menu__list {
  margin: 0; padding: 8px; list-style: none; min-width: 208px;
  background: #fff; border: 1px solid var(--cm-line); border-radius: 16px; box-shadow: var(--cm-shadow-3);
}
.min-menu__list > li { margin: 0; padding: 0; }
.min-menu__item {
  display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 10px;
  color: var(--cm-ink-2); font-size: 15px; font-weight: 500; text-decoration: none; white-space: nowrap;
  transition: background-color var(--cm-t-fast) ease, color var(--cm-t-fast) ease;
}
.min-menu__item[aria-current="page"] { color: var(--cm-violet-500); }
.min-menu__item:active { background: var(--cm-row-tint); }
@media (hover: hover) and (pointer: fine) { .min-menu__item:hover { background: var(--cm-row-tint); color: var(--cm-ink); } }

.min-hd__cta { display: none; flex: none; }
.min-hd__join { display: none; position: relative; flex: none; }
.min-hd__join > .min-nav__link { min-height: 44px; padding-inline: 10px; font-size: 13px; font-weight: 400; }
.min-hd__join .min-nav__caret { width: 10px; height: 10px; }
.min-hd__join .min-menu__list { min-width: 160px; }
.min-hd__join .min-menu__item { font-size: 14px; }
@media (min-width: 1024px) { .min-hd__join { display: block; } }
.min-hd__btn {
  -webkit-appearance: none; appearance: none; border: 0; background: transparent; cursor: pointer;
  display: inline-grid; place-items: center; width: 44px; height: 44px; margin-left: auto; margin-right: -10px;
  border-radius: 12px; color: var(--cm-ink); -webkit-tap-highlight-color: transparent;
  transition: background-color var(--cm-t-fast) ease, transform var(--cm-t-press) var(--cm-ease-out);
}
.min-hd__btn:active { transform: scale(0.97); background: var(--cm-fill); }
.min-hd__btn svg { grid-area: 1 / 1; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; transition: opacity var(--cm-t-fast) ease, transform var(--cm-t-fast) var(--cm-ease-out); }
.min-hd__btn .min-hd__x { opacity: 0; transform: rotate(-45deg); }
.min-hd__btn[aria-expanded="true"] .min-hd__bars { opacity: 0; transform: rotate(45deg); }
.min-hd__btn[aria-expanded="true"] .min-hd__x { opacity: 1; transform: none; }

/* 모바일 메뉴: 헤더 아래로 내려오는 흰 면. 닫혀 있어도 DOM 에 있다(상담 링크 계측 계약). */
.min-mnav {
  position: absolute; left: 0; right: 0; top: 100%;
  max-height: calc(100vh - var(--min-hd-h) - var(--min-safe-t));
  max-height: calc(100dvh - var(--min-hd-h) - var(--min-safe-t));
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  padding: 8px max(var(--cm-gutter), var(--min-safe-r)) calc(20px + var(--min-safe-b)) max(var(--cm-gutter), var(--min-safe-l));
  background: #fff; border-top: 1px solid var(--cm-line); box-shadow: 0 18px 48px rgba(23, 92, 211, 0.12);
  border-radius: 0 0 20px 20px;
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px);
  transition: opacity 120ms var(--cm-ease-out), transform 120ms var(--cm-ease-out), visibility 0s linear 120ms;
}
.min-hd[data-menu-open] .min-mnav {
  opacity: 1; visibility: visible; pointer-events: auto; transform: none;
  transition: opacity 200ms var(--cm-ease-out), transform 260ms var(--cm-ease-out), visibility 0s;
}
.min-mnav__list { margin: 0; padding: 0; list-style: none; }
.min-mnav__list > li { margin: 0; padding: 0; }
.min-mnav__link {
  display: flex; align-items: center; min-height: 56px; padding: 0 4px;
  color: var(--cm-ink); font-size: 17px; font-weight: 500; text-decoration: none;
  border-bottom: 1px solid var(--cm-line);
}
.min-mnav__link[aria-current="page"], .min-mnav__link[data-current] { color: var(--cm-violet-500); }
.min-mnav__label { margin: 0; padding: 16px 4px 8px; color: var(--cm-ink-5); font-size: 13px; font-weight: 500; }
.min-mnav__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0 0 8px; list-style: none; }
.min-mnav__chip {
  display: flex; align-items: center; min-height: 48px; padding: 0 14px; border-radius: 12px;
  background: var(--cm-fill); color: var(--cm-ink); font-size: 15px; font-weight: 500; text-decoration: none;
  transition: transform var(--cm-t-press) var(--cm-ease-out), background-color var(--cm-t-fast) ease;
}
.min-mnav__chip[aria-current="page"] { background: var(--cm-brand-tint); color: var(--cm-brand); }
.min-mnav__chip:active { transform: scale(0.97); }
.min-mnav .cm-btn { display: flex; width: 100%; margin-top: 16px; }

.min-scrim {
  position: fixed; inset: 0; z-index: var(--min-z-scrim); background: rgba(15, 18, 24, 0.28);
  opacity: 0; visibility: hidden; transition: opacity 200ms var(--cm-ease-out), visibility 0s linear 200ms;
}
.min-scrim[data-on] { opacity: 1; visibility: visible; transition: opacity 200ms var(--cm-ease-out), visibility 0s; }

@media (min-width: 1024px) {
  .min-nav { display: flex; }
  .min-hd__cta { display: inline-flex; }
  .min-hd__btn, .min-mnav, .min-scrim { display: none; }
}

/* ---- 섹션 · 제목 한 벌 --------------------------------------------------------- */
.min-sec { position: relative; isolation: isolate; padding-block: var(--min-sec-y); background: var(--cm-ground); }
.min-sec--tight { padding-block: var(--min-sec-y-tight); }
.min-sec--flush { padding-top: 0; }
/* 히어로: 빛이 반투명 헤더 뒤까지 이어지도록 헤더 높이만큼 끌어올린다 */
.min-hero {
  margin-top: calc(-1 * (var(--min-hd-h) + var(--min-safe-t)));
  padding-top: calc(var(--min-hd-h) + var(--min-safe-t) + clamp(36px, 6vw, 84px));
  padding-bottom: clamp(36px, 5vw, 72px);
  text-align: center;
}
.min-hero .min-chips { justify-content: center; margin-top: 20px; }
.min-hero .min-trust, .min-hero .min-shot { margin-top: clamp(32px, 4.5vw, 56px); }
.min-narrow { max-width: 760px; margin-inline: auto; }

.min-h1, .min-h2, .min-h3,
:where(.min-page main) :where(h1, h2, h3) {
  margin: 0; color: var(--cm-ink); font-family: var(--min-font-title); font-weight: 700; letter-spacing: var(--min-ls-h2); text-wrap: balance;
  font-synthesis: none;   /* 굵은 글꼴이 아직 안 왔을 때 가짜 굵기로 뭉개지지 않게 */
}
.min-h1, :where(.min-page main) :where(h1) { font-size: var(--min-fs-h1); line-height: 1.24; letter-spacing: var(--min-ls-h1); }
.min-h2, :where(.min-page main) :where(h2) { font-size: var(--min-fs-h2); line-height: 1.3; letter-spacing: var(--min-ls-h2); }
.min-h3, :where(.min-page main) :where(h3) { font-size: var(--min-fs-h3); line-height: 1.4; letter-spacing: var(--min-ls-h3); }
.min-sec__head { margin: 0 0 var(--min-head-gap); text-align: center; }   /* 섹션 제목 한 줄. 제목 위 라벨 · 아래 설명 문단을 두지 않는다 */

.min-nb { white-space: nowrap; }   /* 제목 안에서 끊기면 안 되는 묶음(가격 · 수치) */

/* ---- 버튼 줄 (.cm-btn 계열을 그대로 쓴다) ---------------------------------------- */
.min-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; margin-top: clamp(24px, 3vw, 36px); }
.min-actions--start { justify-content: flex-start; }
.min-actions .cm-btn { min-width: 200px; min-height: var(--cm-tap-1); }   /* 한 줄에 놓인 버튼은 높이를 맞춘다 */
.min-actions .cm-btn--weak, .min-actions .cm-btn--tint { font-size: 16px; }
.min-link {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; border-radius: 10px;
  color: var(--cm-ink-3); font-size: 15px; font-weight: 500; text-decoration: underline; text-decoration-color: var(--cm-grey-300); text-underline-offset: 4px;
  transition: color var(--cm-t-fast) ease;
}
@media (hover: hover) and (pointer: fine) { .min-link:hover { color: var(--cm-ink); } }
@media (max-width: 480px) {
  .min-actions .cm-btn { width: 100%; min-width: 0; }
}

/* ---- 칩 --------------------------------------------------------------------- */
.min-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.min-chips--center { justify-content: center; }
.min-chips > li { margin: 0; padding: 0; }
.min-chip {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px; border-radius: var(--cm-r-chip);
  background: var(--cm-fill); color: var(--cm-ink-2); font-size: 14px; font-weight: 500; line-height: 1.2; text-decoration: none; white-space: nowrap;
}
.min-chip--brand { background: var(--cm-brand-tint); color: var(--cm-brand); }
.min-chip--lg { min-height: 44px; padding: 0 18px; font-size: 16px; }
a.min-chip { min-height: 44px; transition: transform var(--cm-t-press) var(--cm-ease-out), background-color var(--cm-t-fast) ease; }
a.min-chip:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) {
  a.min-chip:hover { background: var(--cm-line-2); }
  a.min-chip--brand:hover { background: var(--cm-violet-100); }
}

/* ---- 고객 로고 띠 (느린 흐름 · 화면 밖 정지 · 감속 모드 정지) ---------------------- */
.min-trust { display: flex; align-items: center; gap: 28px; }
.min-trust > .min-logos { flex: 1; min-width: 0; }
.min-award {
  flex: none; display: inline-flex; align-items: center; gap: 12px; padding: 6px 18px 6px 6px;
  border-radius: 16px; background: #fff; border: 1px solid var(--cm-violet-100);
  color: var(--cm-ink); font-size: 14px; font-weight: 500; white-space: nowrap;
}
.min-award img { display: block; width: 84px; height: 47px; object-fit: cover; border-radius: 10px; border: 1px solid var(--cm-line); }
.min-logos {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.min-logos__track { display: flex; width: max-content; animation: min-marquee 44s linear infinite; will-change: transform; }
.min-logos__set { display: flex; align-items: center; gap: clamp(32px, 4vw, 56px); padding-right: clamp(32px, 4vw, 56px); }
.min-logo { flex: none; display: inline-flex; align-items: center; height: 44px; }
.min-logo img { display: block; width: auto; max-width: 150px; }
.min-logos[data-paused] .min-logos__track,
.min-logos:focus-within .min-logos__track { animation-play-state: paused; }
@media (hover: hover) and (pointer: fine) { .min-logos:hover .min-logos__track { animation-play-state: paused; } }
@keyframes min-marquee { to { transform: translate3d(-50%, 0, 0); } }
@media (max-width: 860px) {
  .min-trust { flex-direction: column; align-items: flex-start; gap: 14px; }
  .min-trust > .min-logos { flex: none; width: 100%; }
}
@media (max-width: 640px) {
  .min-award { font-size: 13.5px; padding: 5px 14px 5px 5px; gap: 10px; }
  .min-award img { width: 64px; height: 36px; border-radius: 8px; }
  .min-logo { height: 36px; }
  .min-logo img { max-width: 120px; }
}

/* ---- 사례 카드 (사진 + 현장 한 줄 + 업종 칩) ------------------------------------- */
.min-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cm-card-gap); margin: 0; padding: 0; list-style: none; }
.min-cases > li { margin: 0; padding: 0; display: flex; }
.min-case {
  display: flex; flex-direction: column; width: 100%; overflow: hidden;
  background: #fff; border: 1px solid var(--cm-line); border-radius: var(--cm-r-card); box-shadow: var(--cm-shadow-2);
  color: inherit; text-decoration: none;
}
.min-case__photo { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.min-case__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.min-case__body { display: flex; flex-direction: column; gap: 12px; padding: 18px 20px 20px; }
.min-case__line { margin: 0; color: var(--cm-ink); font-size: 17px; font-weight: 500; line-height: 1.45; }
.min-case__logo { display: block; width: auto; max-width: 150px; align-self: flex-start; }
@media (max-width: 860px) {
  .min-cases { grid-template-columns: minmax(0, 1fr); }
}
/* 모바일에서 세로로 쌓지 않고 옆으로 넘기는 줄 (사례 · 카드 묶음 공용) */
@media (max-width: 860px) {
  .min-rail {
    display: flex; grid-template-columns: none; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--cm-gutter)); padding: 4px var(--cm-gutter) 28px; scroll-padding-inline: var(--cm-gutter);
    -webkit-overflow-scrolling: touch;
  }
  .min-rail::-webkit-scrollbar { display: none; }
  .min-rail > * { flex: 0 0 min(78vw, 320px); scroll-snap-align: start; }
}

/* ---- 질문 접힘 ---------------------------------------------------------------- */
.min-faq { max-width: 760px; margin: 0 auto; padding: 0; list-style: none; }
.min-faq__item { border-bottom: 1px solid var(--cm-line-2); }
.min-faq__item > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 12px 4px;
  list-style: none; cursor: pointer; color: var(--cm-ink); font-size: 17px; font-weight: 500; line-height: 1.45;
  -webkit-tap-highlight-color: transparent;
}
.min-faq__item > summary::-webkit-details-marker { display: none; }
.min-faq__item > summary::after {
  content: ""; flex: none; width: 16px; height: 16px;
  background:
    linear-gradient(var(--cm-ink-4), var(--cm-ink-4)) center / 100% 2px no-repeat,
    linear-gradient(var(--cm-ink-4), var(--cm-ink-4)) center / 2px 100% no-repeat;
  transition: transform var(--cm-t-base) var(--cm-ease-out);
}
.min-faq__item[open] > summary::after { transform: rotate(45deg); }
.min-faq__a { margin: 0; padding: 0 4px 22px; color: var(--cm-ink-2); font-size: 16px; line-height: 1.6; }
@supports (interpolate-size: allow-keywords) {
  .min-faq__item { interpolate-size: allow-keywords; }
  .min-faq__item::details-content { block-size: 0; overflow: hidden; opacity: 0; transition: block-size var(--cm-t-base) var(--cm-ease-out), opacity var(--cm-t-base) var(--cm-ease-out), content-visibility var(--cm-t-base) allow-discrete; }
  .min-faq__item[open]::details-content { block-size: auto; opacity: 1; }
}

/* ---- 실캡처 틀 (테두리 + 그림자만. 가짜 폰 베젤을 그리지 않는다) -------------------- */
.min-shot {
  position: relative; margin: 0; overflow: hidden;
  background: #fff; border: 1px solid var(--cm-line-2); border-radius: 16px; box-shadow: var(--cm-shadow-3);
}
.min-shot > img, .min-shot > video, .min-shot > picture, .min-shot > picture > img { display: block; width: 100%; height: auto; }
.min-shot--phone { width: min(100%, 300px); margin-inline: auto; border-radius: 28px; }   /* 폰 화면 실캡처 */
.min-shot--photo { border: 0; border-radius: var(--cm-r-card); box-shadow: var(--cm-shadow-2); }   /* 현장 실사 */
.min-shot--clip > img { height: var(--clip, 520px); object-fit: cover; object-position: top; }   /* 긴 폰 화면은 위쪽만 보여 준다. 높이는 style="--clip:440px" */
.min-shot--bare { border: 0; border-radius: 0; box-shadow: none; background: transparent; }   /* 이미 틀이 들어 있는 캡처 */

/* ---- 상담 블록 ---------------------------------------------------------------- */
.min-cta { text-align: center; }
.min-cta .min-chips { justify-content: center; margin-top: 20px; }
.min-cta .min-faq { margin-top: var(--min-head-gap); text-align: left; }

/* ---- 따라오는 상담 독 (아래 가운데 알약) ------------------------------------------ */
.min-dock {
  position: fixed; left: 0; right: 0; bottom: calc(16px + var(--min-safe-b)); z-index: var(--min-z-dock);
  width: -moz-fit-content; width: fit-content; margin-inline: auto;
  max-width: calc(100% - 24px - var(--min-safe-l) - var(--min-safe-r));
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(16px);
  transition: opacity 160ms var(--cm-ease-out), transform 160ms var(--cm-ease-out), visibility 0s linear 160ms;
}
.min-dock[data-on] {
  opacity: 1; visibility: visible; pointer-events: auto; transform: none;
  transition: opacity var(--cm-t-rise) var(--cm-ease-out), transform var(--cm-t-rise) var(--cm-ease-out), visibility 0s;
}
.min-dock__pill {
  display: flex; align-items: center; gap: 4px; padding: 6px; border-radius: var(--cm-r-chip);
  background: rgba(255, 255, 255, 0.92); border: 1px solid var(--cm-line);
  -webkit-backdrop-filter: saturate(180%) blur(16px); backdrop-filter: saturate(180%) blur(16px);
  box-shadow: var(--cm-shadow-3);
}
.min-dock__price { padding: 0 10px 0 16px; color: var(--cm-ink); font: 700 15px/1 var(--min-font-title); letter-spacing: -0.02em; white-space: nowrap; }
.min-dock .cm-btn { min-height: 44px; padding: 0 20px; border-radius: var(--cm-r-chip); font-size: 15px; white-space: nowrap; }
.min-dock .cm-btn--weak { font-weight: 500; }
html[data-dock-off] .min-dock { opacity: 0; visibility: hidden; pointer-events: none; }   /* 시트가 열려 있을 때 등: html 에 data-dock-off 를 붙이면 독이 숨는다 */
@media (max-width: 480px) {
  .min-dock { bottom: calc(12px + var(--min-safe-b)); }
  .min-dock__price { padding: 0 6px 0 10px; font-size: 13px; }
  .min-dock .cm-btn { min-width: 0; padding: 0 12px; font-size: 13px; white-space: normal; line-height: 1.35; text-align: center; }
}
@media (max-width: 400px) {
  .min-dock__price { padding: 0 4px 0 8px; }
  .min-dock .cm-btn { padding: 0 11px; }
}
@media (max-width: 374px) {
  .min-dock__pill { gap: 2px; padding: 5px; }
  .min-dock__price { padding: 0 4px 0 6px; }
}
@media (max-width: 339px) {
  .min-dock__price { display: none; }
}

/* ---- 푸터 -------------------------------------------------------------------- */
.min-ft { padding: 36px 0 calc(36px + var(--min-safe-b)); background: #fff; border-top: 1px solid var(--cm-line); }
.min-ft__links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 4px; margin: 0; padding: 0; list-style: none; }
.min-ft__links + .min-ft__links { margin-top: 2px; }
.min-ft__links > li { margin: 0; padding: 0; }
.min-ft__links a {
  display: inline-flex; align-items: center; min-height: 36px; padding: 0 8px; border-radius: 8px;
  color: var(--cm-ink-4); font-size: 13px; font-weight: 500; text-decoration: none; white-space: nowrap;
  transition: color var(--cm-t-fast) ease;
}
.min-ft__links a[aria-current="page"] { color: var(--cm-ink); }
.min-ft__links--more a { color: var(--cm-ink-4); font-weight: 400; }
@media (hover: hover) and (pointer: fine) { .min-ft__links a:hover { color: var(--cm-ink); } }
.min-ft__legal { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--cm-line); }
.min-ft__legal .min-ft__links a { font-size: 12.5px; }
.min-ft__biz { margin: 8px 0 0; color: var(--cm-ink-4); font-size: 12px; line-height: 1.7; text-align: center; }
@media (max-width: 640px) {
  .min-ft__links a { min-height: 40px; }
}

/* ---- 감속 · 투명도 · 대비 설정 --------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .min-logos__track { animation: none; }
  .min-logos { overflow-x: auto; scrollbar-width: none; }
  .min-menu, [data-min-menu][data-open] > .min-menu { transform: translateX(-50%); transition: opacity 120ms ease, visibility 0s; }
  .min-mnav, .min-hd[data-menu-open] .min-mnav { transform: none; transition: opacity 120ms ease, visibility 0s; }
  .min-dock, .min-dock[data-on] { transform: none; transition: opacity 160ms ease, visibility 0s; }
  .min-skip, .min-nav__caret, .min-hd__btn svg, .min-faq__item > summary::after { transition: none; }
  .min-hd__btn:active, .min-mnav__chip:active, a.min-chip:active { transform: none; }
  .min-faq__item::details-content { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .min-dock__pill { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  .min-menu__list, .min-case, .min-shot, .min-dock__pill, .min-award { border-color: var(--cm-grey-500); box-shadow: none; }
  .min-nav__link, .min-ft__links a, .min-ft__biz { color: var(--cm-ink-2); }
}
@media print {
  .min-hd, .min-dock, .min-skip, .min-scrim { display: none; }
}

/* ---- 메뉴 2차 (2026-10-01 밤): 묶음 머리글 + 넓은 판(세 칸) ------------------------
   쓰는 곳: header-b(전체 제품) · header-c(제품). header-a 는 위의 보통 드롭다운 3개를 그대로 쓴다.
   넓은 판은 누른 버튼이 아니라 헤더 가운데에 붙는다. 그래서 어느 폭에서도 화면 밖으로 나가지 않는다. */
.min-nav > li[data-min-menu="wide"] { position: static; }
.min-menu--wide {
  top: calc(100% - 10px); padding-top: 18px;   /* 버튼 아래 10px 빈 자리까지 판이 덮는다(호버가 끊기지 않게) */
  width: max-content; max-width: calc(100vw - 32px);
}
.min-menu__panel {
  display: grid; grid-template-columns: repeat(3, minmax(204px, auto)); gap: 4px; padding: 12px;
  background: #fff; border: 1px solid var(--cm-line); border-radius: 20px; box-shadow: var(--cm-shadow-3);
  max-height: calc(100vh - var(--min-hd-h) - var(--min-safe-t) - 24px); overflow-y: auto; overscroll-behavior: contain;
}
.min-menu__col { min-width: 0; }
.min-menu__label {   /* 묶음 머리글: 솔루션 · 안전 장비 · 위탁·교육. 단어만, 캡션 없음 */
  margin: 0; padding: 8px 14px 6px; color: var(--cm-ink-4); font-size: 13px; font-weight: 500; line-height: 1.4; white-space: nowrap;
}
.min-menu__group { margin: 0; padding: 0; list-style: none; }
.min-menu__group > li { margin: 0; padding: 0; }

/* 모바일 메뉴: 묶음 머리글은 읽히는 회색으로, 긴 이름은 띄어쓰기에서 두 줄까지 */
.min-mnav__label { color: var(--cm-ink-4); }
.min-mnav__chip { padding-block: 6px; line-height: 1.25; word-break: keep-all; }
.min-mnav__list--end { margin-top: 4px; border-top: 1px solid var(--cm-line); }

@media (prefers-contrast: more) {
  .min-menu__panel { border-color: var(--cm-grey-500); box-shadow: none; }
  .min-menu__label, .min-mnav__label { color: var(--cm-ink-2); }
}
/* 보통 드롭다운도 넓은 판과 같은 높이(헤더 아래 8px)에서 열린다. 버튼과 판 사이 빈 자리는 판의 위 여백이 덮는다 */
.min-menu { padding-top: 18px; }

/* 영상 그리기판(2026-10-02): video[data-inview] 는 그리지 않고 같은 자리의 canvas 에 프레임을 옮겨 그린다. min.js 끝 참고 */
.min-vcanvas { position: absolute; display: block; pointer-events: none; }

/* ---- 메뉴 3차 (2026-10-02, 확정판): 드롭다운 3개 + 바로 가는 링크 2개 --------------------
   데스크톱은 위의 보통 드롭다운(.min-menu__list)과 최상위 링크(.min-nav__link)를 그대로 쓴다. 넓은 판 규칙은 남겨 두되 헤더에서는 쓰지 않는다.
   모바일은 최상위 다섯 이름이 같은 글자 크기로 한 줄씩 선다. 묶음(안전솔루션 · MSDS · 위탁·교육)은 이름 아래 2칸 목록,
   바로 가는 링크(안전장비 · 기업사례)는 이름 줄 전체가 링크이고 오른쪽 끝에 꺾쇠 그림이 붙는다. */
.min-mnav { padding-top: 4px; }
.min-mnav__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 0; min-height: 52px; padding: 6px 4px 0;
  color: var(--cm-ink); font-size: 16px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em; text-decoration: none;
}
.min-mnav__grid + .min-mnav__head,
.min-mnav__head + .min-mnav__head { margin-top: 6px; border-top: 1px solid var(--cm-line); }
.min-mnav__grid { padding-bottom: 10px; }
.min-mnav__head--go { padding-top: 0; -webkit-tap-highlight-color: transparent; border-radius: 0; transition: color var(--cm-t-fast) ease; }
.min-mnav__head--go:active { color: var(--cm-violet-500); }
.min-mnav__head--go[aria-current="page"], .min-mnav__head--go[data-current] { color: var(--cm-violet-500); }
.min-mnav__go { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: 0.45; }
.min-mnav__head--go + .cm-btn { margin-top: 10px; }

/* 헤더 상담 버튼 · 로고: Pretendard 에 맞춘 자간 */
.min-hd__logo { letter-spacing: -0.03em; }
.min-page .cm-btn { letter-spacing: -0.01em; }

/* 푸터: 첫 줄은 헤더 메뉴와 같은 이름 · 같은 순서, 둘째 줄은 메뉴에서 빠진 장비 쪽, 셋째 줄은 회사 · 바깥 링크 */
.min-ft__links[data-ft-row="menu"] a { color: var(--cm-ink-3); }
.min-ft__links[data-ft-row="menu"] a[aria-current="page"] { color: var(--cm-ink); }

@media (prefers-contrast: more) {
  .min-mnav__go { opacity: 1; }
}

/* ---- 메뉴 4차 (2026-10-02): 안전장비도 드롭다운 (점검 인터락 · AI CCTV · 지게차 안전장치) --------
   데스크톱은 보통 드롭다운(.min-menu__list) 그대로. 모바일은 '안전장비'가 바로 가는 줄에서 묶음(이름 + 2칸 목록)으로 바뀌었다.
   안전장비 쪽(hw)에서는 묶음 이름 줄이 켜진다(안의 두 항목은 같은 쪽의 해시라서 따로 켜지 않는다). */
.min-mnav__head[data-current] { color: var(--cm-violet-500); }

/* Confirmed credentials: award, venture status and credit guarantee support. */
.min-ft__credentials {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  max-width: 820px;
  margin: 0 auto 28px;
  padding: 0 0 28px;
  border-bottom: 1px solid var(--cm-line, #e8eaed);
  list-style: none;
}
.min-ft__credentials > li { margin: 0; padding: 0; }
.min-ft__credential {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  height: 100%;
  color: #565e6b;
  text-decoration: none;
  border-radius: 4px;
}
.min-ft__credential:focus-visible { outline: 2px solid #3156b8; outline-offset: 5px; }
.min-ft__credential-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 64px;
  width: 190px;
  height: 64px;
  overflow: hidden;
}
.min-ft__credential-logo img { display: block; width: auto; height: auto; max-width: 170px; max-height: 52px; }
/* The official signature preview includes white margins; preserve the artwork and its proportions. */
.min-ft__credential-logo--venture img { flex: 0 0 auto; width: 236px; max-width: none; max-height: none; }
.min-ft__credential-copy { font-size: 12px; font-weight: 500; line-height: 1.6; text-align: center; word-break: keep-all; }
@media (max-width: 600px) {
  .min-ft__credentials { grid-template-columns: 1fr; gap: 12px; max-width: 340px; padding-bottom: 24px; margin-bottom: 20px; }
  .min-ft__credential { flex-direction: row; justify-content: center; gap: 18px; }
  .min-ft__credential-logo { flex: 0 0 150px; width: 150px; height: 56px; }
  .min-ft__credential-logo img { max-width: 142px; max-height: 46px; }
  .min-ft__credential-logo--venture img { width: 218px; max-width: none; max-height: none; }
  .min-ft__credential-copy { flex: 0 1 150px; text-align: left; font-size: 11.5px; }
}