<!-- =========================
        stylesheet.css
========================= -->
@font-face{
  font-family:"AvenirNext";
  src:local("Avenir Next"), local("AvenirNext");
  font-weight:300 700;
  font-display:swap;
}

:root{
  --accent:#3D6023;
  --accent-dark:#324E1C;
  --bg:#F9FAFC;
  --text:#111;
  --muted:#666;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"AvenirNext","Avenir","Nunito","Segoe UI","Helvetica Neue",sans-serif;
  line-height:1.6;
}

header{
  position:sticky;
  top:0;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(8px);
  box-shadow:0 2px 4px rgba(0,0,0,.04);
  z-index:10;
}

.nav{
  max-width:1100px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:.75rem 1rem;
}

.nav a{
  margin-left:1.25rem;
  text-decoration:none;
  color:var(--muted);
  font-weight:500;
  transition:color .2s;
}
.nav a:hover{ color:var(--accent-dark); }

section{
  max-width:1000px;
  margin:0 auto;
  padding:4rem 1rem;
}
/* offset for sticky header on first section */
section:first-of-type{ padding-top:6rem; }

section h2{
  font-size:2rem;
  margin-bottom:1.5rem;
  position:relative;
}
section h2::after{
  content:'';
  position:absolute;
  left:0; bottom:-6px;
  width:60px; height:4px;
  background:var(--accent);
  border-radius:2px;
}

.about{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  align-items:center;
}
.about img{
  width:100%;
  border-radius:1rem;
  object-fit:cover;
  box-shadow:0 8px 16px rgba(0,0,0,.06);
}

.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:1.5rem;
}
.card{
  background:#fff;
  padding:1.5rem;
  border-radius:1rem;
  box-shadow:0 4px 10px rgba(0,0,0,.04);
  transition:transform .2s, box-shadow .2s;
}
.card:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 20px rgba(0,0,0,.06);
}
.card h3{ margin:0 0 .5rem; }
.card span{ display:block; margin-bottom:.75rem; color:var(--muted); font-size:.9rem; }

.news-list{ list-style:none; padding:0; margin:0; }
.news-item{ margin-bottom:1rem; }
.news-date{ font-size:.85rem; color:var(--muted); margin-right:.5rem; white-space:nowrap; }

.btn-primary{
  display:inline-block;
  background:var(--accent);
  color:#fff;
  padding:.6rem 1.4rem;
  border:none;
  border-radius:.5rem;
  font-weight:600;
  text-decoration:none;
  transition:background .2s;
}
.btn-primary:hover{ background:var(--accent-dark); }

.news-toggle{
  margin-top:1rem;
  font-size:.875rem;
  cursor:pointer;
}

footer{
  background:#fff;
  text-align:center;
  padding:2rem 1rem;
  color:var(--muted);
  font-size:.9rem;
}

@media(max-width:760px){
  .about{ grid-template-columns:1fr; }
  .nav a{ margin-left:.75rem; }
}