/* === BASE === */
html{scroll-behavior:smooth;scroll-padding-top:6rem}
body{overflow-x:hidden}
::selection{background:#bbf7d0;color:#14401a}
img{max-width:100%;height:auto}

/* === NAV: always on top === */
#nav{z-index:9999!important;position:fixed}

/* === NAV: SOLID (internal pages) — always white bg, dark text === */
.nav-solid{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.nav-solid .nav-link{font-size:.875rem;font-weight:500;color:#475569;padding:.5rem 1rem;border-radius:.5rem;transition:all .2s}
.nav-solid .nav-link:hover{color:#2e7031;background:rgba(76,175,80,.08)}
.nav-solid .nav-active{color:#2e7031!important;background:rgba(76,175,80,.1)}
.nav-solid .hamburger-line{background:#1e293b}

/* === NAV: HOME — transparent initially, white on scroll === */
.nav-home{background:transparent;box-shadow:none}
.nav-home .nav-link{font-size:.875rem;font-weight:500;color:rgba(255,255,255,.85);padding:.5rem 1rem;border-radius:.5rem;transition:all .2s}
.nav-home .nav-link:hover{color:#fff;background:rgba(255,255,255,.12)}
.nav-home .nav-active{color:#fff!important;background:rgba(255,255,255,.15)}
.nav-home .hamburger-line{background:#fff}

/* Home nav scrolled → becomes solid */
.nav-home.nav-scrolled{background:rgba(255,255,255,.97);backdrop-filter:blur(16px);box-shadow:0 1px 3px rgba(0,0,0,.06)}
.nav-home.nav-scrolled .nav-link{color:#475569}
.nav-home.nav-scrolled .nav-link:hover{color:#2e7031;background:rgba(76,175,80,.08)}
.nav-home.nav-scrolled .nav-active{color:#2e7031!important;background:rgba(76,175,80,.1)}
.nav-home.nav-scrolled .hamburger-line{background:#1e293b}

/* === MOBILE MENU === */
.mobile-link{font-size:.95rem;font-weight:500;color:#475569;padding:.75rem 1rem;border-radius:.75rem;transition:all .2s}
.mobile-link:hover,.mobile-active{color:#2e7031;background:rgba(76,175,80,.08)}

.hamburger-line{display:block;width:20px;height:2px;border-radius:2px;transition:all .3s}
.menu-open .hamburger-line:nth-child(1){transform:rotate(45deg) translate(3px,3px)}
.menu-open .hamburger-line:nth-child(2){opacity:0}
.menu-open .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(3px,-3px)}
.menu-open .hamburger-line{background:#1e293b!important}

/* === HERO LAYERS: image(1) < overlay(2) < blob(3) < content(10) === */
#hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:100px;background:linear-gradient(to top,#fff,transparent);pointer-events:none;z-index:4}
.hero-bg{position:absolute;inset:0;z-index:1}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;z-index:2}
.hero-blob{position:absolute;top:0;left:0;width:500px;height:200px;background:radial-gradient(ellipse at top left,rgba(255,255,255,.5) 0%,rgba(255,255,255,.2) 30%,transparent 60%);z-index:3;pointer-events:none}
.hero-content{position:relative;z-index:10}
@media(max-width:768px){.hero-blob{width:320px;height:160px}}

/* === CARDS === */
.value-card{background:#fff;border-radius:1rem;padding:2rem;border:1px solid #f1f5f9;transition:all .3s}
.value-card:hover{border-color:#bbf7d0;box-shadow:0 8px 30px rgba(76,175,80,.1);transform:translateY(-2px)}

.service-card{background:#fafffe;border:1px solid #f0fdf4;border-radius:1.25rem;padding:1.75rem;text-align:center;transition:all .3s;display:block}
.service-card:hover{border-color:#bbf7d0;box-shadow:0 12px 40px rgba(76,175,80,.12);transform:translateY(-4px)}

.team-card{background:#fff;border:1px solid #f1f5f9;border-radius:1.5rem;padding:2rem;transition:all .3s}
.team-card:hover{border-color:#bbf7d0;box-shadow:0 8px 30px rgba(76,175,80,.08)}

/* === FAQ === */
.faq-item{border-radius:1rem;overflow:hidden;transition:all .3s}
.faq-item[open]{background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.06)}
.faq-item[open] summary{border-color:#bbf7d0}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::marker{display:none}

/* === REVEAL === */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* === TESTIMONIALS === */
.testimonial-slide{display:none}
.testimonial-slide.active{display:block;animation:fadeSlide .5s ease}
@keyframes fadeSlide{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* === FLOATING WA === */
#wa-float span:last-of-type{animation:pulseWa 2s infinite}
@keyframes pulseWa{0%,100%{box-shadow:0 4px 14px rgba(37,211,102,.4)}70%{box-shadow:0 4px 14px rgba(37,211,102,.15),0 0 0 12px rgba(37,211,102,0)}}

#back-top.show{opacity:1;pointer-events:auto}

/* === FOOTER === */
.footer-social{width:2.5rem;height:2.5rem;background:rgba(255,255,255,.08);border-radius:9999px;display:flex;align-items:center;justify-content:center;transition:all .2s}
.footer-social:hover{background:#4caf50;transform:scale(1.1)}

/* === SCROLL PROGRESS === */
#scroll-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,#4caf50,#2e7031);z-index:10000;transition:width .1s linear;width:0}

/* === FOCUS === */
a:focus-visible,button:focus-visible{outline:2px solid #4caf50;outline-offset:2px;border-radius:4px}

/* === SPA TRANSITIONS === */
#spa-content{transition:opacity .2s ease;opacity:1}

/* === LAZY IMAGES === */
img[loading="lazy"]{opacity:0;transition:opacity .4s ease}
img[loading="lazy"].loaded,img[loading="eager"]{opacity:1}