/* 하위 페이지 공통 — base.css 위에 얹는다 */
.hd .mark{flex:0 0 auto}
.hd nav a.on{opacity:1}.hd nav a.on::after{transform:scaleX(1)}
.menu-btn{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--paper);cursor:pointer;place-items:center}
.menu-btn i{display:block;width:16px;height:1px;background:var(--paper);box-shadow:0 -5px 0 var(--paper),0 5px 0 var(--paper)}
.mnav{position:fixed;inset:0;z-index:45;background:rgba(14,14,12,.97);display:none;flex-direction:column;justify-content:center;gap:22px;padding:0 var(--gut)}
.mnav a{font-family:var(--en);font-weight:200;font-size:40px;letter-spacing:.02em}
.mnav a small{display:block;font-family:var(--kr);font-size:14px;color:var(--mute);letter-spacing:0}
body.menu-open .mnav{display:flex}
@media (max-width:1100px){.menu-btn{display:grid}.hd .cta{margin-left:auto}}

/* 하위 페이지 머리 */
.phero{position:relative;height:clamp(420px,62vh,640px);overflow:hidden;display:flex;align-items:flex-end;padding:0 var(--gut) clamp(56px,8vh,96px)}
.phero canvas{position:absolute;inset:0;width:100%;height:100%;background:radial-gradient(ellipse at 50% 30%,#2b2720,#121210 70%)}
.phero .t{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;align-items:end;gap:40px;width:100%}
.phero .eyebrow{font-family:var(--en);font-size:12px;letter-spacing:.32em;color:var(--light)}
.phero h1{margin-top:14px;font-family:var(--en);font-weight:200;font-size:clamp(56px,7vw,136px);line-height:.95;letter-spacing:-.02em}
.phero p{margin-top:22px;font-size:clamp(17px,1.3vw,21px);color:#d9d3c6;max-width:32em}
.phero .crumb{font-family:var(--en);font-size:11px;letter-spacing:.28em;color:var(--mute);text-align:right}
.phero .lline{position:absolute;left:0;right:0;bottom:0;transform:scaleX(1)}

.sec{position:relative;padding:clamp(90px,10vw,160px) var(--gut)}
.sec.light{background:var(--paper);color:var(--ink)}
.sec.char{background:var(--char)}
.sec.black{background:#0b0b0a}
.sh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:60px;align-items:end;margin-bottom:64px}
.sh .eyebrow{font-family:var(--en);font-size:12px;letter-spacing:.32em;color:var(--light)}
.light .sh .eyebrow{color:var(--olive)}
.sh h2{margin-top:16px;font-size:clamp(30px,2.8vw,50px);font-weight:600;line-height:1.3;letter-spacing:-.02em;text-wrap:balance}
.sh p{color:#bdb6a8;font-size:16.5px;max-width:34em}
.light .sh p{color:#5c574e}

/* 회사 소개 */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,110px);align-items:center}
.split img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.split .txt h3{font-size:clamp(24px,2vw,34px);font-weight:600;line-height:1.35;letter-spacing:-.01em}
.split .txt p{margin-top:20px;font-size:16.5px;color:#3a3732}
.dark .split .txt p,.sec.char .split .txt p{color:#cfc8ba}
.scope{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}
.scope .box{border:1px solid rgba(233,207,152,.25);border-radius:6px;padding:40px}
.scope .box.main{background:linear-gradient(160deg,rgba(233,207,152,.10),rgba(233,207,152,0) 60%)}
.scope h3{font-family:var(--en);font-weight:300;font-size:13px;letter-spacing:.3em;color:var(--light)}
.scope h4{margin-top:12px;font-size:24px;font-weight:600}
.scope ul{margin-top:24px;list-style:none;display:grid;gap:14px}
.scope li{display:grid;grid-template-columns:120px 1fr;gap:14px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.07);font-size:15.5px;color:#cfc8ba}
.scope li b{color:var(--paper);font-weight:600}
.scope .ratio{margin-top:26px;font-family:var(--en);font-weight:200;font-size:56px;color:var(--light2);line-height:1}
.scope .ratio small{font-family:var(--kr);font-size:14px;color:var(--mute);margin-left:10px}
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid #d8d1c3}
.flow li{list-style:none;padding:38px 28px 10px 0;border-right:1px solid #d8d1c3;margin-right:28px}
.flow li:last-child{border-right:0;margin-right:0}
.flow .n{font-family:var(--en);font-weight:200;font-size:56px;color:var(--olive);line-height:1}
.flow h4{margin-top:18px;font-size:20px;font-weight:600}
.flow p{margin-top:12px;font-size:15px;color:#5c574e}
.dark .flow{border-top-color:#3a372f}.dark .flow li{border-right-color:#3a372f}.dark .flow p{color:#bdb6a8}.dark .flow .n{color:var(--light)}
.area{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.area span{border:1px solid var(--line);border-radius:999px;padding:8px 18px;font-size:14.5px}

/* 시공사례 목록 */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:46px}
.filters button{font:inherit;font-size:14.5px;color:var(--paper);background:transparent;border:1px solid #3e3b34;border-radius:999px;padding:10px 20px;cursor:pointer;transition:all .3s}
.filters button.on,.filters button:hover{border-color:var(--light);color:var(--light2);box-shadow:0 0 18px rgba(233,207,152,.18)}
.wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:46px 30px}
.witem.hide{display:none}
.witem a{display:block}
.witem .ph{overflow:hidden;border-radius:4px;aspect-ratio:4/3;background:#2a2823}
.witem img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 1.3s cubic-bezier(.2,.7,.2,1),filter .8s;filter:saturate(.92) brightness(.93)}
.witem:hover img{transform:scale(1);filter:none}
.witem .meta{margin-top:18px;display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.witem h3{font-size:18.5px;font-weight:600;letter-spacing:-.01em}
.witem .tag{flex:0 0 auto;font-family:var(--en);font-size:11px;letter-spacing:.2em;color:var(--light)}
.witem p{margin-top:8px;font-size:14.5px;color:#a9a294}
.witem .lline{margin-top:14px;transform-origin:left}
.witem:hover .lline{transform:scaleX(1)}

/* 재생 이야기 */
.stories{display:grid;gap:clamp(70px,8vw,130px)}
.story{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(40px,5vw,90px);align-items:center}
.story:nth-child(even){grid-template-columns:1fr 1.15fr}
.story:nth-child(even) .ph{order:2}
.story .ph{overflow:hidden;border-radius:4px}
.story img{width:100%;aspect-ratio:4/3;object-fit:cover}
.story .no{font-family:var(--en);font-weight:200;font-size:64px;line-height:1;color:var(--light)}
.story h3{margin-top:18px;font-size:clamp(24px,2vw,34px);font-weight:600;line-height:1.35}
.story p{margin-top:18px;color:#cfc8ba;font-size:16.5px}
.story a.more{display:inline-flex;gap:10px;align-items:center;margin-top:26px;font-family:var(--en);font-size:12px;letter-spacing:.24em;color:var(--light)}
.story a.more i{width:40px;height:1px;background:var(--light);box-shadow:0 0 8px var(--light);transition:width .4s}
.story a.more:hover i{width:70px}

/* 병의원 */
.svc4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.svc4 .c{border:1px solid rgba(233,207,152,.22);border-radius:6px;padding:36px 30px 34px;background:linear-gradient(180deg,rgba(233,207,152,.07),transparent 70%);transition:transform .5s,border-color .5s}
.svc4 .c:hover{transform:translateY(-6px);border-color:var(--light)}
.svc4 b{font-family:var(--en);font-weight:200;font-size:46px;color:var(--light);line-height:1}
.svc4 h3{margin-top:22px;font-size:20px;font-weight:600}
.svc4 p{margin-top:12px;font-size:15px;color:#bdb6a8}
.dept{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid #d8d1c3}
.dept div{padding:34px 26px 10px 0;margin-right:26px;border-right:1px solid #d8d1c3}
.dept div:last-child{border-right:0;margin-right:0}
.dept h4{font-size:19px;font-weight:600}
.dept h4 small{display:block;font-family:var(--en);font-size:11px;letter-spacing:.24em;color:var(--olive);font-weight:400;margin-bottom:8px}
.dept p{margin-top:12px;font-size:15px;color:#5c574e}

/* 공사비 FAQ */
.faq{border-top:1px solid #d8d1c3}
.faq div{border-bottom:1px solid #d8d1c3}
.faq button{width:100%;display:flex;justify-content:space-between;gap:20px;text-align:left;font:inherit;font-size:18px;font-weight:600;color:var(--ink);background:none;border:0;padding:26px 0;cursor:pointer}
.faq button::after{content:"+";font-family:var(--en);font-weight:200;font-size:28px;line-height:1;color:var(--olive);transition:transform .3s}
.faq div.open button::after{transform:rotate(45deg)}
.faq p{display:none;padding:0 0 28px;font-size:16px;color:#4a463e;max-width:52em}
.faq div.open p{display:block}

/* 마무리 띠 */
.band{position:relative;overflow:hidden;padding:clamp(90px,10vw,150px) var(--gut);text-align:center;background:var(--ink)}
.band canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.8}
.band .in2{position:relative;z-index:2}
.band h2{font-size:clamp(30px,3vw,54px);font-weight:600;line-height:1.3;letter-spacing:-.02em}
.band p{margin-top:16px;color:#cfc8ba}
.band .row{margin-top:36px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.band .send{display:inline-block}

/* 문의 페이지 */
.qmsg{grid-column:1/-1;font-size:14.5px;color:var(--light2)}
.mapbox{margin-top:36px;display:flex;gap:12px;flex-wrap:wrap}
.mapbox a{border:1px solid var(--line);border-radius:999px;padding:10px 18px;font-size:14px}
.home-more{display:inline-flex;align-items:center;gap:12px;margin-top:30px;font-family:var(--en);font-size:12px;letter-spacing:.24em}
.home-more i{width:44px;height:1px;background:currentColor;transition:width .4s}
.home-more:hover i{width:74px}
.light .home-more{color:var(--olive)}

@media (max-width:1100px){
  .phero .t{grid-template-columns:1fr}.phero .crumb{text-align:left}
  .sh,.split,.scope,.story,.story:nth-child(even){grid-template-columns:1fr}.story:nth-child(even) .ph{order:0}
  .wgrid{grid-template-columns:repeat(2,1fr)}.svc4,.flow,.dept{grid-template-columns:repeat(2,1fr)}
  .flow li:nth-child(2),.dept div:nth-child(2){border-right:0;margin-right:0}
}
@media (max-width:640px){
  .wgrid,.svc4,.flow,.dept{grid-template-columns:1fr}.flow li,.dept div{border-right:0;margin-right:0}
  .scope li{grid-template-columns:1fr;gap:4px}.scope .box{padding:28px 22px}
  .mnav a{font-size:32px}
}