/* 부산 리모델링 — 레퍼런스: bonsigdvd.memorycordkorea.com (흰 바탕 · 검정 그로테스크 · ■ 라벨 · 풀블리드 사진) */
:root{--k:#0b0b0b;--g:#777;--l:#e4e4e4;--pad:clamp(20px,2.8vw,40px)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:var(--k);background:#fff;font-size:17px;line-height:1.65;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;word-break:keep-all}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
.w{padding:0 var(--pad);max-width:1600px;margin:0 auto}
:focus-visible{outline:2px solid var(--k);outline-offset:3px}

/* 헤더 */
.hd{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px var(--pad);background:rgba(255,255,255,.92);backdrop-filter:blur(8px)}
.logo{font-size:clamp(22px,2vw,30px);font-weight:700;letter-spacing:-.045em;line-height:1;display:flex;align-items:baseline;gap:8px}
.logo small{font-size:13px;font-weight:500;color:var(--g);letter-spacing:0}
.hd nav{display:flex;gap:clamp(16px,2.4vw,36px);font-size:clamp(15px,1.4vw,19px)}
.hd nav a{position:relative;white-space:nowrap}
.hd nav a[aria-current]::after,.hd nav a:hover::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor}
.hd nav .go::before,h2::before,.hero h1::before{content:"";display:inline-block;width:.42em;height:.42em;background:var(--k);margin-right:.45em;vertical-align:.12em}

/* 히어로 */
.hero .w{padding-top:clamp(48px,9vh,120px);padding-bottom:clamp(28px,4vw,48px)}
.hero h1{font-size:clamp(18px,1.6vw,22px);font-weight:600}
.hero .en{font-size:clamp(52px,11vw,190px);font-weight:700;letter-spacing:-.055em;line-height:.92;margin:.1em 0 .25em}
.consult h1{font-size:clamp(44px,7.5vw,130px);letter-spacing:-.05em;line-height:1;margin-bottom:.4em}
.consult h1::before{display:none}
.answer{max-width:860px;font-size:clamp(17px,1.5vw,21px);line-height:1.7}
.answer strong{font-weight:700;box-shadow:inset 0 -.4em 0 #f1f1f1}
.btn{display:inline-block;margin-top:28px;padding:14px 28px;background:var(--k);color:#fff;font-weight:600;border-radius:999px}
.reel{position:relative}
.reel img{width:100%;max-height:86vh;object-fit:cover}
.reel figcaption{position:absolute;right:var(--pad);bottom:16px;color:#fff;font-size:13px;text-shadow:0 1px 4px rgba(0,0,0,.5)}

/* 섹션 공통 */
.rows{padding:clamp(64px,9vw,130px) 0;border-top:1px solid var(--l)}
.head{display:grid;grid-template-columns:1fr 1.4fr;gap:16px 60px;margin-bottom:clamp(28px,4vw,52px)}
h2{font-size:clamp(24px,2.4vw,36px);font-weight:700;letter-spacing:-.035em;line-height:1.3}
.head p,.note{color:#444}
.split,.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.split p{margin:20px 0 28px;color:#333}
figcaption{font-size:13px;color:var(--g);margin-top:8px}
.check li{display:flex;gap:16px;padding:14px 0;border-top:1px solid var(--l)}
.check b{min-width:96px}
.check span{color:#444}

/* 표 */
table{width:100%;border-collapse:collapse;font-size:16px}
caption{text-align:left;color:var(--g);font-size:14px;padding-bottom:12px}
th,td{text-align:left;padding:18px 12px;border-top:1px solid var(--l)}
thead th{font-size:13px;color:var(--g);font-weight:500;border-top:2px solid var(--k)}
tbody th{font-weight:600}
.price b{font-size:clamp(18px,1.8vw,24px);letter-spacing:-.02em}
.plist{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--l);border:1px solid var(--l);margin-top:36px}
.plist li{background:#fff;padding:22px;display:flex;flex-direction:column;gap:6px}
.plist span{font-size:14px;color:#555}
.plist b{font-size:20px}

/* 절차 */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--l);border:1px solid var(--l)}
.steps li{background:#fff;padding:28px}
.steps .n{font-size:13px;color:var(--g)}
.steps h3{font-size:20px;margin:6px 0 8px}
.steps p{color:#444;font-size:15px}
.steps small{display:inline-block;margin-top:12px;font-size:13px;padding:3px 10px;border:1px solid var(--k);border-radius:999px}

/* 시공사례 */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,20px)}
.gallery img{aspect-ratio:4/5;object-fit:cover;width:100%}

/* 지역 */
.areas{display:flex;flex-wrap:wrap;gap:10px}
.areas li{padding:8px 18px;border:1px solid var(--l);border-radius:999px}

/* FAQ */
.faq details{border-top:1px solid var(--l)}
.faq details:last-child{border-bottom:1px solid var(--l)}
.faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:18px;font-size:26px;font-weight:300}
.faq details[open] summary::after{content:"−"}
.faq h3{font-size:clamp(17px,1.5vw,20px);font-weight:600}
.faq p{padding:0 0 24px;max-width:900px;color:#333}

/* 상담 */
.ch{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--l);border:1px solid var(--l);margin-top:40px}
.ch a{display:flex;flex-direction:column;gap:8px;padding:clamp(24px,3vw,44px);background:#fff;transition:background .2s,color .2s}
.ch a:hover{background:var(--k);color:#fff}
.ch small{font-size:13px;color:var(--g)}
.ch b{font-size:clamp(26px,3vw,44px);letter-spacing:-.04em}
.msg{background:#f5f5f5;padding:28px;font:inherit;white-space:pre-wrap;line-height:1.9}

/* CTA */
.cta{background:var(--k);color:#fff;padding:clamp(72px,10vw,150px) 0}
.cta-q{font-size:clamp(26px,3.6vw,54px);font-weight:700;letter-spacing:-.04em;line-height:1.3}
.cta-q a{border-bottom:2px solid #fff}

/* 푸터 */
.ft{padding:60px 0 100px;border-top:1px solid var(--l)}
.ft-mark{font-size:clamp(60px,14vw,240px);font-weight:700;letter-spacing:-.06em;line-height:.85;margin-bottom:40px}
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;font-size:14px;color:#444}
.ft-nav{display:flex;flex-direction:column;gap:6px}
.upd{text-align:right}
.fab{position:fixed;right:20px;bottom:20px;z-index:60;padding:14px 24px;background:var(--k);color:#fff;font-weight:600;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.2)}

@media (max-width:900px){
  .head,.split,.two,.ch,.ft-grid{grid-template-columns:1fr}
  .plist,.gallery{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr}
  .upd{text-align:left}
  .logo small{display:none}
  table{font-size:15px}
  th,td{padding:14px 8px}
}

/* 함께 보면 좋은 페이지 */
.guide{border-top:1px solid var(--k)}
.guide a{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;border-bottom:1px solid var(--l);font-size:clamp(19px,1.8vw,26px);font-weight:600;letter-spacing:-.03em}
.guide small{display:block;font-size:14px;font-weight:400;color:var(--g);letter-spacing:0;margin-top:4px}
.guide a:hover i{transform:translateX(6px)}
.guide i{font-style:normal;transition:transform .2s}
.grid caption{font-size:14px}
@media (max-width:900px){
  .hd{flex-wrap:wrap;gap:10px}
  .hd nav{width:100%;overflow-x:auto;gap:18px;padding-bottom:4px;scrollbar-width:none}
  .hd nav::-webkit-scrollbar{display:none}
}