*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{
  scroll-behavior:smooth;
  overflow-y:scroll;
  scrollbar-gutter:stable;
}
body{
  position:relative;font-family:var(--font-en);font-size:var(--type-body-size);line-height:var(--type-body-line);
  background-color:var(--bg);color:var(--text);min-height:100vh;
  transition:background-color var(--motion-base) ease,color var(--motion-base) ease;
}
h1,h2,h3,h4,h5,p{margin:0}
h1,.type-h1{font-family:var(--font-en);font-size:var(--type-h1-size);line-height:var(--type-h1-line);letter-spacing:var(--type-h1-track);font-weight:var(--type-h1-weight);color:var(--text-h-lg)}
h2,.type-h2{font-family:var(--font-en);font-size:var(--type-h2-size);line-height:var(--type-h2-line);letter-spacing:var(--type-h2-track);font-weight:var(--type-h2-weight);color:var(--text-h-lg)}
h3,.type-h3{font-family:var(--font-en);font-size:var(--type-h3-size);line-height:var(--type-h3-line);letter-spacing:var(--type-h3-track);font-weight:var(--type-h3-weight);color:var(--text-h-md)}
h4,.type-h4{font-family:var(--font-en);font-size:var(--type-h4-size);line-height:var(--type-h4-line);letter-spacing:var(--type-h4-track);font-weight:var(--type-h4-weight);color:var(--text-h-md)}
h5,.type-h5{font-family:var(--font-en);font-size:var(--type-h5-size);line-height:var(--type-h5-line);letter-spacing:var(--type-h5-track);font-weight:var(--type-h5-weight);color:var(--text-h-sm)}
p,.type-p{font-family:var(--font-en);font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);color:var(--text-sub)}
.type-p-ko{font-family:var(--font-ko);font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);color:var(--text-sub)}
.type-display-p{font-family:var(--font-en);font-size:var(--type-display-body-size);line-height:var(--type-display-body-line);letter-spacing:var(--type-display-body-track);font-weight:var(--type-display-body-weight);color:var(--text-sub)}
.type-display-p-ko{font-family:var(--font-ko);font-size:var(--type-display-body-size);line-height:var(--type-display-body-line);letter-spacing:var(--type-display-body-track);font-weight:var(--type-display-body-weight);color:var(--text-sub)}
.type-caption{font-family:var(--font-en);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);font-weight:var(--type-caption-weight);color:var(--text-muted)}
.type-caption-ko{font-family:var(--font-ko);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);font-weight:var(--type-caption-weight);color:var(--text-muted)}
.grid-bg{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background-color:var(--bg);
  transition:background-color var(--motion-base) ease,opacity var(--motion-base) ease;
}
body[data-grid="on"] .grid-bg{
  background-image:
    linear-gradient(90deg, var(--grid-80) var(--size-px), transparent var(--size-px)),
    linear-gradient(180deg,  var(--grid-80) var(--size-px), transparent var(--size-px)),
    linear-gradient(90deg, var(--grid-40) var(--size-px), transparent var(--size-px)),
    linear-gradient(180deg,  var(--grid-40) var(--size-px), transparent var(--size-px)),
    linear-gradient(90deg, var(--grid-8)  var(--size-px), transparent var(--size-px)),
    linear-gradient(180deg,  var(--grid-8)  var(--size-px), transparent var(--size-px));
  background-size:
    var(--grid-major) var(--grid-major),var(--grid-major) var(--grid-major),
    var(--space-5) var(--space-5),var(--space-5) var(--space-5),
    var(--space-1) var(--space-1),var(--space-1) var(--space-1);
  background-position:
    var(--grid-origin-x) var(--grid-origin-y),
    0 var(--grid-origin-y),
    var(--grid-origin-x) var(--grid-origin-y),
    0 var(--grid-origin-y),
    var(--grid-origin-x) var(--grid-origin-y),
    0 var(--grid-origin-y);
}
body[data-grid="off"] .grid-bg{background-image:none}
body.theme-transitioning[data-grid="on"] .grid-bg{background-image:none}
body.theme-transitioning.theme-grid-in[data-grid="on"]::after{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-color:var(--bg);
  background-image:
    linear-gradient(90deg, var(--grid-80) var(--size-px), transparent var(--size-px)),
    linear-gradient(180deg,  var(--grid-80) var(--size-px), transparent var(--size-px)),
    linear-gradient(90deg, var(--grid-40) var(--size-px), transparent var(--size-px)),
    linear-gradient(180deg,  var(--grid-40) var(--size-px), transparent var(--size-px)),
    linear-gradient(90deg, var(--grid-8)  var(--size-px), transparent var(--size-px)),
    linear-gradient(180deg,  var(--grid-8)  var(--size-px), transparent var(--size-px));
  background-size:
    var(--grid-major) var(--grid-major),var(--grid-major) var(--grid-major),
    var(--space-5) var(--space-5),var(--space-5) var(--space-5),
    var(--space-1) var(--space-1),var(--space-1) var(--space-1);
  background-position:
    var(--grid-origin-x) var(--grid-origin-y),
    0 var(--grid-origin-y),
    var(--grid-origin-x) var(--grid-origin-y),
    0 var(--grid-origin-y),
    var(--grid-origin-x) var(--grid-origin-y),
    0 var(--grid-origin-y);
  animation:gridFadeIn var(--motion-grid) var(--ease-standard) both;
}
@keyframes gridFadeIn{from{opacity:0}to{opacity:1}}
a{text-decoration:none;color:inherit}
img,video{display:block;width:100%;height:100%;object-fit:cover}
.gnb,.mob-ov,.btn-top,.footer-sticky,.page{position:relative;z-index:1}

/* ══ GNB ══ */
.gnb{
  position:fixed;top:0;left:0;right:0;height:var(--gnb-h);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--gnb-x);z-index:1000;
  background:var(--bg);border-bottom:var(--size-px) solid var(--border);
  transition:background var(--motion-base),border-color var(--motion-base);
}
.gnb-logo{
  width:var(--gnb-logo-w);height:var(--gnb-logo-h);display:block;color:var(--text);background:currentColor;
  -webkit-mask:url("../img/common/warum_logo.svg") center/contain no-repeat;
  mask:url("../img/common/warum_logo.svg") center/contain no-repeat;
  transition:color var(--motion-base);
}
.gnb-logo img{width:var(--gnb-logo-w);height:var(--gnb-logo-h);display:block;opacity:0}
.gnb__nav{display:flex;gap:var(--gnb-menu-gap);list-style:none}
.gnb__nav a{
  font-size:var(--gnb-menu-size);line-height:var(--gnb-menu-line);letter-spacing:var(--type-body-track);font-weight:var(--gnb-menu-weight);text-transform:none;
  color:var(--gnb-menu);transition:color var(--motion-fast),font-weight var(--motion-fast);font-family:var(--font-en);
}
.gnb__nav a:hover,.gnb__nav a.active{color:var(--amber)}
.gnb__nav a.active{font-weight:var(--gnb-menu-active-weight)}
.gnb-right{display:flex;align-items:center;gap:var(--space-1)}
.gnb-btn{
  width:var(--theme-toggle-w);height:var(--theme-toggle-h);padding:0;
  background:var(--theme-toggle-bg);border:var(--size-px) solid var(--theme-toggle-border);border-radius:var(--theme-toggle-radius);
  cursor:pointer;font-size:var(--theme-toggle-size);line-height:var(--theme-toggle-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);
  color:var(--theme-toggle-text);font-family:var(--font-en);
  transition:background-color var(--motion-fast),color var(--motion-fast),border-color var(--motion-fast);display:flex;align-items:center;justify-content:center;white-space:nowrap;
}
.gnb-btn:hover{border-color:var(--amber);color:var(--amber)}
.theme-toggle{display:inline-flex;align-items:center;gap:var(--theme-toggle-gap)}
.theme-toggle:hover{background:var(--theme-toggle-hover-bg)}
.theme-toggle__dot{
  width:var(--theme-toggle-dot);height:var(--theme-toggle-dot);border-radius:50%;border:0;background:var(--theme-toggle-dot-bg);
  transition:background var(--motion-fast),border-color var(--motion-fast),box-shadow var(--motion-fast);
  box-shadow:0 0 8px 2px var(--theme-toggle-dot-glow-1),0 0 4px 1px var(--theme-toggle-dot-glow-2);
  flex:0 0 auto;
}
.theme-toggle:hover .theme-toggle__dot{
  background:var(--mono-light-100);border:var(--size-px) solid var(--theme-toggle-moon-border);
  box-shadow:0 0 4px 2px var(--theme-toggle-moon-glow);
}
[data-theme="dark"] .gnb-btn{
  font-weight:var(--gnb-menu-active-weight);
}
[data-theme="dark"] .gnb-btn:hover{border-color:var(--amber);color:var(--amber)}
[data-theme="dark"] .theme-toggle:hover{background:var(--mono-light-100)}
[data-theme="dark"] .theme-toggle__dot{
  background:var(--mono-light-100);border:var(--size-px) solid var(--theme-toggle-moon-border);
  box-shadow:0 0 4px 2px var(--theme-toggle-moon-glow);
}
[data-theme="dark"] .theme-toggle:hover .theme-toggle__dot{
  border:var(--size-px) solid var(--primary-light-100);background:var(--mono-light-100);
  box-shadow:0 0 8px 2px var(--theme-toggle-dot-glow-1),0 0 4px 1px var(--theme-toggle-dot-glow-2);
}
.gnb-hamburger{
  display:none;flex-direction:column;justify-content:center;align-items:center;
  width:var(--hamburger-size);height:var(--hamburger-size);cursor:pointer;background:none;border:none;padding:0;gap:var(--hamburger-gap);
}
.gnb-hamburger span{
  display:block;width:var(--hamburger-line-w);height:var(--hamburger-line-h);background:var(--text);
  transition:transform var(--motion-base),opacity var(--motion-base),width var(--motion-base);transform-origin:center;
}
.gnb-hamburger.open span:nth-child(1){transform:translateY(var(--hamburger-open-offset)) rotate(45deg)}
.gnb-hamburger.open span:nth-child(2){opacity:0;width:0}
.gnb-hamburger.open span:nth-child(3){transform:translateY(calc(var(--hamburger-open-offset) * -1)) rotate(-45deg)}

/* 모바일 오버레이 */
.mob-ov{
  display:none;position:fixed;inset:0;background:var(--bg);z-index:999;
  flex-direction:column;align-items:center;justify-content:center;gap:var(--space-5);
  opacity:0;transition:opacity var(--motion-base);
}
.mob-ov.open{opacity:1}
.mob-ov:not(.open){pointer-events:none}
.mob-ov__nav{list-style:none;display:flex;flex-direction:column;align-items:center;gap:var(--space-5)}
.mob-ov__nav a{
  font-size:var(--type-h3-size);line-height:var(--type-h3-line);font-weight:var(--type-h3-weight);letter-spacing:var(--type-h3-track);text-transform:none;
  color:var(--text);transition:color var(--motion-fast);font-family:var(--font-en);
}
.mob-ov__nav a:hover{color:var(--amber)}
.mob-ov__btns{display:flex;gap:var(--space-1);flex-wrap:wrap;justify-content:center}
.mob-btn{
  width:var(--theme-toggle-w);height:var(--theme-toggle-h);padding:0;background:var(--theme-toggle-bg);border:var(--size-px) solid var(--theme-toggle-border);border-radius:var(--theme-toggle-radius);
  cursor:pointer;font-size:var(--theme-toggle-size);line-height:var(--theme-toggle-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);
  color:var(--theme-toggle-text);font-family:var(--font-en);transition:background-color var(--motion-fast),color var(--motion-fast),border-color var(--motion-fast);
  display:inline-flex;align-items:center;justify-content:center;
}
.mob-btn:hover{border-color:var(--amber);color:var(--amber)}
[data-theme="dark"] .mob-btn{
  font-weight:var(--gnb-menu-active-weight);
}
[data-theme="dark"] .mob-btn:hover{border-color:var(--amber);color:var(--amber)}

@media(max-width:760px){
  .gnb{padding:0 var(--page-x-mobile)}
  .gnb__nav,.gnb-right{display:none}
  .gnb-hamburger{display:flex}
  .mob-ov{display:flex}
}

/* ══ 컨테이너 스냅 래퍼 ══ */
.site-wrap{width:100%;margin-left:auto;margin-right:auto}

/* ══ PAGES ══ */
.page{display:none;padding-top:var(--gnb-h);padding-bottom:var(--page-bottom)}
.page.active{display:block}

/* ══ WORK LIST ══ */
.work-header{
  height:var(--work-header-h);padding:0 var(--page-x);
  display:flex;align-items:center;
  border-bottom:var(--size-px) solid var(--border);
}
.work-header h1{
  font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);text-transform:none;
  font-weight:var(--work-header-title-weight);color:var(--text-muted);
}
.tag-bar{
  position:sticky;top:var(--gnb-h);z-index:100;
  height:var(--bar-h);padding:0 var(--page-x);
  display:flex;align-items:center;gap:var(--tag-gap);
  background:var(--bg);border-bottom:var(--size-px) solid var(--border);
  transition:background var(--motion-base);
  overflow-x:auto;white-space:nowrap;scrollbar-width:none;
}
.tag-bar::-webkit-scrollbar{display:none}
.tag{
  font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);text-transform:none;font-weight:var(--gnb-menu-active-weight);
  color:var(--text-muted);cursor:pointer;
  background:none;border:none;padding:0;
  font-family:var(--font-en);transition:color var(--motion-fast);flex-shrink:0;
}
.tag:hover{color:var(--text)}
.tag.active{
  background:var(--amber);color:var(--text-inverse);
  padding:0 var(--page-x-mobile);height:var(--tag-active-h);border-radius:var(--tag-active-radius);
  display:inline-flex;align-items:center;
}
[data-theme="dark"] .tag.active{color:var(--text-active-inverse)}

/* 카드 그리드 */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr)}
@media(max-width:960px){.card-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.card-grid{grid-template-columns:1fr}}
.work-card{
  border-right:var(--size-px) solid var(--border);border-bottom:var(--size-px) solid var(--border);
  cursor:pointer;background:var(--bg);transition:background var(--motion-base);overflow:hidden;
}
.card-grid>.work-card:nth-child(3n){border-right:none}
@media(max-width:960px){
  .card-grid>.work-card:nth-child(3n){border-right:var(--size-px) solid var(--border)}
  .card-grid>.work-card:nth-child(2n){border-right:none}
}
@media(max-width:560px){.card-grid>.work-card{border-right:none}}
.wc-img{overflow:hidden;position:relative;background:transparent}
.wc-ph{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:absolute;inset:0;
  background-size:cover;background-position:center;
  transition:transform var(--motion-card-hover) var(--ease-standard);
}
.wc-ph-lbl{
  display:none;
  font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--media-label-track);text-transform:none;color:var(--media-label-muted);
}
.work-card:hover .wc-ph{transform:scale(var(--scale-card-hover))}
.wc-body{
  min-height:var(--work-card-body-min);padding:var(--work-card-pad-y) var(--work-card-pad-x);
  display:flex;flex-direction:column;justify-content:center;gap:0;
  border-top:var(--size-px) solid var(--border);
}
.wc-label{font-size:var(--work-card-meta-size);line-height:var(--work-card-meta-line);letter-spacing:var(--type-body-track);text-transform:none;font-weight:var(--work-card-meta-weight);color:var(--text-muted)}
.wc-title{font-size:var(--work-card-title-size);line-height:var(--work-card-title-line);font-weight:var(--work-card-title-weight);color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.work-more{
  width:100%;height:var(--more-h);display:flex;align-items:stretch;justify-content:flex-start;
  border-bottom:var(--size-px) solid var(--border);
}
.work-more__btn{
  width:100%;height:var(--more-h);padding:0 var(--page-x);
  border:var(--size-px) solid var(--border);border-radius:0;
  border-top:none;border-left:none;border-right:none;
  background:var(--bg);color:var(--text-muted);
  font-family:var(--font-en);font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);
  cursor:pointer;transition:color var(--motion-fast) ease,background-color var(--motion-fast) ease,border-color var(--motion-fast) ease;
}
.work-more__btn:hover{color:var(--primary)}

/* ══ 푸터 / TOP ══ */
.footer-sticky{
  position:fixed;bottom:0;left:0;right:0;z-index:200;
  background:var(--bg);border-top:var(--size-px) solid var(--border);
  height:var(--footer-bar-h);padding:0 var(--footer-x);overflow:hidden;
  display:block;
  transform:translateY(100%);transition:transform var(--motion-base),background var(--motion-base),height var(--motion-base) var(--ease-standard);
}
.footer-sticky.visible{transform:translateY(0)}
.footer-sticky.open{height:var(--footer-open-h)}
.footer-bar{height:var(--footer-bar-h);display:flex;align-items:center;justify-content:space-between}
.footer-sticky span,.footer-info{
  font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--footer-letter-track);color:var(--text-muted);
}
.footer-toggle{
  height:var(--footer-bar-h);padding:0;border:0;background:none;color:var(--text-muted);
  display:flex;align-items:center;gap:var(--space-2);cursor:pointer;
  font:inherit;
}
.footer-arrow{
  position:relative;width:var(--footer-arrow-box);height:var(--footer-arrow-box);display:block;flex:0 0 auto;
}
.footer-arrow::before,
.footer-arrow::after{
  content:"";position:absolute;top:var(--footer-arrow-top);width:var(--footer-arrow-w);height:var(--footer-arrow-h);background:currentColor;transform-origin:center;
}
.footer-arrow::before{left:var(--footer-arrow-inset);transform:rotate(45deg)}
.footer-arrow::after{right:var(--footer-arrow-inset);transform:rotate(-45deg)}
.footer-sticky.open .footer-arrow::before{transform:rotate(-45deg)}
.footer-sticky.open .footer-arrow::after{transform:rotate(45deg)}
.footer-info{
  height:var(--footer-info-h);display:flex;flex-direction:column;align-items:flex-end;justify-content:center;
  padding-top:0;text-align:right;gap:0;border-top:var(--size-px) solid var(--border);
}
.btn-top{
  position:fixed;bottom:var(--top-btn-bottom);right:var(--top-btn-right);z-index:201;
  width:var(--top-btn-size);height:var(--top-btn-size);background:var(--bg);border:var(--size-px) solid var(--border);
  display:none;align-items:center;justify-content:center;
  cursor:pointer;transition:all var(--motion-fast);font-size:var(--type-caption-size);color:var(--text-muted);
}
.btn-top:hover{border-color:var(--amber);color:var(--amber)}
.btn-top.visible{display:flex}
.btn-top.footer-open{bottom:var(--top-btn-bottom-footer-open)}

/* ══ DETAIL ══ */
.detail-back{
  position:sticky;top:var(--gnb-h);z-index:90;
  height:var(--bar-h);padding:0 var(--page-x);
  display:flex;align-items:center;gap:var(--space-1);
  font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--detail-back-track);text-transform:none;font-weight:var(--gnb-menu-active-weight);
  color:var(--text-muted);cursor:pointer;
  background:var(--bg);border-bottom:var(--size-px) solid var(--border);transition:color var(--motion-fast),background var(--motion-base);
}
.detail-back:hover{color:var(--amber)}
.detail-back svg{width:var(--space-2);height:var(--space-2);fill:none;stroke:currentColor;stroke-width:var(--hamburger-line-h)}
.proj-header{padding:var(--project-header-y) var(--page-x)}
.proj-header__label{font-size:var(--type-caption-size);letter-spacing:var(--project-label-track);text-transform:none;font-weight:var(--gnb-menu-active-weight);color:var(--amber);line-height:var(--type-caption-line);margin-bottom:var(--space-3)}
.proj-header__en{font-size:var(--project-title-size);line-height:var(--project-title-line);font-weight:var(--project-title-weight);color:var(--text)}
.proj-header__ko{font-family:var(--font-ko);font-size:var(--type-body-size);line-height:var(--type-body-line);color:var(--text-sub);margin-top:var(--project-ko-mt)}
.proj-tags{display:flex;gap:var(--space-1);flex-wrap:wrap;margin-top:var(--space-5)}
.proj-tag{
  height:var(--project-tag-h);padding:0 var(--page-x-mobile);
  font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);text-transform:none;font-weight:var(--gnb-menu-active-weight);
  border:var(--size-px) solid var(--border);border-radius:var(--project-tag-radius);
  background:var(--bg);color:var(--text-muted);
  display:flex;align-items:center;
}

/* ══ BLOCK SYSTEM ══ */
.block{width:100%}
.detail-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#page-detail .work-format__hero,
#page-detail .work-format__intro,
#page-detail .work-format__summary,
#page-detail .work-format__meta,
#page-detail .warum-identity-visual,
#page-detail .warum-identity-media,
#page-detail .t-side,
#page-detail .i-side,
#page-detail .block--center-img .inner,
#page-detail .block--video,
#page-detail .block--info{background:transparent}
.detail-content--warum{display:none}
#page-detail[data-project="warum-identity"] .detail-content--warum{display:block}
#page-detail[data-project="warum-identity"] .detail-content--sample{display:none}
#page-detail[data-project="warum-identity"] .proj-header{display:none}
.work-format--01 .work-format__intro{
  min-height:var(--work-intro-min);padding:var(--work-intro-pad-y) var(--work-intro-pad-x);
  display:flex;flex-direction:column;justify-content:flex-end;
  background:transparent;
}
.work-format--01 .work-format__title{
  max-width:var(--work-intro-title-max);
  font-family:var(--font-en);font-size:var(--work-intro-title-size);line-height:var(--work-intro-title-line);
  letter-spacing:var(--work-intro-title-track);font-weight:var(--work-intro-title-weight);color:var(--text);
}
.work-format--01 .work-format__subtitle{
  margin-top:var(--work-subtitle-mt);display:flex;align-items:baseline;gap:var(--space-2);flex-wrap:wrap;
  font-family:var(--font-en);font-size:var(--work-subtitle-size);line-height:var(--work-subtitle-line);
  letter-spacing:var(--type-body-track);font-weight:var(--work-subtitle-weight);color:var(--text-sub);
}
.work-format--01 .work-format__subtitle span+span{font-family:var(--font-ko);font-size:var(--work-subtitle-ko-size);line-height:var(--work-subtitle-line)}
.work-format--01 .work-format__summary{
  margin:var(--work-summary-mt) 0 var(--work-summary-mb);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--work-summary-gap);
}
.work-format--01 .work-format__summary-column{display:flex;flex-direction:column;gap:var(--space-4)}
.work-format--01 .work-format__summary p{
  font-family:var(--font-ko);font-size:var(--work-summary-size);line-height:var(--work-summary-line);
  letter-spacing:var(--type-body-track);font-weight:var(--work-summary-weight);color:var(--text-sub);
}
.work-format--01 .work-format__hero{position:relative;overflow:hidden;background:transparent}
.work-format--01 .work-format__meta{
  width:min(var(--detail-meta-max),100%);
  margin-left:auto;margin-right:auto;
  padding:var(--detail-meta-pad-y) 0;
  grid-template-columns:repeat(var(--detail-meta-columns),minmax(0,1fr));gap:var(--detail-meta-gap);
  border-top:var(--size-px) solid var(--border);
}
.work-format--01 .work-format__meta .info-label{
  margin-bottom:var(--space-3);font-weight:var(--detail-info-label-weight);color:var(--text-muted);letter-spacing:var(--detail-info-label-track);
}
.work-format--01 .work-format__meta .info-val{
  font-family:var(--font-en);font-size:var(--detail-info-value-size);line-height:var(--detail-info-value-line);
  font-weight:var(--detail-info-value-weight);color:var(--text);
}
@media(max-width:760px){
  .work-format--01 .work-format__intro{min-height:var(--work-intro-min-mobile);padding:var(--work-intro-pad-y-mobile) var(--page-x-mobile) var(--work-intro-pad-bottom-mobile)}
  .work-format--01 .work-format__title{font-size:var(--type-h2-size);line-height:var(--type-h2-line);letter-spacing:var(--type-h2-track)}
  .work-format--01 .work-format__subtitle{margin-top:var(--space-2);display:flex;flex-direction:column;align-items:flex-start;gap:0;font-size:var(--work-subtitle-ko-size);line-height:var(--work-subtitle-line)}
  .work-format--01 .work-format__subtitle span+span{font-size:var(--work-subtitle-ko-mobile-size);line-height:var(--type-body-line)}
  .work-format--01 .work-format__summary{margin-top:var(--space-8);grid-template-columns:1fr;gap:var(--work-summary-gap)}
  .work-format--01 .work-format__summary-column{gap:var(--space-3)}
  .work-format--01 .work-format__meta{width:100%;padding:var(--detail-meta-pad-y-mobile) var(--page-x-mobile);grid-template-columns:1fr;gap:var(--detail-meta-gap-mobile)}
}
.warum-identity-visual{position:relative;overflow:hidden}
.warum-identity-visual .bph{padding:var(--space-5)}
.warum-identity-visual .type-h2{text-align:center}
.warum-identity-visual--accent{
  min-height:0!important;margin:var(--space-5) 0;padding:var(--space-20) 0;background:transparent;
  display:flex;align-items:center;justify-content:center;
}
.warum-identity-visual--accent .type-h2,
.warum-identity-visual--accent .bph-type{color:var(--text-inverse)}
.warum-identity-statement{
  position:relative;padding:0 var(--space-5);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--black);text-align:center;
}
.warum-identity-statement .type-h2{color:inherit}
.warum-identity-statement .blk-body{margin-top:var(--warum-statement-body-mt);color:inherit}
[data-theme="dark"] .warum-identity-statement{color:var(--mono-light-400)}
@media(max-width:760px){
  .warum-identity-visual--accent{padding:var(--warum-accent-pad-y-mobile) 0}
  .warum-identity-statement{padding:0 var(--page-x-mobile)}
}
.warum-identity-visual--dark{background:transparent}
.warum-identity-visual--dark .detail-media{object-position:center}
.warum-identity-visual--dark .type-h2,
.warum-identity-visual--dark .bph-type{color:var(--mono-light-100)}
.warum-identity-visual--system{background:transparent}
.warum-identity-visual--question{background:transparent}
.warum-identity-visual--question .detail-media{object-position:center}
.warum-identity-visual--question .type-h2,
.warum-identity-visual--question .bph-type{color:var(--mono-light-100)}
.warum-identity-pair .t-side,
.warum-identity-application .t-side{align-items:flex-start}
.warum-identity-pair .warum-identity-media,
.warum-identity-application .warum-identity-media{position:relative;padding:0;overflow:hidden}
.warum-identity-pair .warum-identity-media{aspect-ratio:1/1;min-height:0}
.warum-identity-pair .t-side:nth-child(2) .detail-media-reveal{transition-delay:.28s}
.warum-identity-pair .t-side:nth-child(2) .detail-media-reveal:not(.is-visible){transition-delay:0s}
.warum-identity-pair .t-side:nth-child(2),
.warum-identity-application .t-side:nth-child(2){background:transparent}
.warum-identity-application+.warum-identity-application .t-side:first-child{background:transparent}
.warum-identity-application+.warum-identity-application .t-side:nth-child(2){background:transparent}
.warum-identity-closing{min-height:var(--work-intro-min);justify-content:center}
.warum-identity-closing .blk-body{margin-top:var(--space-3)}
.detail-reveal{
  opacity:0;transform:translateY(var(--reveal-y));
  transition:opacity var(--motion-reveal) var(--ease-reveal),transform var(--motion-reveal) var(--ease-reveal);
  will-change:opacity,transform;
}
.detail-reveal.is-visible{opacity:1;transform:translateY(0)}
.detail-media-reveal{
  opacity:0;transform:translateY(var(--reveal-y));
  transition:opacity var(--motion-reveal) var(--ease-reveal),transform var(--motion-reveal) var(--ease-reveal);
  will-change:opacity,transform;
}
.detail-media-reveal.is-visible{opacity:1;transform:translateY(0)}
.bph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);position:absolute;inset:0}
.bph-type{font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--media-label-track);text-transform:none;color:var(--media-label-muted)}

/* 기본 CSS 높이 — JS가 덮어씀 (데스크탑 760px+) */
.block--full{aspect-ratio:16/9;min-height:0;position:relative;overflow:hidden}
@media(max-width:760px){.block--full{min-height:0 !important}.block--full.wide{aspect-ratio:4/3;min-height:0 !important}}

.block--ti,.block--it,.block--tt{display:grid;grid-template-columns:1fr 1fr}
.block--ti .t-side,.block--it .t-side,.block--tt .t-side{
  min-height:var(--block-half-min);padding:var(--block-side-pad-y) var(--block-side-pad-x);
  display:flex;flex-direction:column;justify-content:center;
}
.block--ti .i-side,.block--it .i-side{min-height:var(--block-half-min);position:relative;overflow:hidden}
.block--ti .t-side{box-shadow:none}
.block--it .i-side{box-shadow:none}
.block--tt .t-side+.t-side{border-left:none}
@media(max-width:880px){
  .block--ti,.block--it,.block--tt{grid-template-columns:1fr}
  .block--ti .t-side,.block--it .t-side,.block--tt .t-side{min-height:0 !important;padding:var(--block-side-pad-mobile);border:none}
  .block--ti .t-side{box-shadow:none !important}
  .block--ti .i-side,.block--it .i-side{min-height:var(--block-half-min-mobile) !important;border:none}
  .block--it .i-side{box-shadow:none !important}
  .block--tt .t-side+.t-side{border-left:none}
}

.block--3img{display:grid;grid-template-columns:repeat(3,1fr)}
.block--3img .col{min-height:var(--block-half-min);position:relative;overflow:hidden}
.block--3img .col+.col{box-shadow:none}
@media(max-width:640px){
  .block--3img{grid-template-columns:1fr}
  .block--3img .col{min-height:var(--block-half-min-mobile) !important}
  .block--3img .col+.col{border-left:none}
}

.block--3txt{display:grid;grid-template-columns:repeat(3,1fr)}
.block--3txt .col{padding:var(--block-side-pad-y) var(--block-side-pad-x)}
.block--3txt .col+.col{border-left:none}
@media(max-width:640px){
  .block--3txt{grid-template-columns:1fr}
  .block--3txt .col{padding:var(--block-side-pad-mobile)}
  .block--3txt .col+.col{border-left:none}
}
.col-label{font-size:var(--type-caption-size);letter-spacing:var(--media-label-track);text-transform:none;font-weight:var(--gnb-menu-active-weight);color:var(--amber);line-height:var(--type-caption-line);margin-bottom:var(--space-3)}
.col-title{font-size:var(--type-h5-size);line-height:var(--type-h5-line);font-weight:var(--type-h5-weight);color:var(--text)}
.col-body{font-family:var(--font-ko);font-size:var(--type-body-size);line-height:var(--type-body-line);color:var(--text-sub);margin-top:var(--space-3)}

.block--center-txt{padding:var(--block-side-pad-y) var(--block-side-pad-x);display:flex;flex-direction:column;align-items:center;text-align:center}
.block--center-img{padding:var(--block-side-pad-x)}
.block--center-img .inner{aspect-ratio:4/3;width:100%;position:relative;overflow:hidden;background:transparent}
@media(max-width:760px){.block--center-img .inner{aspect-ratio:4/3}}

.block--full.wide{aspect-ratio:4/3;min-height:0}
@media(max-width:760px){.block--full.wide{aspect-ratio:4/3;min-height:0 !important}}
.block--image-auto{aspect-ratio:auto;min-height:0}
.block--image-auto .detail-media{position:static;width:100%;height:auto;object-fit:contain}
.block--ratio-5-2{aspect-ratio:auto;min-height:0}
.block--ratio-5-2 .detail-media{position:static;width:100%;height:auto;object-fit:contain}
@media(max-width:760px){.block--ratio-5-2{aspect-ratio:5/2;min-height:0 !important}}

.block--video{min-height:var(--block-half-min);background:transparent;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
@media(max-width:760px){.block--video{min-height:var(--block-half-min-mobile) !important}}

.detail-module--image-grid-2x2{
  padding:var(--detail-grid-2x2-pad-y) var(--detail-grid-2x2-pad-x);
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--detail-grid-2x2-gap);
}
.detail-module--image-grid-2x2 .detail-module__media{
  aspect-ratio:1/1;position:relative;overflow:hidden;background:transparent;
}
.detail-module--image-grid-2x2 img,
.detail-module--image-grid-2x2 video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.detail-module--image-grid-2x2 + .block-cap{
  margin-top:var(--detail-grid-2x2-caption-offset);
}
.detail-module--image-grid-1x2{
  padding:var(--detail-grid-1x2-pad-y) var(--detail-grid-1x2-pad-x);
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--detail-grid-1x2-gap);
}
.detail-module--image-grid-1x2 .detail-module__media{
  aspect-ratio:1/1;position:relative;overflow:hidden;background:transparent;
}
.detail-module--image-grid-1x2 img,
.detail-module--image-grid-1x2 video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.detail-module--image-grid-1x2 + .block-cap{
  margin-top:var(--detail-grid-1x2-caption-offset);
}
.detail-module--media-1-2{
  padding:var(--detail-split-1-2-pad-y) var(--detail-split-1-2-pad-x);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--detail-split-1-2-gap);
  align-items:stretch;
}
.detail-module--media-1-2 .detail-module__media{
  position:relative;overflow:hidden;background:transparent;
}
.detail-module--media-1-2 .detail-module__media:first-child{
  aspect-ratio:1/1;
}
.detail-module--media-1-2 img,
.detail-module--media-1-2 video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.detail-module--media-1-2 + .block-cap{
  margin-top:var(--detail-split-1-2-caption-offset);
}
@media(max-width:880px){
  .detail-module--image-grid-2x2,
  .detail-module--image-grid-1x2{
    grid-template-columns:1fr;
  }
}
@media(max-width:600px){
  .detail-module--image-grid-2x2,
  .detail-module--image-grid-1x2,
  .detail-module--media-1-2{
    padding-left:var(--page-x-mobile);padding-right:var(--page-x-mobile);
  }
  .detail-module--media-1-2{grid-template-columns:1fr}
  .detail-module--media-1-2 .detail-module__media{aspect-ratio:1/1}
}

.blk-label{font-size:var(--type-caption-size);letter-spacing:var(--media-label-track);text-transform:none;font-weight:var(--gnb-menu-active-weight);color:var(--amber);line-height:var(--type-caption-line);margin-bottom:var(--space-3)}
.blk-h2{font-size:var(--type-h4-size);line-height:var(--type-h4-line);font-weight:var(--type-body-weight);color:var(--text)}
.blk-body{font-family:var(--font-ko);font-size:var(--type-body-size);line-height:var(--type-body-line);color:var(--text-sub);margin-top:var(--space-3)}

.play-ring{width:var(--more-h);height:var(--more-h);border-radius:50%;border:var(--size-px) solid var(--media-control-border);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--motion-fast)}
.play-ring:hover{border-color:var(--amber)}
.play-ring svg{width:var(--space-2);height:var(--space-2);fill:var(--media-control-fill);margin-left:0}
.vimeo-mark{position:absolute;bottom:var(--space-2);right:var(--top-btn-right);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--detail-info-label-track);color:var(--media-mark-muted)}
.video-lbl{position:absolute;left:var(--page-x);bottom:var(--space-2);z-index:1;font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--media-label-track);text-transform:none;color:var(--media-label-soft)}

.block--info{padding:var(--block-side-pad-y) var(--block-side-pad-x);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5)}
@media(max-width:704px){.block--info{grid-template-columns:repeat(2,1fr);padding:var(--block-side-pad-mobile)}}
.info-label{font-size:var(--type-caption-size);letter-spacing:var(--media-label-track);text-transform:none;font-weight:var(--type-caption-weight);color:var(--text-muted);line-height:var(--type-caption-line);margin-bottom:var(--space-3)}
.info-val{font-family:var(--font-ko);font-size:var(--type-body-size);line-height:var(--type-body-line);color:var(--text-sub)}
.block-cap{height:var(--block-caption-h);margin-bottom:var(--block-caption-gap);padding:0 var(--block-side-pad-x);display:flex;align-items:center}
.block-cap span{font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--block-caption-track);text-transform:none;color:var(--text-muted)}
.block-pair-cap{
  display:grid;grid-template-columns:1fr 1fr;
  min-height:var(--block-caption-h);margin-bottom:var(--block-caption-gap);
}
.block-pair-cap__item{height:var(--block-caption-h);padding:0 var(--block-side-pad-x);display:flex;align-items:center}
.block-pair-cap__item span{font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--block-caption-track);text-transform:none;color:var(--text-muted)}
@media(max-width:880px){
  .block-pair-cap{grid-template-columns:1fr}
  .block-pair-cap__item{padding:0 var(--block-side-pad-mobile)}
}

/* ══ ABOUT ══ */
.about-wrap{max-width:var(--content-narrow);margin:0 auto;padding:var(--content-y) 0}
.about-sec-label{font-family:var(--font-en);font-size:var(--type-caption-size);letter-spacing:var(--type-caption-track);text-transform:none;font-weight:var(--type-caption-weight);color:var(--amber);line-height:var(--type-caption-line);margin-bottom:var(--space-2)}
.about-title{font-family:var(--font-en);font-size:var(--type-h2-size);line-height:var(--type-h2-line);letter-spacing:var(--type-h2-track);font-weight:var(--type-h2-weight);color:var(--text);margin-bottom:var(--space-5)}
.about-title strong{font-weight:var(--weight-bold)}
.about-copy{display:flex;flex-direction:column;gap:var(--about-copy-gap);width:var(--content-narrow)}
.about-copy p{font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);color:var(--text-sub)}
.about-copy strong{font-weight:var(--weight-bold)}
.about-copy__en{font-family:var(--font-en)}
.about-copy__ko{font-family:var(--font-ko)}
.about-bar{height:var(--size-px);background:var(--border);margin:var(--about-rule-gap-top) 0 var(--about-rule-gap-bottom)}
.about-services__title{font-family:var(--font-en);font-size:var(--type-h4-size);line-height:var(--type-h4-line);letter-spacing:var(--type-h4-track);font-weight:var(--type-h4-weight);color:var(--text);margin-bottom:var(--space-5)}
.about-services__grid{
  width:var(--content-narrow);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--service-meta-gap);
}
.about-service__label{
  font-family:var(--font-en);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--detail-info-label-track);
  font-weight:var(--detail-info-label-weight);color:var(--text-muted);margin-bottom:var(--space-3);
}
.about-service__items{display:flex;flex-direction:column;gap:0}
.about-service__items p{
  font-family:var(--font-en);font-size:var(--detail-info-value-size);line-height:var(--detail-info-value-line);
  letter-spacing:var(--type-body-track);font-weight:var(--detail-info-value-weight);color:var(--text);
}
@media(max-width:880px){
  .about-wrap{max-width:100%;padding-left:var(--page-x-mobile);padding-right:var(--page-x-mobile)}
  .about-copy{width:100%}
  .about-services__grid{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  .about-wrap{padding-top:var(--content-y-mobile);padding-bottom:var(--content-y-mobile)}
  .about-services__grid{grid-template-columns:1fr;row-gap:var(--space-5)}
}
.scope-grid{
  position:relative;display:grid;grid-template-columns:repeat(2,1fr);margin-top:var(--space-5);
  background:var(--bg);
}
.scope-grid::before,
.scope-grid::after,
.contact-brief__items::before,
.contact-brief__items::after,
.contact-links::before,
.contact-links::after{
  content:"";position:absolute;z-index:2;pointer-events:none;
}
.scope-grid::before,
.contact-brief__items::before,
.contact-links::before{
  inset:0;
  background:
    linear-gradient(var(--border),var(--border)) left top/100% var(--size-px) no-repeat,
    linear-gradient(var(--border),var(--border)) left top/var(--size-px) 100% no-repeat;
}
.scope-grid::after,
.contact-brief__items::after,
.contact-links::after{
  top:0;right:var(--rule-overlap);bottom:var(--rule-overlap);left:0;
  background:
    linear-gradient(var(--border),var(--border)) left bottom/100% var(--size-px) no-repeat,
    linear-gradient(var(--border),var(--border)) right top/var(--size-px) 100% no-repeat;
}
@media(max-width:560px){.scope-grid{grid-template-columns:1fr}}
.scope-item{position:relative;padding:var(--space-5);background:var(--bg);transition:background var(--motion-fast)}
.scope-item::before,
.scope-item::after{
  content:"";position:absolute;background:var(--border);pointer-events:none;
}
.scope-item:nth-child(n+3)::before{top:0;left:0;right:0;height:var(--size-px)}
.scope-item:nth-child(even)::after{top:0;bottom:0;left:0;width:var(--size-px)}
@media(max-width:560px){
  .scope-item:nth-child(n+2)::before{top:0;left:0;right:0;height:var(--size-px)}
  .scope-item:nth-child(even)::after{display:none}
}
.scope-item:hover{background:var(--amber-bg)}
.scope-item__en{font-family:var(--font-en);font-size:var(--type-h5-size);letter-spacing:var(--type-h5-track);text-transform:none;font-weight:var(--type-h5-weight);color:var(--text);line-height:var(--type-h5-line);margin-bottom:var(--space-2)}
.scope-item__ko{font-family:var(--font-ko);font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);color:var(--text-sub)}
[data-theme="dark"] .about-title{font-weight:var(--type-h2-weight)}
[data-theme="dark"] .about-services__title{font-weight:var(--type-h4-weight)}
[data-theme="dark"] .scope-item__en{font-weight:var(--type-h5-weight)}
[data-theme="dark"] .about-title strong{font-weight:var(--weight-bold)}
[data-theme="dark"] .about-copy strong{color:var(--mono-mid-100)}

/* ══ CONTACT ══ */
.contact-wrap{max-width:var(--content-narrow);margin:0 auto;padding:var(--content-y) 0}
.contact-intro{margin-bottom:var(--contact-intro-gap)}
.contact-caption{
  width:var(--content-narrow);height:var(--type-caption-line);
  font-family:var(--font-en);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);font-weight:var(--type-caption-weight);color:var(--amber);
  margin-bottom:var(--space-3);
}
.contact-title{
  width:var(--content-narrow);
  font-family:var(--font-en);font-size:var(--type-h3-size);line-height:var(--type-h3-line);letter-spacing:var(--type-h3-track);font-weight:var(--type-h3-weight);color:var(--text);
  margin-bottom:var(--space-5);
}
.contact-copy{display:grid;grid-template-columns:var(--content-col) var(--content-col);gap:var(--space-4)}
.contact-copy p{
  font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);color:var(--text-sub);
}
.contact-copy__en{font-family:var(--font-en)}
.contact-copy__ko{font-family:var(--font-ko)}
.contact-brief__items{
  position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:0;
  background:var(--bg);
}
.contact-brief__items span{
  position:relative;
  min-height:var(--contact-brief-h);padding:var(--space-1) var(--space-2);
  display:flex;align-items:center;
  font-family:var(--font-en);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);font-weight:var(--type-caption-weight);color:var(--text-muted);
}
.contact-brief__items span::before,
.contact-brief__items span::after{
  content:"";position:absolute;background:var(--border);pointer-events:none;
}
.contact-brief__items span:nth-child(n+3)::before{top:0;left:0;right:0;height:var(--size-px)}
.contact-brief__items span:nth-child(even)::after{top:0;bottom:0;left:0;width:var(--size-px)}
.contact-links{
  position:relative;display:flex;flex-direction:column;margin-bottom:var(--space-5);
  background:var(--bg);
}
.contact-btn{
  position:relative;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--space-5);min-height:var(--contact-btn-h);gap:var(--space-2);
  background:var(--bg);
  cursor:pointer;
  transition:background-color var(--motion-contact-base) var(--ease-contact);
}
.contact-btn:hover{transition-duration:var(--motion-contact-hover)}
.contact-btn+.contact-btn::before{
  content:"";position:absolute;top:0;left:0;right:0;height:var(--size-px);background:var(--border);pointer-events:none;
}
.contact-btn:hover{background:var(--amber-bg)}
.contact-btn--disabled{cursor:default}
.contact-btn.is-hidden{display:none}
.contact-btn--disabled:hover{background:var(--bg)}
.contact-btn--disabled .contact-btn__arrow{display:none}
.contact-btn__label{font-family:var(--font-en);font-size:var(--type-caption-size);line-height:var(--type-caption-line);letter-spacing:var(--type-caption-track);text-transform:none;font-weight:var(--type-caption-weight);color:var(--text-sub);flex-shrink:0;transition:color var(--motion-contact-hover) var(--ease-contact)}
.contact-btn__val{font-family:var(--font-en);font-size:var(--type-body-size);line-height:var(--type-body-line);letter-spacing:var(--type-body-track);font-weight:var(--type-body-weight);color:var(--text-muted);display:flex;align-items:center;gap:var(--space-1);word-break:break-all;text-align:right;transition:color var(--motion-contact-hover) var(--ease-contact)}
.contact-btn__arrow{font-size:var(--type-body-size);transition:color var(--motion-contact-hover) var(--ease-contact);flex-shrink:0}
.contact-btn:hover .contact-btn__label,.contact-btn:hover .contact-btn__arrow{color:var(--amber)}
.contact-btn--disabled:hover .contact-btn__label{color:var(--text-sub)}
@media(max-width:880px){
  .contact-wrap{max-width:100%;padding-left:var(--page-x-mobile);padding-right:var(--page-x-mobile)}
  .contact-caption,.contact-title{width:100%}
  .contact-copy{grid-template-columns:1fr;gap:var(--space-3)}
}
@media(max-width:480px){
  .footer-sticky{padding:0 var(--page-x-mobile)}
  .footer-toggle{gap:var(--space-2)}
  .footer-sticky.open{height:var(--footer-open-h)}
  .footer-info{height:var(--footer-info-h);flex-direction:column;justify-content:center;align-items:center;text-align:center;padding-top:0;gap:0}
  .about-wrap{padding-top:var(--content-y-mobile);padding-bottom:var(--content-y-mobile)}
  .scope-grid{grid-template-columns:1fr}
  .contact-wrap{padding-top:var(--content-y-mobile);padding-bottom:var(--content-y-mobile)}
  .contact-brief__items{grid-template-columns:1fr}
  .contact-brief__items span:nth-child(n+2)::before{top:0;left:0;right:0;height:var(--size-px)}
  .contact-brief__items span:nth-child(even)::after{display:none}
  .contact-btn{flex-direction:column;align-items:flex-start;padding:var(--space-3);gap:var(--space-1)}
  .contact-btn__val{text-align:left}
}
[data-theme="dark"] .contact-title{font-weight:var(--type-h3-weight)}

@media(max-width:600px){
  .work-header,.tag-bar,.proj-header,.detail-back,.block--center-txt,
  .block--center-img,.block--info,.block-cap,.about-wrap,.contact-wrap,
  .footer-sticky{padding-left:var(--page-x-mobile);padding-right:var(--page-x-mobile)}
  .btn-top{right:var(--page-x-mobile)}
}