:root{
 --green:#5b873d;--green2:#3d652b;--green3:#edf3e8;--gold:#d99a22;
 --ink:#303735;--muted:#69716d;--cream:#faf9f4;--white:#fff;
 --line:#e5e9e2;--shadow:0 18px 50px rgba(35,55,37,.10);
 --max:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;max-width:100%;overflow-x:hidden}
body{margin:0;font-family:'Outfit',Arial,Helvetica,sans-serif;color:var(--ink);background:var(--cream);line-height:1.6;max-width:100%;overflow-x:hidden}
a{text-decoration:none;color:inherit}.wrap{width:92%;max-width:var(--max);margin:auto}
.top{display:none}
@keyframes fadeDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
header{position:fixed;top:30px;left:0;width:100%;z-index:50;display:flex;justify-content:center}
.header-pill{position:relative;width:92%;max-width:var(--max);background:rgba(0,0,0,0.35);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,0.15);border-radius:999px;display:flex;align-items:center;justify-content:space-between;padding:10px 25px}
.logo{width:150px;filter:brightness(0) invert(1)}
.logo img{width:100%;height:auto;display:block}
nav{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600}
nav a{color:#fff;opacity:0.8;padding:9px 20px;border-radius:999px;transition:all 0.3s ease}
nav a:hover,nav a.nav-active{color:#222c26;background:#fff;opacity:1}
.header-actions{display:flex;align-items:center;gap:15px}
.nav-cta{padding:9px 22px;border-radius:999px;border:1px solid rgba(255,255,255,0.4);background:transparent;color:#fff!important;font-size:14px;font-weight:600;transition:all 0.3s ease}
.nav-cta:hover{background:#fff;color:#222c26!important}
.mobile{display:none;background:none;border:0;font-size:27px;color:#fff}

.hero.slider-container{height:100vh;min-height:600px;position:relative;overflow:hidden;background:#303735}
.slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 0.8s ease,visibility 0.8s ease;background-size:cover;background-position:center;display:flex;align-items:center}
.slide:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0.45)}
.slide.active{opacity:1;visibility:visible;z-index:2}
.slide .hero-content{position:relative;z-index:3;color:#fff;padding:105px 0 95px}
.slide .kicker{color:#dce7d8}
.slide h1,.slide h1 span{color:#fff}
.slide p.lead{color:#edf3e8}
.slider-controls{position:absolute;bottom:40px;right:4%;z-index:10;display:flex;gap:15px}
.slider-controls button{width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,0.3);background:rgba(0,0,0,0.3);color:#fff;font-size:20px;cursor:pointer;transition:background 0.3s ease;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center}
.slider-controls button:hover{background:var(--green);border-color:var(--green)}
.kicker{font-size:12px;text-transform:uppercase;letter-spacing:2.4px;color:var(--green2);font-weight:800}
h1{font-size:clamp(42px,6vw,72px);line-height:1.02;max-width:690px;margin:17px 0 22px;letter-spacing:-2px}
h1 span{color:var(--green)}
.lead{max-width:620px;color:#5e6662;font-size:19px;margin:0 0 30px}
.buttons{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;border-radius:999px;font-weight:800;font-size:14px; transition: transform 0.3s ease, background 0.3s ease;}
.btn:hover{transform: translateY(-2px);}
.primary{background:var(--green);color:#fff}.primary:hover{background:var(--green2)}
.secondary{border:1px solid #bcc8b8;background:#fff;color:var(--green2)}
.hero-note{margin-top:38px;display:flex;gap:22px;flex-wrap:wrap;font-size:13px;color:#5c6660}
.hero-note span{display:flex;align-items:center;gap:7px}.dot{width:8px;height:8px;border-radius:50%;background:var(--gold)}

section{padding:92px 0}.white{background:#fff}
.section-title{max-width:760px;margin-bottom:45px}.center{margin-left:auto;margin-right:auto;text-align:center}
.section-title .kicker{display:block;margin-bottom:9px}
h2{font-size:clamp(31px,4vw,46px);line-height:1.12;margin:0 0 15px;letter-spacing:-1px}
.section-title p{color:var(--muted);font-size:16px;margin:0}

.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.about-img{border-radius:26px;overflow:hidden;box-shadow:var(--shadow);position:relative}
.about-img img{width:100%;height:430px;object-fit:cover; transition: transform 0.5s ease;}
.about-img:hover img{transform: scale(1.05);}
.about-copy p{color:var(--muted)}
.signature{margin-top:28px;border-left:3px solid var(--gold);padding-left:17px;color:#56605b;font-weight:700}

.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
.pillar{background:#fff;padding:31px 27px;min-height:220px; transition: background 0.3s ease;}
.pillar:hover{background: var(--green3);}
.number{font-size:12px;color:var(--gold);font-weight:900;letter-spacing:1px}
.pillar h3{font-size:19px;margin:22px 0 8px}.pillar p{font-size:14px;color:var(--muted);margin:0}

.band{background:var(--green2);color:#fff}
.band-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center}
.band h2{max-width:650px}.band p{color:#dce7d8;max-width:650px}
.values{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.value{padding:21px;border:1px solid rgba(255,255,255,.2);border-radius:17px;background:rgba(255,255,255,.07); transition: transform 0.3s ease, background 0.3s ease;}
.value:hover{transform: translateY(-3px); background:rgba(255,255,255,.15);}
.value strong{display:block;font-size:15px;margin-bottom:4px}.ally-icon{font-size:42px;margin-bottom:15px;color:var(--green)}
.ally-icon svg{width:48px;height:48px;stroke:var(--green)}.value span{font-size:12px;color:#cfe0c9}

.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.project{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 10px 30px rgba(35,55,37,.06); transition: transform 0.3s ease, box-shadow 0.3s ease;}
.project:hover{transform: translateY(-5px); box-shadow:0 15px 40px rgba(35,55,37,.12);}
.project .photo{height:250px;width:100%;object-fit:cover;object-position:center;display:block;transition:transform 0.5s ease}
.project .body{padding:24px}
.tag{font-size:10px;text-transform:uppercase;letter-spacing:1.7px;color:var(--green);font-weight:900}
.project h3{margin:9px 0 8px;font-size:20px}.project p{margin:0;color:var(--muted);font-size:14px}

.ally{background:#f1f5ed}
.ally-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ally-card{background:#fff;border-radius:20px;padding:28px;border:1px solid #e4e9df; transition: transform 0.3s ease;}
.ally-card:hover{transform: translateY(-5px);}
.ally-card b{display:block;font-size:18px;margin-bottom:8px}.ally-card p{font-size:14px;color:var(--muted);margin:0}

.contact{padding:80px 0}
.contact-box{background:linear-gradient(120deg,#d99a22,#c88917);border-radius:30px;padding:55px 60px;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:30px;box-shadow:var(--shadow)}
.contact-box h2{max-width:700px}.contact-box p{max-width:650px;margin:0;color:#fff7e8}.contact-box .btn{background:#fff;color:var(--green2);white-space:nowrap}

footer{background:#f1f5ed;color:#4b5551;padding:55px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:50px}
.footer-logo{width:225px;margin-bottom:14px}
footer h3{color:#303735;font-size:15px;margin:0 0 13px}footer p,footer li{font-size:13px;color:#5e6662}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.copy{border-top:1px solid rgba(0,0,0,.08);margin-top:38px;padding-top:18px;font-size:11px;color:#69716d}

/* GSAP Utils */
.gsap-reveal { opacity: 0; visibility: hidden; }

@media(max-width:950px){
 nav{display:none;position:absolute;top:100%;left:0;width:100%;background:rgba(0,0,0,0.85);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-radius:24px;padding:25px;flex-direction:column;align-items:center;gap:15px;margin-top:10px;border:1px solid rgba(255,255,255,0.15)}
 .header-pill.nav-open nav{display:flex;animation:fadeDown 0.3s ease forwards}
 .mobile{display:block;cursor:pointer;outline:none}
 header{top:15px}
 .header-pill{padding:10px 20px}
 .about-grid,.band-grid,.hero-grid{grid-template-columns:1fr}
 .hero-content{padding:50px 0 20px}
 .pillars{grid-template-columns:1fr 1fr}.projects{grid-template-columns:1fr}
 .ally-grid{grid-template-columns:1fr 1fr}
 .hero{min-height:auto}
}
@media(max-width:600px){
 .logo{width:115px}
 .nav-cta{display:none}
 .header-pill{padding:8px 16px;width:92%}
 section{padding:50px 0}
 .buttons{flex-direction:column;width:100%}
 .buttons .btn{width:100%;text-align:center;justify-content:center}
 .slider-controls{bottom:25px;right:5%}
 .pillars,.ally-grid,.values{grid-template-columns:1fr}
 h1{font-size:clamp(32px,10vw,48px);letter-spacing:-1px;overflow-wrap:break-word}
 h2{font-size:30px;overflow-wrap:break-word}
 .lead{font-size:16px}
 .about-img img{height:260px}
 .contact-box{padding:35px 27px;display:block}.contact-box .btn{margin-top:22px}
 .footer-grid{grid-template-columns:1fr;gap:35px}
 .pillar{padding:24px}
 .project .photo{height:auto;aspect-ratio:16/9}
}