*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:Arial,sans-serif;line-height:1.6;color:#222;overflow-x:hidden;background:#fff}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button{cursor:pointer;font-family:inherit}

header{position:sticky;top:0;z-index:1000;background:#fff;box-shadow:0 2px 10px #0002;display:flex;align-items:center;justify-content:space-between;padding:8px 5%}

.logo{display:flex;align-items:center}
.logo img{width:auto;height:58px;display:block}

nav{display:flex;gap:20px}
nav a{font-weight:bold;color:#333}
nav a:hover{color:#087f5b}

.menu{display:none;background:none;border:0;font-size:28px;color:#087f5b}

.hero{min-height:90vh;padding:70px 20px;display:flex;align-items:center;position:relative;overflow:hidden;background:url("hero.jpg") center/cover no-repeat}
.hero:before{content:"";position:absolute;inset:0;background:#0009;z-index:0}
.hero-content{position:relative;z-index:1;max-width:1100px;width:100%;margin:auto;display:flex;justify-content:center;align-items:center}
.hero-text{max-width:750px;text-align:center}
.hero-greeting{color:#ffc02e!important;font-weight:bold}
.hero-text h1{font-size:46px;line-height:1.15;margin-bottom:18px;color:#fff}
.hero-text h1 span{color:#ffc02e}
.hero-text p{font-size:18px;color:#fff;margin-bottom:14px}

.hero-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:20px}
.btn{display:inline-flex;justify-content:center;align-items:center;padding:12px 22px;border-radius:8px;font-weight:bold;border:2px solid #087f5b;min-height:48px;background:#087f5b;color:#fff;transition:.2s}
.btn:hover{background:#065f48;transform:translateY(-2px)}

section{padding:70px 20px}
.title{text-align:center;margin-bottom:40px}
.title h2{font-size:34px;margin-bottom:8px}
.title p{color:#666;font-size:17px}

.box{max-width:1000px;margin:auto;background:#fff;padding:30px;border-radius:15px;box-shadow:0 4px 18px #0001}
.box h2{color:#087f5b;margin-bottom:15px}
.box p{margin-bottom:14px;color:#555}

.badge-container{display:flex;flex-wrap:wrap;gap:10px;margin:15px 0}
.badge{background:#eafaf5;color:#087f5b;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:bold;border:1px solid #087f5b33}

.profile{display:grid;grid-template-columns:380px 1fr;gap:40px;align-items:center}
.profile img{width:100%;height:380px;object-fit:cover;border-radius:15px}
.profile p{margin-bottom:12px;color:#555}

.why{max-width:1100px;margin:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:15px}
.why-card{background:#fff;padding:25px 18px;text-align:center;border-radius:12px;box-shadow:0 4px 18px #0001}
.why-card i{font-size:32px;color:#087f5b;margin-bottom:12px}
.why-card h3{font-size:18px;margin-bottom:8px}
.why-card p{font-size:14px;color:#666}

.cards{max-width:1100px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 18px #0002;display:flex;flex-direction:column;justify-content:space-between}
.card img{width:100%;height:220px;object-fit:cover}
.card>div{padding:22px;display:flex;flex-direction:column;flex-grow:1;justify-content:space-between}
.card h3{color:#087f5b;margin-bottom:8px;font-size:22px}
.card p{color:#555;margin-bottom:12px}

.gallery-box{max-width:1100px;margin:auto;position:relative;overflow:hidden;border-radius:12px}
.gallery-track{display:flex;transition:.4s}
.gallery-slide{flex:0 0 33.333%;padding:7px}
.gallery-slide img{width:100%;height:270px;object-fit:cover;border-radius:10px}
.gallery-btn{position:absolute;top:50%;transform:translateY(-50%);border:0;border-radius:50%;width:42px;height:42px;background:#0009;color:#fff;font-size:28px}
.gallery-btn.prev{left:12px}
.gallery-btn.next{right:12px}

.dots{text-align:center;margin-top:15px}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#bbb;margin:4px;cursor:pointer}
.dot.active{background:#087f5b}

#reviews{background:#f6fbf9}
.rating{text-align:center;margin-bottom:30px}
#avg{display:block;font-size:52px;color:#087f5b;line-height:1.2}
#avgStars,.review-stars{color:#e0a800;font-size:21px;letter-spacing:1px}
#count{display:block;margin-top:5px;color:#444}

.review-list{max-width:1100px;margin:0 auto 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.review-card{background:#fff;padding:22px;border-radius:12px;box-shadow:0 4px 18px #0001}
.review-card h3{color:#087f5b;margin-bottom:5px}
.review-card p{margin-top:10px;color:#555}

.view-all-btn{display:flex;margin:10px auto 35px;min-width:210px}

.review-form-wrap{max-width:650px;margin:auto}
.review-form-title{text-align:center;margin-bottom:20px}
.review-form-title h3{font-size:25px;color:#087f5b;margin-bottom:5px}
.review-form-title p{color:#666}

.review-form{background:#fff;padding:25px;border-radius:12px;box-shadow:0 4px 18px #0001}
.review-form label{display:block;font-weight:bold;margin:12px 0 6px}
.review-form input,.review-form textarea,.review-form select{width:100%;padding:11px;border:1px solid #ccc;border-radius:7px;font-size:16px}
.review-form textarea{min-height:120px;resize:vertical}
.review-form button{margin-top:15px;padding:12px 22px;border:0;border-radius:8px;background:#087f5b;color:#fff;font-weight:bold;font-size:16px}
.review-form button:disabled{opacity:.6;cursor:not-allowed}
#msg{text-align:center;margin-top:10px;font-weight:bold}

.faq{max-width:800px;margin:auto}
.faq details{margin-bottom:12px;background:#fff;border-radius:10px;box-shadow:0 3px 12px #0001;overflow:hidden}
.faq summary{padding:18px 20px;font-weight:bold;cursor:pointer;color:#087f5b}
.faq details p{padding:0 20px 18px;color:#555}

.contact{text-align:center;background:linear-gradient(135deg,#eafaf5,#fff)}
.contact>p{margin-bottom:10px;color:#555}
.contact a{color:#087f5b;font-weight:bold}
.social-icons{display:flex;justify-content:center;gap:15px;margin-top:20px}
.social-icons a{width:45px;height:45px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#087f5b;color:#fff!important;font-size:20px}

footer{background:#123;color:#fff;text-align:center;padding:25px 15px;line-height:1.8}

.modal{display:none;position:fixed;inset:0;z-index:2000;background:#000b;padding:20px;overflow:auto}
.modal-box{max-width:750px;margin:40px auto;background:#fff;padding:30px;border-radius:12px;position:relative}
.close{position:absolute;right:15px;top:8px;border:0;background:none;font-size:32px;color:#555}
.modal-box h2{color:#087f5b;margin-bottom:15px}
.day{padding:10px 0;border-bottom:1px solid #eee}

.contact-float{position:fixed;right:20px;bottom:20px;z-index:1500}
.float-icon{width:55px;height:55px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#25d366;color:#fff;font-size:28px;box-shadow:0 4px 15px #0004}

@media(max-width:900px){
.why{grid-template-columns:repeat(2,1fr)}
.cards{grid-template-columns:repeat(2,1fr)}
.profile{grid-template-columns:1fr}
.profile img{max-width:380px;margin:auto}
}

@media(max-width:750px){
header{padding:8px 18px}
.logo img{height:50px}
.menu{display:block}
nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;gap:0;box-shadow:0 5px 10px #0002}
nav.show{display:flex}
nav a{padding:13px 20px;border-bottom:1px solid #eee}

.hero{min-height:calc(100vh - 70px);padding:55px 15px;background-position:center}
.hero:before{background:#000a}
.hero-text h1{font-size:32px}
.hero-text p{font-size:16px}

.hero-buttons{flex-direction:column;align-items:center}
.hero-buttons .btn{width:100%;max-width:320px}

section{padding:55px 15px}
.title h2{font-size:29px}

.profile{padding:20px}
.profile img{height:auto}

.cards{grid-template-columns:1fr}
.why{grid-template-columns:1fr}

.gallery-slide{flex:0 0 100%}
.gallery-slide img{height:240px}

.review-list{grid-template-columns:1fr}
.view-all-btn{width:100%;max-width:280px}
.review-form-wrap{margin-top:15px}

.modal{padding:10px}
.modal-box{margin:20px auto;padding:25px 18px}

.contact-float{right:15px;bottom:15px}
}

@media(max-width:400px){
.logo img{height:45px}
.hero-text h1{font-size:28px}
.hero-text p{font-size:15px}
.title h2{font-size:26px}
.box{padding:20px}
}

@media(min-width:769px){
#about .profile{display:grid;grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:40px;align-items:center;max-width:1100px;width:calc(100% - 40px);margin:0 auto}
#about .profile>div{min-width:0;max-width:100%}
#about .profile img{display:block;width:100%;max-width:420px;height:auto;max-height:520px;object-fit:contain;margin:0 auto;border-radius:15px}
#about .profile h2,#about .profile p{overflow-wrap:break-word}
}