/* Two new project presentations, using the existing device-led carousel. */
.case-kraft{background:radial-gradient(ellipse at 35% 25%,#f6f9f1,#dce3d6 65%,#afbcaa)}
.case-villa{background:radial-gradient(ellipse at 35% 25%,#fff9ef,#eddfd0 65%,#c9b7a4)}
.kraft-site,.villa-site{container-type:inline-size;position:relative;overflow:hidden;background:#f5f3e9}
.kraft-site .mini-nav,.villa-site .mini-nav{height:17%;display:flex;align-items:center;justify-content:space-between;padding:0 5%;font-size:1.5cqw;gap:2cqw}
.kraft-site .mini-nav{background:#193e34;color:#eef3df}
.villa-site .mini-nav{background:#faf1df;color:#6a523c}
.kraft-site .mini-nav>b{font-family:Manrope,Arial,sans-serif;font-size:4cqw;line-height:1;letter-spacing:-.1cqw}
.kraft-site .mini-nav>b>span{display:block;font-family:DM,Arial,sans-serif;font-size:1cqw;letter-spacing:.85cqw;margin-top:1cqw}
.villa-site .mini-nav>b{font-family:Georgia,serif;font-size:3.8cqw;font-weight:400;letter-spacing:-.1cqw}
.kraft-site .mini-nav i,.villa-site .mini-nav i{font-style:normal;font-size:1.2cqw;padding:1cqw 1.6cqw;border:1px solid currentColor;border-radius:2cqw}
.kraft-visual,.villa-visual{position:relative;height:73%;overflow:hidden}
.kraft-visual{background:#193e34;color:#f1f5e8}
.villa-visual{background:#f6ead2;color:#6a523c}
.kraft-visual>div,.villa-visual>div{position:relative;z-index:1;padding:4.2cqw 5cqw;width:60%}
.kraft-site .kraft-visual h3,.villa-site .villa-visual h3{font-size:6.4cqw;line-height:1.08;letter-spacing:-.25cqw;margin:2cqw 0 0}
.villa-site .villa-visual h3{font-family:Georgia,serif;font-weight:400;font-size:6.8cqw}
.kraft-site small,.villa-site small{font-size:1.1cqw;letter-spacing:.3cqw}
.kraft-site .mini-pill,.villa-site .mini-pill{display:inline-block;font-size:1.3cqw;line-height:1.4;margin-top:3cqw;padding:1.5cqw 2.5cqw;border-radius:5cqw;background:#d8eb9e;color:#264435}
.villa-site .mini-pill{background:#74583f;color:#fff6e7}
.kraft-route{position:absolute;width:80%;height:auto;right:-6%;bottom:-15%;opacity:.95}
.villa-scene{position:absolute;width:62%;height:100%;right:0;bottom:0}
.new-case-strip{height:10%;padding:0 5%;display:flex;align-items:center;justify-content:space-between;gap:2cqw;font-size:.95cqw;letter-spacing:.16cqw;color:#536553;background:#eef1e4}
.villa-site .new-case-strip{background:#f9f1e5;color:#80664d}
.case-phone .kraft-site .mini-nav,.case-phone .villa-site .mini-nav{height:15%;padding:7% 8% 0}
.case-phone .kraft-site .mini-nav>b{font-size:12cqw;letter-spacing:-.4cqw}
.case-phone .kraft-site .mini-nav>b>span{font-size:2.5cqw;letter-spacing:2.5cqw;margin-top:2.5cqw}
.case-phone .villa-site .mini-nav>b{font-size:10cqw;letter-spacing:-.3cqw}
.case-phone .kraft-visual,.case-phone .villa-visual{height:76%}
.case-phone .kraft-visual>div,.case-phone .villa-visual>div{padding:15cqw 8cqw;width:100%}
.case-phone .kraft-site .kraft-visual h3,.case-phone .villa-site .villa-visual h3{font-size:15cqw;line-height:1.12;margin-top:6cqw;letter-spacing:-.5cqw}
.case-phone .kraft-site small,.case-phone .villa-site small{font-size:2.7cqw;letter-spacing:.5cqw}
.case-phone .kraft-site .mini-pill,.case-phone .villa-site .mini-pill{font-size:3cqw;padding:4cqw 6cqw;margin-top:8cqw;border-radius:9cqw}
.case-phone .kraft-route{width:150%;right:-25%;bottom:-7%}
.case-phone .villa-scene{width:135%;height:auto;right:-12%;bottom:-1%}
.case-phone .new-case-strip{height:9%;font-size:2.4cqw;padding:0 8%}
.case-phone .new-case-strip>span:not(:first-child){display:none}
.dialog-image .kraft-site,.dialog-image .villa-site{height:270px}
.dialog-image .kraft-site .mini-nav,.dialog-image .villa-site .mini-nav{height:17%}
.dialog-image .kraft-site .kraft-visual h3,.dialog-image .villa-site .villa-visual h3{font-size:7cqw!important}
#dialog-link[hidden]{display:none}
@media(max-width:600px){
 .case-controls{display:grid;grid-template-columns:1fr auto;column-gap:15px;row-gap:2px}
 .case-pagination{grid-column:1;grid-row:1}
 .case-pause{grid-column:2;grid-row:1}
 .case-dots{grid-column:1/-1;grid-row:2;justify-content:center;gap:3px}
 .case-dots>button{width:36px;height:36px;padding:10px}
 .dialog-image .kraft-site,.dialog-image .villa-site{height:205px}
 .dialog-image .kraft-visual>div,.dialog-image .villa-visual>div{padding-top:8cqw}
}
