.hero-laptop{position:absolute;left:5%;top:12%;width:88%;transform:rotate(-5deg);z-index:1}
.hero-laptop-display{margin:0 3%;padding:3% 1.4% 1.4%;background:#222225;border-radius:12px 12px 3px 3px;position:relative}
.hero-laptop-camera{position:absolute;top:2.8%;left:49.5%;width:.8%;aspect-ratio:1;background:#68686a;border-radius:50%}
.hero-laptop-screen{aspect-ratio:1897/909;overflow:hidden;background:#1f1610}
.hero-laptop-screen img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.hero-laptop.supplied-laptop{left:1%;top:13%;width:96%;transform:rotate(-4deg);aspect-ratio:988/554;mix-blend-mode:multiply}
.supplied-laptop-frame{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.supplied-laptop-screen{position:absolute;left:10.73%;top:8.85%;width:77.13%;height:77.26%;overflow:hidden;background:#17100d}
.supplied-laptop-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-laptop-base{height:12px;background:#bfc0c4;border-radius:1px 1px 50% 50%;box-shadow:0 18px 22px #0002;position:relative}
.hero-laptop-base:after{content:'';position:absolute;top:0;left:39%;width:22%;height:35%;background:#929398;border-radius:0 0 5px 5px}
.hero-branding{position:absolute;left:9%;top:64%;width:30%;transform:rotate(-10deg);z-index:2;box-shadow:0 15px 25px #0002}
.hero-branding img{display:block;width:100%;height:auto}
.hero-branding.hero-single-mug{left:9%;top:52%;width:36%;transform:rotate(-12deg);box-shadow:none;background:none}
.hero-single-mug img{filter:drop-shadow(0 9px 7px #0002)}
.hero-collage>a{translate:0 0;transition:translate 250ms cubic-bezier(.2,.8,.2,1)}
@media(hover:hover) and (pointer:fine){.hero-collage>a:hover{translate:0 -5px}}
.hero-collage>a:focus-visible{translate:0 -5px}
@media(prefers-reduced-motion:reduce){.hero-collage>a{transition:none}.hero-collage>a:hover,.hero-collage>a:focus-visible{translate:none;rotate:none}}
.hero-phone{right:7%;top:42%;width:26%;padding:6px;border-radius:clamp(17px,2vw,32px);z-index:3}
.hero-phone-screen{border-radius:clamp(11px,1.5vw,26px)}
.hero-social-header{gap:5px;font-size:clamp(6px,.65vw,10px)}
.hero-social-avatar{width:18px;height:18px}
.hero-social-footer{font-size:clamp(7px,.7vw,11px)}
@media(max-width:760px){.hero-social-header{font-size:8px}.hero-social-footer{font-size:9px}.hero-laptop-base{height:8px}}
@media(max-width:400px){.hero-social-header{font-size:6px;gap:3px}.hero-social-avatar{width:14px;height:14px}.hero-social-footer{font-size:7px}.hero-phone{padding:4px}}
.hero-laptop.hero-complete-laptop{left:1%;top:11%;width:96%;aspect-ratio:3/2;transform:rotate(-4deg);mix-blend-mode:normal}
.hero-complete-laptop>img{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 10px #0002)}
