/* Shared site chrome: mega menu, mobile nav, filters, overlays */
.brand-sign{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;
  margin:0 0 22px;padding:14px 16px;border:1px solid #d5dbd6;border-radius:14px;
  background:rgba(255,255,255,.78);font-family:Pretendard,"Noto Sans KR",sans-serif
}
.brand-sign .han{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:42px;padding:0 10px;border-radius:10px;
  background:#0c1720;color:#cfff4a;font-size:22px;font-weight:800;letter-spacing:0
}
.brand-sign .word{
  font-size:15px;font-weight:900;letter-spacing:.06em;color:#0c1720
}
.brand-sign .meaning{
  width:100%;font-size:14px;line-height:1.55;color:#4f5c64;margin:2px 0 0;font-weight:600
}
.footer .brand-sign{
  margin:12px 0 0;padding:0;border:0;background:none;border-radius:0;gap:8px
}
.footer .brand-sign .han{min-width:28px;height:28px;font-size:14px;border-radius:6px}
.footer .brand-sign .meaning{font-size:12px;color:#6e787d;font-weight:500}

@media (max-width:720px){
  .brand-sign{margin-bottom:16px;padding:12px 14px}
  .brand-sign .han{min-width:36px;height:36px;font-size:18px}
  .brand-sign .meaning{font-size:13px}
}
body.mong-has-draft{padding-top:0}
body.mong-has-draft .header{top:0}

.mong-mega-wrap{position:relative}
.mong-mega{
  display:none;position:absolute;left:50%;transform:translateX(-50%);
  top:calc(100% + 12px);width:min(960px,92vw);
  background:#fff;border:1px solid #d9ded9;padding:22px;
  box-shadow:0 24px 60px rgba(12,23,32,.12);z-index:90;
  font-family:Pretendard,"Noto Sans KR",sans-serif;
}
.mong-mega.is-open,
.mong-mega-wrap:hover .mong-mega,
.mong-mega-wrap:focus-within .mong-mega{display:block}
.mong-mega-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.mong-mega a{
  display:block;padding:16px 12px;min-height:132px;background:#f3f5f1;
  border:1px solid transparent;color:#0c1720;text-decoration:none;
}
.mong-mega a:hover,.mong-mega a:focus-visible{border-color:#0c1720;background:#fff}
.mong-mega .n{font-size:11px;font-weight:800;letter-spacing:.1em;color:#66727a;margin-bottom:14px}
.mong-mega strong{display:block;font-size:14px;line-height:1.35;margin-bottom:8px;letter-spacing:-.03em}
.mong-mega span{font-size:12px;color:#66727a;line-height:1.5}
.mong-mega a.feat{background:#0c1720;color:#fff}
.mong-mega a.feat .n,.mong-mega a.feat span{color:#9eabb2}
.mong-mega a.feat:hover{border-color:#cfff4a}

.mong-menu-btn{
  display:none;width:42px;height:42px;border:1px solid #d9ded9;background:#fff;
  align-items:center;justify-content:center;cursor:pointer;
}
.mong-menu-btn i{display:block;width:18px;height:2px;background:#0c1720;position:relative}
.mong-menu-btn i:before,.mong-menu-btn i:after{
  content:"";position:absolute;left:0;width:18px;height:2px;background:#0c1720
}
.mong-menu-btn i:before{top:-6px}.mong-menu-btn i:after{top:6px}

.mong-mobile{
  display:none;background:#fff;border-top:1px solid #d9ded9;
  font-family:Pretendard,"Noto Sans KR",sans-serif;
  max-height:min(72vh,560px);overflow-y:auto;-webkit-overflow-scrolling:touch
}
.mong-mobile.is-open{display:block}
body.mong-nav-open{overflow:hidden}
.mong-mobile a,.mong-mobile button{
  display:flex;width:100%;align-items:center;justify-content:space-between;
  padding:14px 0;border:0;border-bottom:1px solid #e6ebe6;
  background:none;font:inherit;font-weight:700;font-size:15px;color:#0c1720;
  text-decoration:none;text-align:left;cursor:pointer;
}
.mong-mobile .panel{display:none;padding:4px 0 12px}
.mong-mobile .panel.is-open{display:block}
.mong-mobile .panel a{
  padding:10px 0 10px 12px;font-size:14px;font-weight:600;color:#66727a;border:0
}

.filter span,.filter-btn,[data-filter]{
  cursor:pointer;user-select:none
}
.filter span.is-active,.filter .on,[data-filter].is-active{
  background:#0c1720 !important;color:#fff !important;border-color:#0c1720 !important
}
[data-work-item].is-hidden{display:none !important}

.tabs .tab,.tabs button,[role="tab"]{cursor:pointer}
[data-panel]{display:none}
[data-panel].is-active{display:block}

@media (max-width:1100px){
  .mong-menu-btn{display:inline-flex}
  .nav > a:not(.contact),
  .nav .mong-mega-wrap,
  .nav > a.contact{display:none !important}
  .mong-mega{display:none !important}
  .mong-mega-grid{grid-template-columns:1fr 1fr}
  .header .inner{gap:12px}
  .logo{font-size:22px}
}
@media (max-width:720px){
  .mong-mega-grid{grid-template-columns:1fr}
  .header .inner{height:68px}
  .logo{font-size:20px}
}

.project-list{border-top:2px solid #0c1720;margin-top:12px}
.project-row{display:grid;grid-template-columns:90px 150px 1.6fr 1fr 1.4fr 40px;gap:20px;align-items:center;padding:24px 6px;border-bottom:1px solid #d3d9d4;color:inherit;text-decoration:none}
.project-row.list-head{font-size:11px;font-weight:900;color:#7c868b;padding-top:16px;padding-bottom:14px}
.project-row .year{font-weight:850;font-size:16px}
.project-row .type{font-size:12px;color:#647078}
.project-row .title{font-size:18px;font-weight:750;line-height:1.4}
.project-row .client,.project-row .role{font-size:13px;color:#647078}
.project-row .go{font-size:20px}
@media(max-width:720px){
  .project-row{grid-template-columns:68px 1fr 32px;gap:10px}
  .project-row .type,.project-row .client,.project-row .role{grid-column:2}
  .project-row .title{grid-column:2}
  .project-row .go{grid-column:3;grid-row:1/5}
  .project-row.list-head{display:none}
}