/* 범표집수리 — 볼라드설치 v6 랜딩페이지 스타일시트 */

*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
}

a { transition: opacity .2s, color .2s, background-color .2s; }
a:hover { opacity: .85; }

details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }
details > summary::before {
  content: '';
}

.consult-btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 16px 24px; border-radius: 9999px; font-size: 17px; font-weight: 700;
  cursor: pointer; border: none;
}
.consult-btn-tel { background: var(--accent, #EA580C); color: #fff; }
.consult-btn-sms { background: #fff; color: var(--accent, #EA580C); border: 2px solid var(--accent, #EA580C); }

/* 헤더 스크롤 시 그림자 강화는 header.php 인라인 style 로 처리 */

@media (max-width: 860px) {
  .nav-desktop-only { display: none !important; }
}

/* 카드 hover */
main a[href^="/"]:hover { box-shadow: 0 6px 20px rgba(0,0,0,.06); }

/* 카드 그리드 — PC 3열 / 모바일 2열 고정 (auto-fit/auto-fill 금지) */
.grid-3-2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 760px) {
  .grid-3-2 { grid-template-columns: repeat(2, 1fr); gap: 12px; }
}

/* 카드 그리드 — PC 2열 / 모바일 1열 고정 (auto-fit/auto-fill 금지) */
.grid-2-1 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
@media (max-width: 760px) {
  .grid-2-1 { grid-template-columns: repeat(1, 1fr); gap: 16px; }
}

/* 시공사진 갤러리 카드 (라이트박스 트리거, 단일사진) */
.gallery-photo-btn { all: unset; cursor: zoom-in; display: block; width: 100%; border-radius: 16px; overflow: hidden; aspect-ratio: 4/3; }
.gallery-photo-btn img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.gallery-photo-btn:hover img { transform: scale(1.04); }

/* 라이트박스 오버레이 (단일사진) */
.lightbox-overlay { position: fixed; inset: 0; z-index: 2000; background: rgba(28,25,23,.88); display: flex; align-items: center; justify-content: center; padding: 24px; overflow-y: auto; }
.lightbox-overlay[hidden] { display: none; }
.lightbox-close { position: absolute; top: 20px; right: 20px; width: 44px; height: 44px; border-radius: 50%; background: rgba(28,25,23,.55); color: #fff; border: none; font-size: 22px; line-height: 1; cursor: pointer; z-index: 2; }

.lightbox-panel { max-width: 680px; width: 100%; max-height: 90vh; overflow-y: auto; background: #fff; border-radius: 16px; padding: 24px; padding-top: 64px; }
.lightbox-single-image { margin-bottom: 16px; }
.lightbox-single-image img { width: 100%; border-radius: 12px; object-fit: cover; aspect-ratio: 4/3; display: block; }
.lightbox-title { font-size: 19px; font-weight: 800; color: #1C1917; margin: 0; }