:root{
  --bg: #F6F7F1;
  --bg-panel: #EEF1E6;
  --ink: #10241A;
  --ink-soft: #3C4A40;
  --ink-dim: #6E7C71;
  --green: #3F7D32;
  --green-deep: #1F3A1A;
  --logo-navy: #0B3D5D;
  --logo-green: #14A87C;
  --teal: #235C5A;
  --line: #D9DED0;
  --line-strong: #C7D0BE;
  --white: #FFFFFF;
  --radius: 3px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Inter', sans-serif; font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
img{max-width:100%; display:block;}
.mono{font-family:'Inter', sans-serif; font-weight:600; letter-spacing:0.06em;}
.display{font-family:'Fraunces', serif;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}

.tag{
  font-family:'Inter', sans-serif; font-weight:600; font-size:11.5px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--teal); display:inline-flex; align-items:center; gap:8px;
}
.tag .dot{width:6px; height:6px; background:var(--green); border-radius:50%;}

/* NAV */
header{
  position:sticky; top:0; z-index:30;
  background:rgba(246,247,241,0.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
nav{display:flex; align-items:center; justify-content:space-between; padding:20px 32px; max-width:1180px; margin:0 auto;}
.logo{font-family:'Poppins', sans-serif; font-weight:800; font-size:20px; letter-spacing:0.01em; color:var(--logo-navy);}
.logo .dot-mark{color:var(--logo-green);}
a.logo{text-decoration:none;}
.navlinks{display:flex; gap:30px; font-size:13.5px;}
.navlinks a{text-decoration:none; color:var(--ink-soft); transition:color .15s;}
.navlinks a:hover{color:var(--ink);}
.navcta{
  font-family:'Inter', sans-serif; font-size:13px; font-weight:600; text-decoration:none;
  padding:10px 18px; border:1px solid var(--line-strong); color:var(--ink); border-radius:var(--radius);
  transition:border-color .15s, background .15s;
}
.navcta:hover{border-color:var(--green); background:rgba(63,125,50,0.07);}

/* HERO */
.hero{position:relative; min-height:82vh; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden;}
.hero-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 38%;}
.hero-scrim{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(246,247,241,0.12) 0%, rgba(246,247,241,0.5) 45%, rgba(246,247,241,0.97) 90%);
}
.hero-inner{position:relative; padding-top:120px; padding-bottom:56px;}
h1{
  font-family:'Fraunces', serif; font-weight:500;
  font-size:clamp(34px, 4.6vw, 58px); line-height:1.08; margin:0 0 20px;
  color:var(--green-deep); letter-spacing:-0.01em; max-width:28ch;
}
.hero p.lead{font-size:17.5px; color:var(--ink-soft); max-width:52ch; margin:0 0 34px;}
.ctas{display:flex; gap:14px; flex-wrap:wrap;}
.btn{
  display:inline-block; text-decoration:none; font-size:14px; font-weight:600;
  padding:14px 24px; border-radius:var(--radius); font-family:'Inter', sans-serif;
}
.btn-primary{background:var(--green-deep); color:var(--white);}
.btn-primary:hover{background:var(--green);}
.btn-ghost{border:1px solid var(--line-strong); color:var(--ink);}
.btn-ghost:hover{border-color:var(--green);}

/* SECTION shared */
section{padding:100px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head .tag{margin-bottom:16px;}
h2{font-family:'Fraunces', serif; font-weight:500; font-size:clamp(26px,3vw,36px); margin:0 0 16px; color:var(--green-deep); letter-spacing:-0.01em;}
.section-head p{color:var(--ink-soft); font-size:16px; margin:0; max-width:56ch;}
.bg-panel{background:var(--bg-panel);}

/* ABOUT */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
.about-copy{max-width:56ch; display:flex; flex-direction:column; gap:16px;}
.about-copy p{color:var(--ink-soft); font-size:16px; margin:0;}
@media (max-width:860px){.about-grid{grid-template-columns:1fr; gap:32px;}}

/* SPEC / SYSTEM */
.spec-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.spec-img{border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);}
.spec-table{width:100%; border-collapse:collapse; font-family:'Inter', sans-serif; font-size:14px;}
.spec-table tr{border-bottom:1px solid var(--line);}
.spec-table tr:first-child{border-top:1px solid var(--line);}
.spec-table td{padding:16px 4px;}
.spec-table td:first-child{color:var(--ink-dim); width:52%;}
.spec-table td:last-child{color:var(--ink); font-weight:600; text-align:right;}
.spec-note{margin-top:24px; font-size:13.5px; color:var(--ink-soft); line-height:1.65;}
.spec-note strong{color:var(--ink); font-weight:600;}

/* ADOPTION / INSTALLATIONS */
.adopt-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:36px;}
.adopt-card img{width:100%; height:210px; object-fit:cover; border-radius:var(--radius); margin-bottom:18px;}
.adopt-card h4{font-family:'Fraunces', serif; font-weight:500; font-size:18px; margin:0 0 8px; color:var(--ink);}
.adopt-card p{font-size:13.5px; color:var(--ink-soft); margin:0;}
@media (max-width:860px){.adopt-grid{grid-template-columns:1fr; gap:32px;}}

/* CONTACT */
.contact{display:grid; grid-template-columns:1fr 1fr; gap:64px;}
.contact form{display:flex; flex-direction:column; gap:14px;}
.contact input, .contact select, .contact textarea{
  padding:13px 15px; border:1px solid var(--line-strong); border-radius:var(--radius);
  font-family:'Inter', sans-serif; font-size:14px; background:var(--white); color:var(--ink);
}
.contact input::placeholder, .contact textarea::placeholder{color:var(--ink-dim);}
.contact textarea{min-height:100px; resize:vertical;}
.contact button{
  align-self:flex-start; background:var(--green-deep); color:var(--white); border:none;
  padding:14px 26px; font-size:14px; font-weight:600; border-radius:var(--radius); cursor:pointer; font-family:'Inter', sans-serif;
}
.contact button:hover{background:var(--green);}
.contact button:disabled{opacity:0.6; cursor:default;}
.form-error{font-size:13px; color:#B3261E; margin-top:2px;}
.form-success{
  font-family:'Fraunces', serif; font-weight:500; font-size:18px; color:var(--green-deep);
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); padding:26px;
}
.hq-block{display:flex; flex-direction:column; gap:14px; margin-bottom:24px; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.hq-line{font-size:14px; color:var(--ink-soft); display:flex; gap:14px; align-items:baseline; flex-wrap:wrap;}
.hq-label{font-family:'Inter', sans-serif; font-weight:600; letter-spacing:0.06em; font-size:11px; color:var(--ink-dim); min-width:120px;}
.hq-line b{color:var(--ink); font-weight:600;}
.gate{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px; font-size:14px; color:var(--ink-soft);
}
.gate strong{display:block; color:var(--ink); font-size:16px; margin-bottom:8px; font-family:'Fraunces', serif; font-weight:500;}

footer{border-top:1px solid var(--line); padding:36px 0; font-size:12.5px; color:var(--ink-dim);}
footer .fwrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
.footer-links{display:flex; gap:10px; align-items:center;}
.footer-links a{color:var(--ink-dim); text-decoration:none;}
.footer-links a:hover{color:var(--ink);}

/* LEGAL DOC PAGES (privacy / terms) */
.doc-hero{padding:64px 0 40px; border-bottom:1px solid var(--line);}
.doc-hero .tag{margin-bottom:16px;}
.doc-hero h1{font-size:clamp(30px,4vw,44px); max-width:none; margin:0 0 12px;}
.doc-updated{font-size:13px; color:var(--ink-dim);}
.doc{padding:56px 0 100px;}
.doc-wrap{max-width:760px; margin:0 auto;}
.doc h2{font-size:clamp(20px,2.4vw,24px); margin:40px 0 14px;}
.doc h2:first-child{margin-top:0;}
.doc p{color:var(--ink-soft); margin:0 0 16px; line-height:1.75;}
.doc ul{color:var(--ink-soft); margin:0 0 16px; padding-left:22px; line-height:1.75;}
.doc li{margin-bottom:8px;}
.doc strong{color:var(--ink); font-weight:600;}
.doc a{color:var(--teal); text-decoration:underline;}

@media (max-width:860px){
  .spec-grid{grid-template-columns:1fr; gap:32px;}
  .contact{grid-template-columns:1fr;}
  section{padding:72px 0;}
  .hero-inner{padding-top:88px; padding-bottom:48px;}
  .contact input, .contact select, .contact textarea{font-size:16px;}
}

@media (max-width:600px){
  .wrap{padding:0 20px;}
  nav{padding:16px 20px;}
  .navlinks{display:none;}
  section{padding:56px 0;}
  .hero-inner{padding-top:64px; padding-bottom:40px;}
}
