/* ===== 디자인엘 — 기본 ===== */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
html.snap { scroll-snap-type:y mandatory; }
body { font-family:var(--font-body,'Pretendard'),'Malgun Gothic','맑은 고딕','Apple SD Gothic Neo',-apple-system,sans-serif;
  color:#111; background:#fff; -webkit-font-smoothing:antialiased; line-height:1.5; }
/* 제목: 선택 폰트(기본 고딕) */
.hero-en, .sec-title, .contact-title, .board-head h1 {
  font-family:var(--font-head,'Pretendard'),'Malgun Gothic','맑은 고딕','Apple SD Gothic Neo',sans-serif;
  font-weight:800; letter-spacing:-.5px; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
body:not(.snap) { padding-top:70px; }

/* ===== 헤더 GNB ===== */
.gnb { position:fixed; top:0; left:0; width:100%; height:70px; z-index:100;
  transition:background .3s, box-shadow .3s; }
.gnb-inner { max-width:1400px; margin:0 auto; height:100%; padding:0 40px;
  display:flex; align-items:center; justify-content:space-between; }
.logo img { height:46px; width:auto; }
.logo .logo-d { display:none; }
.menu { display:flex; gap:44px; }
.menu a { color:#fff; font-size:16px; font-weight:500; letter-spacing:-.3px; transition:opacity .2s; }
.menu a:hover { opacity:.65; }
/* 스크롤/서브페이지: 흰 헤더 */
.gnb.scrolled, body:not(.snap) .gnb { background:#fff; box-shadow:0 1px 12px rgba(0,0,0,.07); }
.gnb.scrolled .logo-w, body:not(.snap) .logo-w { display:none; }
.gnb.scrolled .logo-d, body:not(.snap) .logo-d { display:block; }
.gnb.scrolled .menu a, body:not(.snap) .menu a { color:#222; }

/* 햄버거 */
.menu-toggle { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.menu-toggle span { width:26px; height:2px; background:#fff; transition:.3s; }
.gnb.scrolled .menu-toggle span, body:not(.snap) .menu-toggle span { background:#222; }

/* ===== 섹션 공통 ===== */
.page { width:100%; min-height:100vh; scroll-snap-align:start; position:relative; }

/* ===== #page1 히어로 ===== */
.hero { display:flex; align-items:flex-end; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; background-size:cover; background-position:center;
  animation:kenburns 9s ease-out both; will-change:transform; }
@keyframes kenburns { from { transform:scale(1.02); } to { transform:scale(1.14); } }
.hero-overlay { position:absolute; inset:0; z-index:1;
  background:linear-gradient(to bottom, rgba(0,0,0,.2) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.58) 100%); }
.hero-text { position:relative; z-index:2; padding:0 6% 14vh; color:#fff; }
.hero-en { font-size:clamp(36px,6vw,74px); font-weight:800; letter-spacing:1px; line-height:1.05;
  animation:heroUp 1.1s .25s cubic-bezier(.2,.7,.2,1) both; }
.hero-sub { margin-top:20px; font-size:clamp(14px,1.4vw,18px); font-weight:300; opacity:.92; letter-spacing:.2px;
  animation:heroUp 1.1s .5s cubic-bezier(.2,.7,.2,1) both; }
@keyframes heroUp { from { opacity:0; transform:translateY(34px); } to { opacity:1; transform:translateY(0); } }

/* ===== #page2 소개 ===== */
.intro { display:flex; align-items:center; justify-content:center; background:#fff; }
.intro-inner { max-width:1060px; width:100%; padding:120px 24px;
  display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:center; }
.intro-photo img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:8px; box-shadow:0 14px 36px rgba(0,0,0,.13); }
.sec-label { display:inline-block; font-size:13px; font-weight:600; letter-spacing:4px; color:#b3a18c; }
.sec-title { font-size:clamp(26px,3.4vw,36px); font-weight:700; margin:14px 0 28px; color:#1a1a1a; }
.intro-body { font-size:15.5px; line-height:2; color:#555; }

/* ===== #page3 오시는길 ===== */
.location { display:flex; align-items:center; justify-content:center; background:#faf9f7; }
.loc-inner { max-width:1100px; width:100%; padding:130px 24px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
.loc-map { aspect-ratio:4/3; background:#ececec; border-radius:8px; overflow:hidden;
  display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(0,0,0,.06); }
.loc-map iframe, .loc-map .root_daum_roughmap, .loc-map img.full { width:100%!important; height:100%!important; object-fit:cover; }
.map-fallback { text-align:center; color:#888; padding:30px; }
.map-pin { width:46px; margin:0 auto 14px; opacity:.7; }
.map-place { font-size:18px; font-weight:700; color:#444; }
.map-addr { font-size:14px; margin:6px 0 16px; }
.map-link { font-size:13px; color:#a0744b; font-weight:600; }
.contact-title { font-size:clamp(28px,3.2vw,35px); font-weight:700; margin-bottom:26px; }
.contact-list li { font-size:15px; color:#333; padding:10px 0; border-bottom:1px solid #ececec; }
.contact-list .tit { display:inline-block; min-width:80px; font-size:13px; font-weight:700; color:#222; letter-spacing:-1px; }
.contact-tel { display:block; font-size:clamp(24px,3vw,30px); font-weight:800; margin:26px 0 18px; color:#111; }
.contact-map-btn { display:inline-block; padding:12px 28px; border:1px solid #333; border-radius:30px;
  font-size:14px; font-weight:500; transition:.2s; }
.contact-map-btn:hover { background:#222; color:#fff; }

/* ===== 푸터 ===== */
.site-footer { background:#f2f1ef; padding:36px 24px; text-align:center; scroll-snap-align:start; }
.foot-info { font-size:13px; color:#666; display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; }
.foot-info i { color:#ccc; font-style:normal; }
.foot-copy { margin-top:12px; font-size:12px; color:#9a9a9a; letter-spacing:1px; }

/* ===== 플로팅 SNS + TOP ===== */
.floating-sns { position:fixed; right:24px; bottom:30px; z-index:90; }
.floating-sns ul { display:flex; flex-direction:column; gap:10px; }
.floating-sns img { width:46px; height:46px; border-radius:50%; box-shadow:0 2px 10px rgba(0,0,0,.18); transition:transform .2s; }
.floating-sns img:hover { transform:scale(1.12); }
.top-btn { margin-top:14px; width:46px; height:46px; border-radius:50%; border:none; background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.18); font-size:11px; font-weight:800; color:#333; cursor:pointer;
  opacity:0; visibility:hidden; transition:opacity .25s ease, visibility .25s ease; }
.top-btn.show { opacity:1; visibility:visible; }

/* ===== dot 네비 ===== */
.dot-nav { position:fixed; right:32px; top:50%; transform:translateY(-50%); z-index:80;
  display:flex; flex-direction:column; gap:15px; }
.dot-nav a span { display:block; width:10px; height:10px; border-radius:50%;
  background:rgba(140,140,140,.45); border:1px solid rgba(160,160,160,.7); transition:.3s; }
.dot-nav a.active span { background:#222; border-color:#222; transform:scale(1.35); }

/* ===== 게시판 공통 ===== */
.board-wrap { max-width:1100px; margin:0 auto; padding:60px 24px 100px; min-height:60vh; }
.board-head { padding-bottom:22px; margin-bottom:36px; border-bottom:2px solid #1a1a1a; }
.board-head h1 { font-size:30px; font-weight:800; }
.board-head .b-sub { margin-top:10px; font-size:15px; color:#888; }
.b-meta, .b-view-meta { font-size:13px; color:#999; margin-top:8px; }
.b-empty { text-align:center; color:#999; padding:60px 0; }

/* 갤러리 그리드 */
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.gallery-card { display:block; }
.gallery-card .thumb { width:100%; aspect-ratio:1/1; background:#eee center/cover no-repeat; border-radius:6px; transition:transform .3s; }
.gallery-card:hover .thumb { transform:translateY(-4px); box-shadow:0 10px 24px rgba(0,0,0,.12); }
.gallery-card .g-title { margin-top:14px; font-size:16px; font-weight:600; text-align:center; color:#333; }

/* 갤러리 상세 */
.gallery-view { display:flex; flex-direction:column; gap:36px; }
.g-figure { margin:0; }
.g-figure img { width:100%; border-radius:6px; display:block; }
.g-caption { margin-top:16px; font-size:15px; line-height:1.85; color:#555; text-align:center; padding:0 6%; }
.b-content { margin:30px 0; font-size:16px; line-height:1.9; color:#444; white-space:normal; }
.b-content img { max-width:100%; border-radius:6px; margin:18px auto; display:block; }
.b-content p { margin:0 0 14px; }
.b-content p:last-child { margin-bottom:0; }
.b-content h3 { font-size:20px; font-weight:700; margin:24px 0 12px; color:#222; }

/* 견적문의 테이블 */
.b-toolbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.b-total { font-size:14px; color:#666; }
.b-table { width:100%; border-collapse:collapse; font-size:15px; }
.b-table th { padding:14px 8px; border-bottom:1px solid #ddd; color:#555; font-weight:600; font-size:14px; background:#fafafa; }
.b-table td { padding:16px 8px; border-bottom:1px solid #eee; text-align:center; color:#444; }
.b-table .c-title { text-align:left; }
.b-table .c-title a:hover { color:#a0744b; }
.b-table .c-no { width:80px; color:#999; }
.b-table .c-name { width:120px; }
.b-table .c-date { width:120px; color:#999; }
.b-table .lock { color:#b0905f; }

/* 폼 */
.b-form { display:flex; flex-direction:column; gap:18px; max-width:620px; }
.b-form label { display:flex; flex-direction:column; gap:7px; font-size:14px; font-weight:600; color:#444; }
.b-form input, .b-form textarea { font-family:inherit; font-size:15px; padding:12px 14px; border:1px solid #d5d5d5; border-radius:6px; }
.b-form input:focus, .b-form textarea:focus { outline:none; border-color:#a0744b; }
.b-form textarea { resize:vertical; }

/* 버튼 */
.b-actions { margin-top:30px; display:flex; gap:10px; }
.b-btn { display:inline-block; padding:12px 28px; border:1px solid #333; border-radius:30px; font-size:14px; font-weight:500; cursor:pointer; background:#fff; transition:.2s; }
.b-btn:hover { background:#f3f3f3; }
.b-btn.primary { background:#1a1a1a; color:#fff; border-color:#1a1a1a; }
.b-btn.primary:hover { background:#000; }

/* 비밀글 잠금 */
.b-lock { text-align:center; padding:40px 0; }
.lock-ico { font-size:18px; color:#888; margin-bottom:20px; }
.b-pwform { display:flex; gap:8px; justify-content:center; }
.b-pwform input { padding:11px 14px; border:1px solid #d5d5d5; border-radius:6px; font-size:15px; }
.b-error { color:#d33; font-size:14px; margin-top:12px; }
.b-lock .b-actions { justify-content:center; }
.b-view-meta .b-phone { color:#a0744b; font-weight:600; }

/* 견적문의 설문 폼 */
.quote-form { max-width:680px; }
.q-field { margin-bottom:28px; }
.q-label { display:block; font-size:15px; font-weight:600; color:#333; margin-bottom:10px; }
.q-label.req::after { content:' *'; color:#d9534f; }
.q-desc { font-size:13px; color:#777; margin:0 0 12px; line-height:1.65; background:#f7f6f4; padding:12px 14px; border-radius:7px; }
.quote-form input[type=text], .quote-form input[type=password], .quote-form textarea {
  width:100%; padding:12px 14px; border:1px solid #d5d5d5; border-radius:7px; font-size:15px; font-family:inherit; }
.quote-form input:focus, .quote-form textarea:focus { outline:none; border-color:#a0744b; }
.quote-form textarea { resize:vertical; }
.q-radios { display:flex; flex-direction:column; gap:11px; }
.q-radios label { display:flex; align-items:center; gap:9px; font-size:15px; color:#444; cursor:pointer; font-weight:400; }
.q-radios input[type=radio] { width:17px; height:17px; accent-color:#a0744b; flex-shrink:0; }

@media (max-width:760px) {
  .gallery-grid { grid-template-columns:repeat(2,1fr); gap:14px; }
  .b-table .c-name { display:none; }
}

/* ===== 검수용 평면 보기(preview=flat) ===== */
html.preview { scroll-snap-type:none; }
.preview .page { min-height:auto; }
.preview .hero { height:480px; }
.preview .intro-inner { padding:80px 24px; }
.preview .loc-inner { padding:80px 24px; }

/* ===== 반응형 ===== */
@media (max-width:860px) {
  html.snap { scroll-snap-type:none; }
  .gnb-inner { padding:0 20px; }
  .menu-toggle { display:flex; }
  .menu { position:fixed; top:70px; left:0; width:100%; background:#fff; flex-direction:column;
    gap:0; padding:8px 0; transform:translateY(-130%); transition:transform .3s; box-shadow:0 8px 20px rgba(0,0,0,.1); }
  .menu.open { transform:translateY(0); }
  .menu a { color:#222!important; padding:15px 24px; font-size:16px; }
  .dot-nav { display:none; }
  .loc-inner { grid-template-columns:1fr; gap:34px; padding:100px 22px; }
  .intro-inner { grid-template-columns:1fr; gap:28px; padding:90px 22px; }
  .intro-photo { max-width:320px; margin:0 auto; }
  .hero-text { padding:0 7% 12vh; }
  .floating-sns ul { display:none; }       /* 모바일: SNS 아이콘 숨김(거슬림 방지) */
  .floating-sns { right:14px; bottom:16px; }
  .top-btn { width:42px; height:42px; margin-top:0; }
}
