body, html { margin: 0; padding: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: white; color: #333; scroll-behavior: smooth; }
header { background: #f4c65d; color: #334d33; font-size: 1.6rem; font-weight: bold; position: sticky; top: 0; z-index: 999; box-shadow: 0 2px 5px rgba(0,0,0,0.09); }
nav { display: flex; align-items: center; justify-content: space-between; max-width: 1180px; margin: auto; padding: 0 18px 0 0; height: 62px; }
.site-title { font-weight: 900; font-size:1.5rem; letter-spacing:1px; }
.nav-link { color: #334d33; text-decoration: none; margin: 0 10px; font-size: 1rem; font-weight: bold; padding:8px 16px;border-radius:20px;transition:background 0.25s;}
.nav-link.active, .nav-link:hover { background: #f7e3a6; color: #444; }
.hero { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; background: linear-gradient(to right, #f4c65d, #57825c); color: white; padding: 44px 14px 46px 14px; position: relative; overflow: hidden; }
.hero-text { flex: 1 1 320px; max-width: 700px; padding: 16px 50px 10px 18px; opacity: 0; animation: fadeInLeft 1.4s ease 0.5s forwards; }
.hero-text.animated { opacity: 1; }
.hero-text h1 { font-size: 2.7rem; font-weight: 800; text-shadow:1px 1px 4px #334d33; margin-bottom:19px; }
.hero-image { flex: 1 1 350px;max-width: 420px; padding: 17px 20px 0 0; opacity: 0;animation: fadeInRight 1.7s ease 0.6s forwards; position: relative; }
.hero-image.animated {opacity:1;}
.hero-image img { max-width: 100%; border-radius: 22px; box-shadow: 0 0 34px rgba(0,0,0,0.18); }
.special-offer-box {
  background: #b6a14a;
  color: #24402c;
  border-radius: 16px;
  margin: 28px auto 22px auto;
  padding: 26px 16px 24px 16px;
  font-size: 1.23rem;
  font-weight: 700;
  box-shadow: 0 2px 14px #a7902850;
  display: flex;
  align-items: center;
  max-width: 750px;
}
.special-offer-box .tick {
  font-size: 2.1rem;
  margin-right: 19px;
  color: #233a21;
  font-weight: bold;
}
@keyframes fadeInLeft { from { opacity: 0; transform: translateX(-54px);} to { opacity: 1; transform: translateX(0);} }
@keyframes fadeInRight { from { opacity: 0; transform: translateX(54px);} to { opacity: 1; transform: translateX(0);} }
.slider-container { margin: 28px auto 34px auto; max-width: 890px; position: relative; overflow: hidden; border-radius: 22px; box-shadow: 0 0 27px rgba(87, 130, 92, 0.16);}
.no-arrows .slider-buttons { display:none!important;}
.slider { display: flex; transition: transform 1.1s cubic-bezier(0.4, 0, 0.2, 1);}
.slide { min-width: 100%; background: #f9f7e8; padding: 36px 40px; font-size: 1.18rem; color: #356b49; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.services-section { max-width: 1000px; margin: 32px auto 38px auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 26px; }
.service-card { background: #fffbea; border: 2px solid #f4c65d; padding: 25px 14px; border-radius: 18px; box-shadow: 2px 2px 12px #eee; text-align: center; font-weight: bold; color: #334d33; font-size:1.1rem; transition: transform 0.34s, box-shadow 0.34s; }
.service-card:hover { transform: scale(1.06); box-shadow:0 0 27px #f4c65daa; color: #f4c65d;}
.why-choose {background:#dec051; color:#334d33;max-width:900px;margin:48px auto 0 auto; padding:36px 38px; border-radius: 20px;box-shadow:0 0 25px #e9d32e45;}
.why-choose h2 { text-align: center; font-weight:800; font-size:2.2rem; margin-bottom:25px;}
.why-content ul { list-style: disc; margin:0 0 0 22px; padding:0; }
.why-content li { font-size:1.11rem;padding-bottom:10px; }
.astro-bar {display:flex;flex-wrap:wrap;justify-content:center;gap:18px;padding:15px 18px 12px 18px; background:#e8e7ff; color:#333; font-weight:600; font-size:1.05rem;}
.astro-bar span{background:#f0eefb;border-radius:9px;padding:7px 14px;margin-bottom:6px;}
.knowledge {max-width:900px;margin:42px auto 40px auto;padding:23px 26px 19px 26px;background:#f8f3e6;border-radius:20px;box-shadow:0 0 12px #f1e3ad;}
.knowledge h2 {font-size:1.27rem;font-weight:800;margin-bottom:9px;}
.knowledge p {font-size:1.09rem;line-height:1.7;}
.testimonials { max-width: 950px; margin:38px auto 33px auto;background: #ffffffee; padding: 22px 26px 29px 26px; border-radius: 17px;box-shadow:0 0 22px #dedede;}
.testimonials h2 { text-align:center;font-weight:700; margin-bottom:21px;color:#334d33; }
.testimonial-carousel { overflow: hidden; position: relative; height:58px; }
.testimonial-slider { display: flex; transition: transform 1s ease; }
.testimonial-slide { min-width: 100%; text-align: center; font-size:1rem; padding:13px 16px; }
footer { background:#334d33; color:white; text-align:center; padding:15px 10px;font-size:1rem;box-shadow:0 -1px 5px rgba(0,0,0,0.10);}
footer a { color:#f4c65d; text-decoration:none; margin:0 8px; font-weight:600;}
.sticky-buttons { position:fixed; bottom:18px; right:20px; display:flex; flex-direction:column; gap:10px; z-index:10000; filter: drop-shadow(0 3px 5px #222);}
.sticky-buttons a { background:#25d366; color:white; padding:13px 24px; border-radius: 35px; font-weight: 900; text-decoration:none; font-size:1.13rem; display:flex; align-items:center; justify-content:center; box-shadow: 0 3px 8px #1ebe5baa; }
.sticky-buttons a.call-btn { background:#f16048; box-shadow:0 3px 8px #c24030aa;}
.sticky-buttons a:hover { opacity:0.88; }
@media(max-width:900px){.hero-text{padding:12px 10px 10px 10px}.about-text{padding:8px 2px}.services-section{gap:18px;}}
@media(max-width:650px){
  nav { flex-direction: column; padding:5px; }
  .hero{ flex-direction:column; text-align:center; padding: 16px 12px 30px 12px;}
  .hero-text, .hero-image{max-width:100%;opacity:1 !important;}
  .hero-text h1{font-size:1.3rem;}
  .services-section{ grid-template-columns: 1fr;}
  .about-section{ flex-direction:column; margin:13px;}
  .sticky-buttons{ right:8px; bottom:11px;}
}