*{box-sizing:border-box;font-family:Arial,sans-serif}
body{margin:0;background:#f6e8ff;color:#2d103d}
header{height:90px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 8%}
.logo{font-size:34px;font-weight:800;color:#6b009c}
nav a{margin:15px}
button{background:#7b22b8;color:white;border:0;padding:14px 28px;border-radius:30px}
.hero{padding:80px 8%;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(120deg,#5b0096,#d06ae5)}
.hero div:first-child{color:white;max-width:550px}
h1{font-size:65px}
h1 span{color:#ffd7ff}
.visual{display:flex;gap:15px}
.visual div{background:white;color:#7b22b8;width:130px;height:220px;border-radius:25px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:bold}
.products{text-align:center;padding:60px 8%}
.cards{display:flex;gap:20px}
.cards div{background:white;padding:40px;flex:1;border-radius:25px}
.quality{background:#5b0096;color:white;text-align:center;padding:60px}
footer{padding:40px;text-align:center;background:#24003b;color:white}
@media(max-width:800px){nav{display:none}.hero{display:block}h1{font-size:42px}.visual{margin-top:40px}.cards{display:block}.cards div{margin:15px}}
