/* An object and its shadow become visible together after its first real paint. */
.studio-objects>.studio-object:not(.is-art-ready){visibility:hidden;pointer-events:none}
@media(max-width:700px){
 .studio-objects>.studio-object{translate:none;--rotate:0deg}
 .studio-objects>.object-keycap{--x:38%;--y:15%;--size:min(18vw,10svh)}
 .studio-objects>.object-disco{--x:73%;--y:14%;--size:min(22vw,11svh)}
 .studio-objects>.object-portfolio{--x:24%;--y:31%;--size:min(40vw,21svh)}
 .studio-objects>.object-camera{--x:77%;--y:31%;--size:min(36vw,19svh)}
 .studio-title:has(.another-way-title){top:48%;width:94%}
 .studio-title .another-way-title{font-size:17vw;line-height:.96}
 .studio-objects>.object-phone{--x:21%;--y:69.5%;--size:min(26vw,13svh)}
 .studio-objects>.object-basketball{--x:75%;--y:62%;--size:min(21vw,11svh)}
 .studio-objects>.object-badge{--x:80%;--y:79%;--size:min(23vw,12svh)}
 .studio-objects>.object-envelope{--x:20%;--y:84%;--size:min(34vw,18svh)}
 .studio-objects>.object-tv{--x:52%;--y:85%;--size:min(27vw,14svh)}
}

/* Preserve spaces between individually anchored letters. */
.studio-title-line>span{white-space:pre}
@media(max-width:700px){
 .studio-title:has(.another-way-title){width:94%;top:48%}
 .studio-title .another-way-title{font-size:16vw;line-height:1.14;letter-spacing:-.065em}
 .studio-title .another-way-title .studio-title-line{padding-left:0;padding-right:0}
}

@media(max-width:700px){
 .studio-title .another-way-title{font-size:15vw;line-height:1.04}
 .studio-title .another-way-title .slogan-word-break{display:block;height:0;overflow:hidden}
}

@media(max-width:700px){
 .studio-title:has(.another-way-title){top:49%}
 .studio-title .another-way-title{font-size:min(14vw,7svh);line-height:1.04}
}
@media(max-width:700px) and (max-height:650px){
 .studio-objects>.object-portfolio,.studio-objects>.object-camera{--y:29%}
}

/* Give the three-line slogan more presence and spread the lower objects. */
@media(max-width:700px){
 .studio-objects>.object-portfolio,.studio-objects>.object-camera{--y:25.5%}
 .studio-title:has(.another-way-title){top:47%}
 .studio-title .another-way-title{font-size:min(16.5vw,7.8svh);line-height:1.02}
 .studio-objects>.object-phone{--x:20%;--y:67.5%}
 .studio-objects>.object-basketball{--x:81%;--y:57%}
 .studio-objects>.object-badge{--x:80%;--y:73%}
 .studio-objects>.object-envelope{--x:19%;--y:85%}
 .studio-objects>.object-tv{--x:55%;--y:89%}
}

@media(max-width:700px) and (max-height:650px){
 .studio-objects>.object-keycap{--x:50%;--y:10%;--size:min(16vw,7svh)}
 .studio-objects>.object-disco{--y:10%;--size:min(20vw,10svh)}
}

/* The mobile slogan grows downward; artwork is scaled for its surrounding space. */
@media(max-width:700px){
 .studio-title:has(.another-way-title){top:34%;transform:translate(-50%,0);width:94%}
 .studio-title .another-way-title{font-size:min(19.5vw,10svh);line-height:1.02}
 .studio-objects>.object-portfolio{--x:23%;--y:24%;--size:min(36vw,19svh)}
 .studio-objects>.object-camera{--x:78%;--y:24%;--size:min(32vw,17svh)}
 .studio-objects>.object-phone{--x:17%;--y:69%;--size:min(23vw,12svh)}
 .studio-objects>.object-basketball{--x:84%;--y:58%;--size:min(18vw,10svh)}
 .studio-objects>.object-badge{--x:83%;--y:77%;--size:min(20vw,11svh)}
 .studio-objects>.object-envelope{--x:18%;--y:86%;--size:min(29vw,16svh)}
 .studio-objects>.object-tv{--x:53%;--y:90%;--size:min(24vw,13svh)}
}

/* Bring the lower composition into the space below “way”. */
@media(max-width:700px){
 .studio-objects>.object-tv{--x:52%;--y:70%;--size:min(27vw,14svh)}
 .studio-objects>.object-phone{--x:17%;--y:72%;--size:min(23vw,12svh)}
 .studio-objects>.object-badge{--x:82%;--y:77%;--size:min(22vw,12svh)}
 .studio-objects>.object-envelope{--x:34%;--y:88%;--size:min(31vw,17svh)}
}

@media(max-width:700px){
 .studio-header .studio-logo{width:53.76px;height:53.76px}
 .studio-objects>.object-keycap{--x:44%;--y:13%}
 .studio-objects>.object-disco{--y:12.5%}
}
@media(max-width:700px) and (max-height:650px){
 .studio-objects>.object-keycap{--x:55%;--y:8.5%}
 .studio-objects>.object-disco{--y:9%}
}

@media(max-width:700px){
 .studio-title .another-way-title{font-size:min(23.4vw,12svh)}
 .studio-objects>.object-portfolio{--x:19%;--y:28%}
 .studio-objects>.object-camera{--y:27%}
 .studio-header .studio-logo{width:45.696px;height:45.696px}
 .studio-objects>.object-envelope{--y:90%}
}

@media(max-width:700px){
 .studio-objects>.object-keycap{--x:40%}
 .studio-objects>.object-phone{--x:17%;--y:54%}
}
@media(max-width:700px) and (max-height:650px){
 .studio-objects>.object-keycap{--x:51%}
}

@media(max-width:700px){
 .studio-objects>.object-keycap{--x:37%}
 .studio-objects>.object-phone{--y:63%}
 .object-phone .plane-chat-canvas{top:-95.125%}
}
@media(max-width:700px) and (max-height:650px){
 .studio-objects>.object-keycap{--x:48%}
}

@media(max-width:700px){
 .studio-objects>.object-phone{--y:65%}
 .object-phone .plane-chat-canvas{top:-95.125%}
}