/* ===== Brand Tokens ===== */
:root{
  --bg:#f4f6f3;        /* page background */
  --ink:#1f2b24;       /* primary text */
  --leaf:#497752;      /* brand green */
  --leaf-contrast:#ffffff;
  --line:#dfe7e2;      /* subtle borders */
  --accent:#e88c4c;    /* warm accent */
}

/* ===== Reset / Base ===== */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{font-size:16px}       /* 12pt ≈ 16px */
body{
  background:var(--bg);
  color:var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height:1.6;
}
a{color:var(--leaf); text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--leaf); outline-offset:2px}

/* ===== Typography ===== */
h1,h2,h3,h4{
  font-family:"Nunito Sans", Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing:.2px;
  margin:0 0 .5rem;
}
p{margin:.5rem 0 1rem}
.small{font-size:.95rem; color:#4f5d56}

/* ===== Layout ===== */
.container{max-width:1120px;margin:0 auto;padding:0 1rem}

/* ===== Header / Nav ===== */
header{
  background:#fff;
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  gap:.75rem;padding:.75rem 0;
}
.brand{
  display:flex;align-items:center;gap:.5rem;font-weight:800;
  color:var(--ink);text-decoration:none;
}
.brand img{height:40px;width:auto;display:block}
.navlinks{display:flex;gap:1rem;align-items:center}
.navlinks a{
  color:var(--ink);text-decoration:none;padding:.5rem .25rem;border-radius:.5rem;
}
.navlinks a[aria-current="page"]{
  background:#e8efe9;
}
.nav-contact{
  display:inline-block;background:var(--leaf);color:var(--leaf-contrast);
  padding:.55rem .9rem;border-radius:.65rem;font-weight:700;text-decoration:none;
}

/* Mobile toggle */
.nav-toggle{display:none}
@media (max-width: 860px){
  .nav{flex-wrap:wrap}
  .nav-toggle{
    display:inline-flex;align-items:center;gap:.5rem;
    padding:.5rem .75rem;border:1px solid var(--line);
    border-radius:.5rem;background:#fff;color:var(--ink);
  }
  .navlinks{display:none;flex-direction:column;width:100%;padding:.5rem 0}
  .navlinks.open{display:flex}
  .navlinks a{padding:.6rem .25rem}
  .nav-contact{width:fit-content}
}

/* ===== Main / Sections ===== */
main{padding:3rem 0}
.hero{padding:3.25rem 0 2rem;text-align:center}
.hero h1{font-size:clamp(1.75rem,3.5vw,2.75rem)}
.hero p{max-width:60ch;margin:.5rem auto 1.25rem}
.cta-row{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}
.button{
  display:inline-block;padding:.65rem .95rem;border-radius:.7rem;font-weight:700;border:1px solid transparent;text-decoration:none
}
.button.primary{background:var(--leaf);color:#fff}
.button.secondary{background:#fff;border-color:var(--line);color:var(--ink)}
.section{padding:2rem 0;border-top:1px solid var(--line)}

/* ===== Accordion ===== */
.accordion{display:grid; gap:.5rem}
.accordion-item{
  background:#fff; border:1px solid var(--line); border-radius:.75rem; overflow:hidden;
}
.accordion-header{margin:0}
.accordion-button{
  width:100%; text-align:left; padding:1rem 1rem;
  background:#fff; border:0; display:flex; align-items:center; justify-content:space-between;
  font: inherit; font-weight:700; cursor:pointer;
}
.accordion-button:hover{background:#f9fbfa}
.accordion-button:focus-visible{outline:2px solid var(--leaf); outline-offset:2px}
.accordion-icon{flex:0 0 auto; transition:transform .2s ease}
.accordion-button[aria-expanded="true"] .accordion-icon{transform:rotate(90deg)}
.accordion-panel{padding:0 1rem 1rem}
.accordion-panel > p, .accordion-panel > ul{margin:.5rem 0 0}

/* ===== Footer ===== */
footer{
  background:var(--leaf);color:#fff;margin-top:2rem;
}
.footer-inner{padding:1.5rem 0}
.footer-grid{
  display:grid;gap:1rem;align-items:start;
  grid-template-columns:1fr; 
}
.footer-col h4{margin:0 0 .5rem;font-size:1.05rem}
.footer-links{display:flex;flex-wrap:wrap;gap:.75rem}
.footer-links a{color:#fff;text-decoration:none;opacity:.95}
.footer-links a:hover{text-decoration:underline;opacity:1}
.footer-note{opacity:.95;margin-top:.5rem}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.25);
  margin-top:1rem;padding-top:1rem;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:.75rem;
  font-size:.95rem;
}
@media (min-width: 860px){
  .footer-grid{grid-template-columns:1.25fr .75fr .75fr}
}

/* ===== Motion preference hook (no visual change, future-proof) ===== */
.prefers-reduced-motion * { scroll-behavior: auto; transition: none !important; animation: none !important; }

/* ===== Forms (added) ===== */
.contact-form [type="submit"]:disabled {
  opacity:.6;
  pointer-events:none;
}

.form-grid{display:grid;gap:1rem;grid-template-columns:1fr}
.form-field label{display:block;font-weight:700;margin-bottom:.35rem}
.form-field input,
.form-field textarea,
.form-field select{
  width:100%;background:#fff;border:1px solid var(--line);
  border-radius:.6rem;padding:.65rem .75rem;font:inherit;color:var(--ink);
}
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus{
  outline:2px solid var(--leaf);outline-offset:2px;
}
.form-field textarea{resize:vertical;min-height:150px;}
.form-actions{display:flex;gap:.75rem;align-items:center}
.form-span{grid-column:1/-1}

@media (min-width: 840px){
  .form-grid{grid-template-columns:1fr 1fr}
  .form-span{grid-column:1 / -1}
}
