*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Nunito',sans-serif;background:#fff}
.hero{position:relative;height:100vh;min-height:650px;overflow:hidden;background:url(../img/hero_home.jpg) center top/cover no-repeat;}
.hero::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,0.35);z-index:1}
.navbar{position:relative;z-index:5;width:100%;padding:28px 20px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:12px;color:#fff;font-size:42px;font-weight:800}
.logo span{color:#460a85;font-size:36px}
.logo{margin-right:auto;}
.menu{margin-left:auto;margin-right:50px}
.menu{display:flex;gap:30px;list-style:none}
.menu a{text-decoration:none;color:#fff;font-size:17px;font-weight:700;transition:.3s}
.menu a:hover{background:#460a85;color:#fff;padding:10px;border-radius:10px}
.call-btn{display:flex;align-items:center;gap:14px;background:#460a85;padding:10px;border-radius:60px;font-size:16px;font-weight:800;color:#fff;text-decoration:none}
.call-btn svg{width:22px;height:22px;fill:#fff}
.call-btn:hover{background:#fff;color:#460a85;}
.call-btn:hover svg{fill:#460a85}
.hero-content{position:relative;z-index:4;height:calc(100% - 0px);top:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 20px}
.small-title{color:#fff;font-size:23px;font-weight:800;letter-spacing:2px;margin-bottom:10px;text-transform:uppercase}
.hero-title{font-family: "Pacifico",Arial,Helvetica,sans-serif;font-size:60px;line-height:1;color:#fff;text-shadow:0 8px 18px #00000059}
.wave{position:absolute;left:0;bottom:0;width:100%;z-index:2}
.wave svg{display:block;width:100%;height:230px}
.dot{position:absolute;width:16px;height:16px;background:#460a85;border-radius:50%;top:78px;left:50%;transform:translateX(-50%);z-index:5}
@media(max-width:1200px) {
.hero-title{font-size:82px}
.menu{gap:35px}
}
@media(max-width:900px) {
.navbar{padding:25px;flex-direction:column;gap:25px}
.menu{gap:24px;flex-wrap:wrap;justify-content:center}
.hero-title{font-size:62px}
.small-title{font-size:20px}
.hero{min-height:auto;padding-bottom:120px}
}
@media(max-width:600px) {
.hero-title{font-size:48px;line-height:1.2}
.logo{font-size:30px}
.call-btn{font-size:16px;padding:14px 22px}
.menu a{font-size:16px}
}