/* 20-flow.css — 2번 방문자 흐름/정보구조: 모바일 메뉴(.mnav*) + 문의 페이지(.f-contact/.f-prep/.f-proc/.f-tl/.f-org) */

/* ── 모바일 메뉴: 열자마자 '도입 문의'가 맨 위, 닫힌 패널은 레이아웃 제외, 배경 스크롤 잠금 ── */
@media (max-width:1024px){
  .mnav summary{width:44px;height:44px;margin-right:-10px}
  .mnav:not([open]) .mnav-p{display:none}
  html:has(.mnav[open]){overflow:hidden}
  .mnav-p{display:flex;flex-direction:column;overscroll-behavior:contain;padding-top:16px}
  .mnav-p .btn{order:-1;margin:0 0 8px;min-height:52px;align-items:center;justify-content:center;font-size:16px}
  .mnav-p .btn::after{content:"→"}
  .mnav-p p{font-size:13.5px;font-weight:700;letter-spacing:.02em;color:var(--red-t)}
  .mnav-p li a{min-height:44px}
}

/* ── 문의 히어로: 좌 텍스트·핵심 정보 / 우 파일럿 수조 사진 ── */
.f-contact .hero-img img{aspect-ratio:4/3;object-position:50% 50%}
.f-contact .hero-img+.facts b{white-space:nowrap}

/* 01 준비 정보: 표를 히어로 바로 아래 전폭으로 */
.f-prep .sec-h .sec-d{color:var(--t2)}

/* 02 도입 절차: 제목 아래 선은 타임라인 선이 대신 */
.sec.wide.f-proc .sec-h{border-bottom:0;padding-bottom:0;margin-bottom:40px}
/* 데스크톱 가로 타임라인, 중간 폭 3x2, ≤760 기존 세로 목록 */
@media (min-width:761px){
  ol.f-tl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gut);border-top:0}
  ol.f-tl li{padding:0 0 28px;border-bottom:0;border-top:2px solid var(--ink)}
  ol.f-tl li::before{position:static;display:block;font-size:28px;padding:16px 0 10px}
  ol.f-tl li:nth-child(n+4){margin-top:24px}
  ol.f-tl li h3{font-size:18px;line-height:1.4;margin-bottom:8px}
  ol.f-tl li p{font-size:15.5px;line-height:1.7;color:var(--t2)}
}
@media (min-width:1200px){
  ol.f-tl{grid-template-columns:repeat(6,minmax(0,1fr))}
  ol.f-tl li:nth-child(n+4){margin-top:0}
  ol.f-tl li{position:relative}
  ol.f-tl li:not(:last-child)::after{content:"";position:absolute;right:calc(var(--gut) / -2 - 5px);top:-6px;width:10px;height:10px;background:var(--red);border-radius:50%}
}

/* 사업자 정보 */
.f-org{margin-top:56px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gut);border-top:1px solid var(--ink)}
.f-org div{padding:16px 0;border-bottom:1px solid var(--line)}
.f-org dt{font-size:13.5px;font-weight:600;color:var(--t4);margin-bottom:4px}
.f-org dd{font-size:16px;font-weight:600;color:var(--ink);word-break:keep-all}
.f-org a{color:inherit;text-decoration:underline;text-underline-offset:3px}
@media (max-width:1024px){.f-org{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.f-org{grid-template-columns:1fr;margin-top:40px}.f-org div{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:12px;padding:12px 0}.f-org dt{margin:0;padding-top:2px}}

/* ≤760: 와이드 제목 아래 이중선·과한 공백 제거 (문의 페이지 범위) */
@media (max-width:760px){
  .f-prep .sec-h{padding-bottom:28px;margin-bottom:28px}
}

/* ≤760: 표 안 이동 링크 터치 영역 44px (공용 .data 표 — 문의·기술 상세 공통) */
@media (max-width:760px){
  .data td a{display:inline-block;padding:10px 0;margin:-10px 0;min-height:44px;box-sizing:border-box;vertical-align:top}
}

/* 데스크톱: 표 안 이동 링크 높이 24px 이상 (WCAG 2.5.8) */
@media (min-width:761px){
  .data td a{display:inline-block;padding:3px 0;margin:-3px 0;vertical-align:top}
}
