.home-index-nav{display:none}
.home-info-dialog:not([open]){display:none}
@media(min-width:1000px){
  body[data-page="home"]{background:#f4f4f4;container-type:inline-size;--home-index-scale:calc(100cqw / 1440px)}
  body[data-page="work"]{container-type:inline-size;--home-index-scale:calc(100cqw / 1440px)}
  .home-legacy-nav{display:none}
  .home-index-nav{display:block;position:fixed;z-index:100;top:0;left:0;width:100%;height:calc(35px * var(--home-index-scale));background:#f4f4f4}
  .home-index-nav-inner{position:relative;width:1440px;height:35px;margin:0 auto;zoom:var(--home-index-scale)}
  .home-index-nav a,.home-index-nav button{position:absolute;top:12px;padding:0;border:0;background:none;font-family:Inter,Arial,sans-serif;font-size:16px;font-weight:800;line-height:normal;color:#000;text-align:left;cursor:pointer}
  .home-index-brand{left:32px}
  .home-index-works{left:517px}
  .home-index-info{left:1042px}
  .home-index-contact{left:1345px}
  .home-index-nav :is(a,button):is(:hover,:focus-visible,[data-selected="true"]){color:#fff}
  .home-index{width:1440px;min-height:calc(100dvh / var(--home-index-scale));padding-top:35px;margin:0 auto;background:#f4f4f4;zoom:var(--home-index-scale)}
  .home-index-showcase{display:flex;align-items:center;justify-content:center;width:1440px;height:651px;overflow:hidden;border:1px solid #dedede;background:#fff}
  .home-index-showcase .home-index-film{flex:none;transform:scale(.7);transform-origin:center}
  .home-index-bottom{position:relative;margin-top:10px;min-height:158px;font-family:Inter,Arial,sans-serif;font-size:15px;font-weight:600;color:#000}
  .home-index-services,.home-index-description,.home-index-project{position:absolute;top:0}
  .home-index-divider{position:absolute;left:0;top:-1px;max-width:none;pointer-events:none}
  .home-index-services{left:32px;width:157px;letter-spacing:.6px;line-height:1.5}
  .home-index-services .home-index-divider{transform:rotate(.5deg);transform-origin:left center}
  .home-index-description{left:517px;width:563px;letter-spacing:.3px;line-height:1.4}
  .home-index-description>div{width:560px;margin-top:6px}
  .home-index-project{left:1209px;width:200.01px;letter-spacing:.3px;line-height:1.0365374755859375}
  .home-index-project-title{position:absolute;left:4px;top:0;white-space:nowrap}
  .home-index-project-year{position:absolute;right:0;top:0}
  .home-index-detail{position:absolute;right:0;top:21px;text-decoration:underline;text-underline-position:from-font}
  .home-index-detail:is(:hover,:focus-visible),.home-info-dialog :is(a,button):is(:hover,:focus-visible){color:#fff}
  .home-info-dialog{width:620px;max-width:92vw;max-height:88dvh;margin:auto;padding:44px 32px 24px;background:#f4f4f4;color:#000;border:1px solid #000}
  .home-info-dialog::backdrop{background:rgb(0 0 0 / .22)}
  .home-info-close{position:absolute;right:20px;top:14px;padding:0;background:none;font-size:16px;font-weight:800;cursor:pointer}
  .home-info-dialog .home-summary{width:552px;max-width:100%}
}

@media(max-width:999.98px){
  body[data-page="home"]{background:#f4f4f4}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-legacy-nav{display:none}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-index-nav{display:block;position:fixed;inset:0 0 auto;z-index:100;height:44px;background:#f4f4f4}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-index-nav-inner{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 16px}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-index-nav :is(a,button){padding:0;border:0;background:none;font-family:Inter,Arial,sans-serif;font-size:12px;font-weight:800;color:#000;line-height:1;cursor:pointer}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-index-nav :is(a,button):focus-visible{color:#fff}
  .home-index-mobile{padding-top:60px;min-height:100dvh;background:#f4f4f4}
  .home-index-mobile .home-index-showcase{position:relative;display:flex;align-items:center;justify-content:center;height:240px;overflow:hidden;background:#fff}
  .home-index-mobile .home-index-film{flex:none;transform:scale(var(--home-film-scale,.25));transform-origin:center}
  .home-index-mobile .home-index-bottom{display:grid;grid-template-columns:1fr 1fr;gap:16px 16px;padding:14px 16px 24px;font-size:10px;font-weight:600;line-height:1.5}
  .home-index-mobile .home-index-services,.home-index-mobile .home-index-project{position:relative;border-top:1px solid #000;padding-top:6px}
  .home-index-mobile .home-index-divider{display:none}
  .home-index-mobile .home-index-services{grid-column:1;grid-row:1;letter-spacing:.25px}
  .home-index-mobile .home-index-project{grid-column:2;grid-row:1;display:grid;grid-template-columns:1fr auto;align-content:start;gap:8px 4px;font-size:10px;line-height:1.2}
  .home-index-mobile .home-index-project-year{text-align:right}
  .home-index-mobile .home-index-detail{grid-column:1/-1;justify-self:end;text-decoration:underline;text-underline-position:from-font}
  .home-index-mobile .home-index-detail:is(:hover,:focus-visible){color:#fff}
  .home-index-mobile .home-index-description{grid-column:1/-1;border-top:1px solid #000;padding-top:6px;font-size:11px;line-height:1.4}
  .home-index-mobile .home-index-description p+p{margin-top:7px}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog{width:calc(100% - 32px);max-width:430px;max-height:85dvh;margin:auto;padding:48px 20px 24px;background:#f4f4f4;border:1px solid #000;color:#000}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog::backdrop{background:rgb(0 0 0 / .22)}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-close{position:absolute;right:20px;top:16px;padding:0;background:none;font-size:12px;font-weight:800}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog .home-summary{display:grid;gap:24px}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog .home-summary [data-node-id]{position:static!important;width:auto!important;height:auto!important;zoom:1!important;font-size:13px;line-height:1.45;letter-spacing:0}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog .home-summary-item>[data-name]{display:flex;flex-direction:column;gap:8px}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog [data-node-id="352:28"]{order:-1}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog .home-summary p{font-size:13px;line-height:1.45}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog .home-summary [data-name^="Divider"]{display:none}
  body:is([data-page="home"],[data-page="work"],[data-page="works"],[data-page="echo"]) .home-info-dialog .home-summary a{text-decoration:underline}
}

/* Gallery stays inside the existing showcase rectangle on both layouts. */
.home-gallery{position:relative;width:100%;height:100%;min-width:0;overflow:hidden;background:#fff;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.home-gallery-track{display:flex;width:100%;height:100%;gap:0;transform:translate3d(-100%,0,0);will-change:transform}
.home-gallery-slide{position:relative;flex:0 0 100%;width:100%;height:100%;min-width:0;overflow:hidden;background:#fff}
.home-gallery-hero{display:flex;align-items:center;justify-content:center}
.home-gallery-artboard{position:absolute;left:50%;top:50%;width:1440px;height:651px;transform:translate(-50%,-50%) scale(var(--gallery-scale,.25));transform-origin:center}
.home-gallery img,.home-gallery video{pointer-events:none}
.home-gallery-arrow{position:absolute;z-index:2;top:50%;width:44px;height:44px;margin-top:-22px;padding:6px;background:none;border:0;color:#000;cursor:pointer;filter:drop-shadow(0 1px 1px #fff)}
.home-gallery-previous{left:12px}
.home-gallery-next{right:12px}
.home-gallery-next svg{transform:rotate(180deg)}
.home-gallery-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1000px){
  .home-gallery-arrow{display:none}
}
@media(min-width:1000px) and (pointer:fine){
  .home-gallery{cursor:ew-resize}
}
@media(max-width:999.98px){
  .home-gallery-arrow{display:none}
}

/* Desktop-only second project; reuse the established gallery and type styles. */
@media(min-width:1000px){
  .home-index-echo{margin-top:6px}
  .home-index-echo .home-index-showcase{border:0;background:rgba(133,133,133,.42)}
  .home-index-echo .home-index-services{width:200px;letter-spacing:.15px}
  .echo-gallery,.echo-gallery .home-gallery-slide{background:transparent}
  .echo-gallery-image{display:block;width:100%;height:100%;object-fit:contain}
}

/* Echo uses the established mobile information grid and swipe interaction. */
@media(max-width:999.98px){
  .home-index-mobile .home-index-echo .home-index-showcase,
  .home-index-mobile .echo-gallery,
  .home-index-mobile .echo-gallery .home-gallery-slide{background:#c4c4c4}
  .home-index-mobile .echo-gallery-image{display:block;width:100%;height:100%;object-fit:cover}
}