.home{height:100svh;min-height:700px;background:#efeee9;display:grid;grid-template-columns:35% 65%;border:14px solid #181818;color:#181818}.bn-left{position:relative;z-index:2;padding:30px 32px;display:flex;flex-direction:column;justify-content:space-between;background:#efeee9}.bn-brand{width:135px;display:block;filter:brightness(0)}.bn-left h1{font-size:clamp(35px,3.4vw,64px);font-weight:600;letter-spacing:-.065em;line-height:.98;margin:35px 0}.bn-left .studio-name-zh{font-size:28px;letter-spacing:.12em;font-weight:600}.bn-index{font-size:10px;letter-spacing:.12em}.bn-side-bottom{display:flex;justify-content:space-between;align-items:flex-end;font-size:10px;line-height:1.6;border-left:3px solid #f76200;padding-left:14px}.bn-art{position:relative;overflow:hidden;background:#3a1005}.home .landscape{inset:0}.home .landscape img{object-position:56% center;filter:saturate(.9)}.bn-nav{position:absolute;top:30px;left:28px;right:28px;display:flex;justify-content:space-between;gap:14px;z-index:3}.bn-nav a{color:#fff3e5;font-size:12px;text-decoration:none}.bn-caption{position:absolute;top:105px;left:28px;width:175px;font-size:10px;line-height:1.5;color:#fff3e5;z-index:2}.home .hero-logo{left:5%;right:auto;top:41%;bottom:auto;width:105%;translate:0 0;z-index:1}.bn-contact{position:absolute;right:0;bottom:0;width:32%;min-height:210px;background:#f76200;color:#181818;padding:22px;z-index:3;text-decoration:none;display:flex;flex-direction:column;justify-content:space-between}.bn-contact .dash{font-size:32px;line-height:1}.bn-contact strong{font-size:clamp(23px,2.2vw,38px);letter-spacing:-.04em;line-height:1}.bn-contact small{font-size:10px;line-height:1.4}.bn-contact .arrow{position:absolute;right:20px;top:24px;font-size:30px}.bn-art-foot{position:absolute;left:28px;bottom:25px;color:#fff3e5;font-size:10px;line-height:1.5;width:45%}.bn-contact:hover{background:#ff7925}.bn-nav a:hover{text-decoration:underline}.bn-left a:focus-visible,.bn-nav a:focus-visible,.bn-contact:focus-visible{outline:2px solid #181818;outline-offset:4px}@media(max-width:700px){.home{grid-template-columns:1fr;height:auto;min-height:100svh;border-width:8px}.bn-left{padding:22px;min-height:325px}.bn-brand{width:105px}.bn-left h1{font-size:44px;margin:22px 0 12px}.bn-left .studio-name-zh{font-size:22px}.bn-side-bottom{margin-top:25px}.bn-art{height:620px}.bn-nav{top:24px;left:22px;right:22px}.bn-caption{top:75px;left:22px;width:150px}.home .hero-logo{top:40%;bottom:auto;left:3%;width:110%}.bn-contact{width:44%;min-height:190px;padding:18px}.bn-contact strong{font-size:26px}.bn-art-foot{left:20px;bottom:25px;font-size:9px;width:44%}}
.bn-brand{height:auto}.bn-art,.bn-left{min-width:0;min-height:0}
/* Scroll expansion: full-bleed artwork, then release the sticky banner. */
@media(min-width:701px) and (prefers-reduced-motion:no-preference){.banner-scroll{height:220svh;position:relative}.banner-scroll .home{position:sticky;top:0;height:100svh;min-height:0;display:block;border-width:calc(14px * (1 - var(--expand,0)))}.banner-scroll .bn-left{position:absolute;left:0;top:0;bottom:0;width:35%;overflow:hidden;opacity:calc(1 - var(--expand,0));transform:translateX(calc(-50px * var(--expand,0)));pointer-events:auto}.banner-scroll .bn-art{position:absolute;top:0;bottom:0;right:0;width:calc(65% + 35% * var(--expand,0));height:auto;z-index:3}.banner-scroll .bn-caption,.banner-scroll .bn-art-foot,.banner-scroll .bn-contact{opacity:calc(1 - var(--expand,0))}.banner-scroll .home .hero-logo{width:105%;top:41%}}

.bn-contact{height:105px;min-height:105px;padding:12px 22px;justify-content:center;gap:5px}.bn-contact .dash{display:none}.bn-contact strong{font-size:clamp(20px,1.7vw,29px);line-height:1}.bn-contact small{font-size:9px;line-height:1.2}.bn-contact small br{display:none}.bn-contact .arrow{top:12px;right:18px;font-size:24px}@media(max-width:700px){.bn-contact{height:95px;min-height:95px;padding:10px 15px}.bn-contact strong{font-size:21px}.bn-contact .arrow{top:10px;right:12px;font-size:20px}}

@media(min-width:701px){.home{--sidebar:max(220px,calc(35% - 250px));grid-template-columns:var(--sidebar) minmax(0,1fr)}.bn-left{padding-left:22px;padding-right:22px}.bn-left h1{font-size:clamp(28px,2.3vw,48px)}.bn-left .studio-name-zh{font-size:24px}}
@media(min-width:701px) and (prefers-reduced-motion:no-preference){.banner-scroll .bn-left{width:var(--sidebar)}.banner-scroll .bn-art{width:auto;left:calc(var(--sidebar) * (1 - var(--expand,0)));right:0}}

/* Net 100px downward offset, including the sticky expansion state. */
.home .hero-logo,.banner-scroll .home .hero-logo{top:calc(41% + 100px)}
@media(max-width:700px){.home .hero-logo{top:calc(40% + 100px)}}

/* Contact card replaces the top-right navigation label. */
.home .bn-contact{top:0;bottom:auto;right:0;width:32%;z-index:4;opacity:1}
.home .bn-nav{right:calc(32% + 28px)}
@media(max-width:700px){.home .bn-contact{width:44%;height:95px;min-height:95px}.home .bn-nav{right:calc(44% + 15px);left:15px;gap:10px}.home .bn-nav a{font-size:11px}.home .bn-caption{top:120px}}

/* Edge-to-edge banner, including sticky and mobile layouts. */
.home,.banner-scroll .home{border:0}


.home .bn-contact{top:auto;bottom:0;opacity:calc(1 - var(--expand,0))}
.home .bn-nav{right:28px}
@media(max-width:700px){.home .bn-nav{left:22px;right:22px;gap:14px}.home .bn-nav a{font-size:12px}.home .bn-caption{top:75px}}
.home .landscape .banner-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:56% center;opacity:var(--video-visible,0)}
.home .hero-logo{translate:0 calc(var(--logo-lift,0) * -1px)}
@media(min-width:701px) and (prefers-reduced-motion:no-preference){.banner-scroll{height:420svh}}
@media(prefers-reduced-motion:reduce){.home .landscape .banner-video{display:none}}
