/* The diagonal pose is photographed into the asset; preserve its square canvas. */
@import url('style-v3.css');
.header{height:clamp(44px,7cqw,76px);padding-top:clamp(6px,1.5cqw,16px)}
.brand{gap:6px}.brand img{width:clamp(20px,3cqw,32px)}.brand b{font-size:clamp(19px,3.5cqw,38px)}.brand small{font-size:clamp(7px,1.1cqw,12px);margin-top:3px}
.hero{padding-top:clamp(4px,1.8cqw,20px);padding-bottom:clamp(8px,1.4cqw,15px);min-height:82cqw}
h1{font-size:clamp(18px,3.9cqw,42px);line-height:1.5}
.hero-action{margin-top:clamp(10px,1.8cqw,20px)}
.hero-screen{width:95%;right:-25%;top:0;transform:none;height:auto;aspect-ratio:1}
.phone-photo{width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.features{margin-top:clamp(14px,2.5cqw,28px)}
@media(max-width:600px){
 .header{height:44px;padding-top:6px}.brand img{width:20px}.brand b{font-size:19px}.brand small{font-size:7px;margin-top:3px}
 .hero{padding-top:4px;padding-bottom:8px;min-height:0}
 .hero-copy{width:51%}h1{font-size:18px;line-height:1.45;letter-spacing:0}
 .hero-action{margin-top:10px}
 .cta{padding:6px 9px;gap:7px;min-height:44px}.cta img{width:23px;height:23px}.cta>span{font-size:14px}.cta svg{width:16px;height:16px;margin-left:0}
 .hero-screen{width:101%;right:-26%;top:6px;transform:none}
 .features{margin-top:12px;gap:3px}
 .benefits{padding-block:8px}
}
@media(max-width:359px){
 h1{font-size:16px}.cta{padding-inline:7px;gap:5px}.cta>span{font-size:12px}.cta img{width:20px;height:20px}.cta svg{width:14px;height:14px}
}