:root{--g:#063b1a;--g2:#2c7a1f;--lime:#72aa25;--cream:#f4efdf;--brown:#3a2115;--gold:#ffd22a;--ink:#111813}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff}
a{color:inherit;text-decoration:none}
img{display:block}
.site-header{height:82px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 4%;border-bottom:1px solid #e7ebe5;position:relative;z-index:20}
.brand{display:flex;align-items:center;gap:9px;color:var(--g);font-size:25px;font-weight:950;letter-spacing:-1.2px;white-space:nowrap}
.brand-mark{width:43px;height:43px}
.brand b{color:#6da51d}.brand small{font-size:10px}
.nav{display:flex;align-items:center;gap:25px;font-size:13px;font-weight:900}
.nav-call{background:var(--g);color:#fff!important;border-radius:999px;padding:12px 18px}
.mobile-menu{display:none;border:0;background:#eef1ed;color:var(--g);border-radius:25px;width:50px;height:40px;font-size:25px}

/* THE POSTER-LIKE HOMEPAGE */
.poster{width:100%;overflow:hidden;background:var(--cream)}
.hero{width:100%;display:grid;grid-template-columns:46% 54%;min-height:720px}
.hero-copy{background:var(--cream);padding:62px 5% 45px 7%;position:relative;z-index:4}
.kicker{font-size:11px;letter-spacing:2.5px;font-weight:950;color:#679d25;margin:0 0 13px}
.hero-title{font-size:clamp(60px,6.4vw,98px);line-height:.84;letter-spacing:-5px;font-weight:950;color:var(--g);margin:0}
.hero-title .brown{color:var(--brown)}
.hero-title .service-word{display:inline-block;background:var(--g);color:#fff;padding:8px 18px 11px;margin-top:9px;font-size:.66em;letter-spacing:-2px}
.area-label{display:flex;align-items:center;gap:10px;color:var(--g);font-size:12px;font-weight:950;margin-top:28px}
.area-label i{width:34px;height:4px;background:var(--g);border-radius:8px}
.service-list{width:95%;margin-top:27px;background:linear-gradient(100deg,var(--g),var(--g2));border-radius:0 20px 20px 0;overflow:hidden;box-shadow:0 12px 28px #063b1a1f}
.service-link{min-height:48px;padding:5px 12px;display:flex;align-items:center;gap:11px;color:#fff;border-bottom:1px solid #ffffff30;font-size:13px;font-weight:950;transition:all .15s}
.service-link:last-child{border-bottom:0}
.service-link:hover{background:#0c6425;color:#e2f494;padding-left:18px}
.service-icon{width:35px;height:35px;border-radius:50%;background:#fff;color:var(--g);display:grid;place-items:center;font-size:17px;flex:0 0 35px}
.service-arrow{margin-left:auto;font-size:25px}
.hero-photo{position:relative;min-height:720px;overflow:hidden}
.hero-photo>img{width:100%;height:100%;object-fit:cover;object-position:52% 43%}
.hero-photo:before{content:"";position:absolute;z-index:2;left:0;top:0;bottom:0;width:18%;background:linear-gradient(90deg,var(--cream),transparent);pointer-events:none}
.badge{position:absolute;z-index:6;right:5%;top:28px;width:185px;height:185px;border-radius:50%;border:5px solid var(--lime);background:#063b1bf2;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 14px 30px #0005}
.badge strong{font-size:18px;line-height:1.05}.badge em{color:var(--gold);font-size:11px;font-weight:900;margin-top:11px}
.circle-row{position:absolute;z-index:8;left:7%;bottom:-77px;display:flex;gap:10px}
.circle{width:155px;height:155px;border-radius:50%;border:6px solid #fff;overflow:hidden;box-shadow:0 10px 25px #0004;background:#ddd}
.circle img{width:100%;height:100%;object-fit:cover}

/* lower sections */
.promise{position:relative;background:var(--cream);padding:116px 5% 38px}
.promise:before{content:"";position:absolute;left:-5%;right:-5%;top:-52px;height:100px;background:var(--cream);border-radius:50% 50% 0 0}
.promise-title{position:relative;text-align:center;font:italic 40px "Trebuchet MS",Arial,sans-serif;color:#17351e;margin:0 0 48px}
.promise-title:before,.promise-title:after{content:"";display:inline-block;width:55px;height:3px;background:#6da51d;margin:0 15px 11px}
.promise-grid{max-width:1080px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr)}
.promise-card{text-align:center;padding:0 42px 28px;border-right:1px dashed #aab2a9}
.promise-card:last-child{border-right:0}
.promise-icon{width:63px;height:63px;margin:auto;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-size:28px;font-weight:900}
.promise-card h2{font-size:18px;color:var(--g);margin:12px 0 7px}
.promise-card p{font-size:13px;line-height:1.5;color:#5a655d;margin:0}
.contact{background:var(--g);color:#fff;padding:25px 5%}
.contact-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1fr}
.contact-box{display:flex;align-items:center;gap:16px;padding:0 42px}
.contact-box+ .contact-box{border-left:1px solid #ffffff35}
.contact-icon{width:61px;height:61px;border-radius:50%;background:#6da51d;display:grid;place-items:center;font-size:28px;flex:none}
.contact-box small{display:block;font-size:11px;font-weight:950;letter-spacing:1px}
.contact-box strong{display:block;color:var(--gold);font-size:30px;line-height:1.05}
.contact-box span{font-size:12px}
.footer{background:#031b0c;color:#dce8df;padding:28px 5%}
.footer-inner{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}.footer a{color:#bde85c;font-weight:900}

/* inner pages */
.inner-hero{background:var(--g);color:#fff;padding:70px 6%}
.inner-hero h1{font-size:clamp(44px,6vw,76px);line-height:.95;letter-spacing:-3px;margin:10px 0 15px}
.inner-hero h1 span{color:#bde85c}.inner-hero p{max-width:780px;color:#dce9df;font-size:18px;line-height:1.65}
.inner-body{background:#f4f7f3;padding:65px 6%}.inner-grid{max-width:1100px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:22px}
.card{background:#fff;border:1px solid #dce5da;border-radius:20px;padding:30px;box-shadow:0 10px 25px #063b1a0b}
.card h2{margin-top:0;color:var(--g)}.card p{line-height:1.7;color:#59645d}
.btn{display:inline-block;padding:13px 18px;border-radius:9px;font-weight:950}.btn-green{background:var(--g);color:#fff}.btn-lime{background:#b9df35;color:var(--g)}

/* responsive */
@media(max-width:900px){
 .nav{display:none}.mobile-menu{display:block}
 .hero{grid-template-columns:1fr}
 .hero-copy{padding:46px 5% 25px}
 .hero-photo{height:520px;min-height:520px}
 .circle-row{left:auto;right:3%;bottom:-65px}
 .circle{width:125px;height:125px}
 .inner-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
 .site-header{height:64px;padding:0 3%}
 .brand{font-size:18px}.brand-mark{width:34px;height:34px}
 .hero-copy{padding:38px 0 20px}
 .hero-title{font-size:51px;letter-spacing:-2.8px}
 .kicker{font-size:10px}
 .area-label{font-size:10px;margin-top:22px}.area-label i{width:22px;height:3px}
 .service-list{width:100%;margin-top:22px;border-radius:0 19px 19px 0}
 .service-link{min-height:40px;font-size:11px;padding:4px 8px}
 .service-icon{width:29px;height:29px;flex-basis:29px;font-size:14px}
 .hero-photo{height:390px;min-height:390px}
 .badge{width:130px;height:130px;right:5px;top:12px;border-width:4px}
 .badge strong{font-size:12px}.badge em{font-size:9px;margin-top:7px}
 .circle-row{right:2%;bottom:-48px;gap:4px}
 .circle{width:92px;height:92px;border-width:4px}
 .promise{padding:70px 5% 25px}
 .promise-title{font-size:27px;margin-bottom:32px}
 .promise-title:before,.promise-title:after{width:22px;margin:0 7px 8px}
 .promise-grid{grid-template-columns:1fr}
 .promise-card{border-right:0;border-bottom:1px dashed #aab2a9;padding:0 20px 25px;margin-bottom:25px}
 .promise-card:last-child{border-bottom:0}
 .contact-grid{grid-template-columns:1fr}
 .contact-box{padding:12px 0}
 .contact-box+.contact-box{border-left:0;border-top:1px solid #ffffff35}
 .contact-box strong{font-size:23px}
 .contact-icon{width:53px;height:53px;font-size:23px}
}

/* V12 interactive circular service buttons */
.circle-row .circle{
  position:relative;
  cursor:pointer;
  transform:translateZ(0);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  animation:serviceFloat 4.8s ease-in-out infinite;
}
.circle-row .circle:nth-child(2){animation-delay:.55s}
.circle-row .circle:nth-child(3){animation-delay:1.1s}
.circle-row .circle:hover{
  transform:translateY(-12px) scale(1.07);
  box-shadow:0 18px 35px #0006,0 0 0 6px #b9df35aa;
  border-color:#b9df35;
}
.circle-row .circle:active{transform:translateY(-4px) scale(1.02)}
.circle-row .circle:after{
  content:"VIEW SERVICE";
  position:absolute;inset:auto 8px 8px;
  background:#063b1ee8;color:#fff;
  border-radius:999px;padding:6px 4px;
  font-size:9px;font-weight:950;letter-spacing:.6px;text-align:center;
  opacity:0;transform:translateY(8px);transition:.22s ease;
}
.circle-row .circle:hover:after{opacity:1;transform:translateY(0)}
@keyframes serviceFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
.contact-actions{
  max-width:1200px;margin:0 auto;padding:28px 0 4px;
  display:flex;flex-wrap:wrap;justify-content:center;gap:12px
}
.contact-action{
  display:inline-flex;align-items:center;gap:9px;
  border-radius:999px;padding:12px 17px;
  font-size:13px;font-weight:950;
  background:#fff;color:#063b1a;
  transition:.18s ease;box-shadow:0 6px 15px #0002
}
.contact-action:hover{transform:translateY(-3px);box-shadow:0 10px 20px #0003}
.contact-action.whatsapp{background:#25d366;color:#fff}
.contact-action.email{background:#fff;color:#063b1a}
.social-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.social-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:44px;border-radius:50%;
  background:#063b1a;color:#fff;font-weight:950;
  transition:.18s ease
}
.social-btn:hover{transform:translateY(-4px) scale(1.06);background:#6da51d}
.map-wrap{max-width:1100px;margin:28px auto 0;border-radius:22px;overflow:hidden;box-shadow:0 14px 32px #063b1a1a;background:#ddd}
.map-wrap iframe{width:100%;height:420px;border:0;display:block}
.map-note{max-width:1100px;margin:10px auto 0;color:#647067;font-size:13px}
@media(max-width:600px){
 .circle-row .circle:after{display:none}
 .contact-actions{justify-content:stretch}
 .contact-action{flex:1 1 100%;justify-content:center}
 .map-wrap iframe{height:330px}
}

/* V13 NAV MICRO-INTERACTIONS */
.nav{gap:10px}
.nav>a:not(.nav-call){
 position:relative;padding:12px 13px;border-radius:12px;
 transition:transform .2s ease,color .2s ease,background .2s ease,box-shadow .2s ease;
}
.nav>a:not(.nav-call):before{
 content:"";position:absolute;left:14px;right:14px;bottom:7px;height:3px;
 border-radius:99px;background:linear-gradient(90deg,#72aa25,#b9df35);
 transform:scaleX(0);transform-origin:center;transition:transform .22s ease;
}
.nav>a:not(.nav-call):after{
 content:"";position:absolute;inset:3px;border-radius:12px;
 background:linear-gradient(135deg,#72aa2515,transparent);
 opacity:0;transition:opacity .2s ease;pointer-events:none;
}
.nav>a:not(.nav-call):hover{
 color:var(--g);transform:translateY(-3px);
 background:#f4f7ee;box-shadow:0 8px 18px #063b1a18;
}
.nav>a:not(.nav-call):hover:before{transform:scaleX(1)}
.nav>a:not(.nav-call):hover:after{opacity:1}
.nav-call{transition:transform .2s ease,box-shadow .2s ease}
.nav-call:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 10px 22px #063b1a35}
.nav-active{background:#f4f7ee!important;color:var(--g)!important;box-shadow:0 8px 18px #063b1a12}
.nav-active:before{transform:scaleX(1)!important}
.mobile-menu{transition:transform .2s ease,box-shadow .2s ease}.mobile-menu:hover{transform:scale(1.06);box-shadow:0 7px 15px #063b1a20}

/* V13 SERVICE DIRECTORY */
.service-directory{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.service-card{position:relative;overflow:hidden;background:#fff;border:1px solid #dfe7dd;border-radius:22px;box-shadow:0 12px 30px #063b1a0b;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.service-card:hover{transform:translateY(-7px);box-shadow:0 20px 42px #063b1a18;border-color:#a8c77c}
.service-card-media{height:220px;overflow:hidden;position:relative}
.service-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.service-card:hover .service-card-media img{transform:scale(1.06)}
.service-badge{position:absolute;left:16px;top:16px;background:#fff;color:var(--g);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:20px;box-shadow:0 8px 16px #0003}
.service-card-body{padding:24px 24px 25px}
.service-card h2{margin:0 0 9px;color:var(--g);font-size:24px}
.service-card p{margin:0 0 12px;color:#59645d;line-height:1.65;font-size:14px}
.service-card ul{margin:0 0 20px;padding-left:18px;color:#344038;line-height:1.75;font-size:13px}
.service-card .service-cta{display:inline-flex;align-items:center;gap:8px;background:var(--g);color:#fff;padding:11px 15px;border-radius:999px;font-weight:950;font-size:12px;transition:.2s}
.service-card .service-cta:hover{background:var(--lime);color:var(--g);transform:translateX(4px)}
.service-intro{text-align:center;max-width:760px;margin:0 auto 34px}
.service-intro h1{font-size:clamp(42px,6vw,72px);color:var(--g);margin:0 0 10px;letter-spacing:-3px}
.service-intro p{color:#5b675f;line-height:1.7}
.service-note{margin:34px auto 0;max-width:1200px;background:var(--g);color:#fff;border-radius:20px;padding:24px 28px;display:flex;justify-content:space-between;gap:20px;align-items:center}
.service-note strong{font-size:20px}.service-note a{background:var(--gold);color:var(--g);font-weight:950;border-radius:999px;padding:12px 18px;white-space:nowrap}

/* V13 GALLERY */
.gallery-intro{text-align:center;max-width:760px;margin:0 auto 24px}
.gallery-intro h1{font-size:clamp(42px,6vw,72px);color:var(--g);margin:0 0 10px;letter-spacing:-3px}
.gallery-intro p{color:#5b675f;line-height:1.7}
.gallery-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 auto 26px}
.gallery-filter{border:1px solid #cbd8c7;background:#fff;color:var(--g);padding:9px 14px;border-radius:999px;font-size:12px;font-weight:950;cursor:pointer;transition:.18s}
.gallery-filter:hover,.gallery-filter.active{background:var(--g);color:#fff;border-color:var(--g);transform:translateY(-2px)}
.gallery-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.gallery-card{border-radius:18px;overflow:hidden;background:#fff;border:1px solid #dfe7dd;box-shadow:0 10px 24px #063b1a0b;cursor:pointer;transition:.25s}
.gallery-card:hover{transform:translateY(-6px);box-shadow:0 18px 35px #063b1a18}
.gallery-image{height:230px;overflow:hidden;position:relative}
.gallery-image img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.gallery-card:hover img{transform:scale(1.07)}
.gallery-overlay{position:absolute;inset:auto 0 0;padding:18px 15px 13px;background:linear-gradient(transparent,#063b1ae8);color:#fff}
.gallery-overlay strong{display:block;font-size:15px}.gallery-overlay span{font-size:11px;color:#d9efae}
.lightbox{position:fixed;inset:0;background:#03120ddd;z-index:999;display:none;align-items:center;justify-content:center;padding:28px}
.lightbox.open{display:flex}
.lightbox-panel{width:min(1050px,96vw);max-height:92vh;background:#0b160e;border:1px solid #ffffff25;border-radius:20px;overflow:hidden;box-shadow:0 30px 80px #0008;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr)}
.lightbox-media{min-height:520px;background:#000;display:flex;align-items:center;justify-content:center}
.lightbox-media img{max-width:100%;max-height:75vh;width:auto;height:auto;object-fit:contain}
.lightbox-info{padding:30px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.lightbox-info h2{margin:0 0 10px;font-size:28px;color:#c8eb76}.lightbox-info p{color:#d5ddd6;line-height:1.65}
.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:0;background:#fff;color:var(--g);width:44px;height:44px;border-radius:50%;font-size:25px;cursor:pointer;box-shadow:0 10px 20px #0005}
.lightbox-close{right:20px;top:20px}.lightbox-prev{left:22px;top:50%;transform:translateY(-50%)}.lightbox-next{right:22px;top:50%;transform:translateY(-50%)}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:var(--lime)}
@media(max-width:900px){
 .service-directory{grid-template-columns:1fr}.gallery-grid{grid-template-columns:repeat(2,1fr)}
 .lightbox-panel{grid-template-columns:1fr;max-height:92vh;overflow:auto}.lightbox-media{min-height:300px}.lightbox-info{padding:22px}
 .lightbox-prev{left:8px}.lightbox-next{right:8px}
}
@media(max-width:600px){
 .nav>a:not(.nav-call){padding:8px}.service-card-media{height:190px}.gallery-grid{grid-template-columns:1fr}.gallery-image{height:240px}
 .service-note{flex-direction:column;align-items:flex-start}.service-note a{white-space:normal}
}

.svg-icon{width:21px;height:21px;display:block}
.service-icon .svg-icon{width:21px;height:21px}
.contact-icon .svg-icon{width:27px;height:27px}
.contact-box{cursor:pointer}
.contact-box:hover .contact-icon{transform:scale(1.08);background:#b9df35;color:#063b1a}
.contact-icon{transition:transform .2s ease,background .2s ease,color .2s ease}

/* V14.1 MOBILE NAVIGATION */
.mobile-menu{position:relative;z-index:100;border:0;cursor:pointer}
@media(max-width:900px){
  .site-header{position:sticky;top:0;z-index:1000}
  .mobile-menu[aria-expanded="true"]{background:#063b1a;color:#fff}
  .mobile-nav-panel{
    display:none;position:fixed;left:0;right:0;top:64px;z-index:999;
    background:#fff;border-bottom:1px solid #dce6d8;
    box-shadow:0 16px 35px #063b1a25;padding:10px 12px 15px;
  }
  .mobile-nav-panel.open{display:block;animation:menuDrop .18s ease-out}
  .mobile-nav-panel a{
    display:flex;align-items:center;justify-content:space-between;
    min-height:48px;padding:0 14px;border-radius:12px;
    color:#063b1a;font-size:14px;font-weight:950;
    transition:.18s;
  }
  .mobile-nav-panel a:hover,.mobile-nav-panel a:active{background:#edf5e5;color:#2c7a1f}
  .mobile-nav-panel .mobile-call{margin-top:7px;background:#063b1a;color:#fff;justify-content:center}
  .mobile-nav-panel .mobile-call:hover{background:#2c7a1f;color:#fff}
  .nav-overlay{display:none;position:fixed;inset:64px 0 0;background:#03120d55;z-index:998}
  .nav-overlay.open{display:block}
}
@keyframes menuDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* V14.2 FINAL RESPONSIVE NAV FIX
   Desktop: only the normal horizontal navigation is visible.
   Mobile: only the hamburger + mobile drawer is visible.
*/
.mobile-nav-panel{display:none!important}
.nav-overlay{display:none!important}
@media(max-width:900px){
  .nav{display:none!important}
  .mobile-menu{display:grid!important;place-items:center}
  .mobile-nav-panel.open{display:block!important}
  .nav-overlay.open{display:block!important}
}
@media(min-width:901px){
  .mobile-menu{display:none!important}
  .mobile-nav-panel,.nav-overlay{display:none!important}
}