/* ----- Base / Reset-ish ----- */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;
  line-height:1.6;
  color:#0b1b2b;
  background:#f6f8fb;
}
img{max-width:100%;height:auto;display:block}
a{color:#0a7c66;text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1100px;margin:0 auto;padding:0 1rem}

/* ----- Header / Nav (inspired by clean product sites like chia.net) ----- */
.site-header{
  position:sticky;top:0;z-index:1000;
  backdrop-filter:saturate(180%) blur(8px);
  background:rgba(255,255,255,.85);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:.75rem;font-weight:600}
.brand img{width:40px;height:40px}
.brand span{white-space:nowrap;color:#0b1b2b}
.nav{display:flex;gap:1rem;align-items:center}
.nav a{padding:.5rem .75rem;border-radius:.5rem}
.nav a:hover{background:#e9f5f2}
.nav .cta{background:#0a7c66;color:white}
.nav .cta:hover{background:#096e5b}

/* ----- Hero ----- */
.hero{
  background: radial-gradient(1200px 500px at 20% -10%, #4980c3 0, rgba(215,239,232,0) 70%), 
              radial-gradient(1200px 500px at 110% 0%, #81add6 0, rgba(230,237,255,0) 70%), 
              #a4bdd7;
  color:#e9f5f2;
  padding:6rem 0 4rem;
  text-align:center;
}
.hero h1{font-size:clamp(1.3rem,3vw,2.2rem);margin:0 0 .5rem}
.hero p{margin:0 auto 1.8rem;max-width:700px;color:#cfe9e3}
.hero-logos{display:flex;gap:1rem;justify-content:center;align-items:center;opacity:.9}
.hero-logos img{width:72px;height:72px;background:white;border-radius:50%;padding:.5rem}

/* ----- Sections ----- */
.section{padding:4rem 0;background:#fff}
.section.alt{background:#f3f7fb}
.section h2{font-size:1.75rem;margin:0 0 1rem}
.grid-2{display:grid;gap:2rem;grid-template-columns:1.2fr .8fr}
@media (max-width:900px){.grid-2{grid-template-columns:1fr}}

/* Cards / utilities */
.card{
  background:white;border:1px solid rgba(0,0,0,.06);
  border-radius:12px;padding:1.25rem;
  box-shadow:0 10px 20px rgba(0,0,0,.04);
}
.cards{display:grid;gap:1.25rem;grid-template-columns:repeat(3,1fr)}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.cards{grid-template-columns:1fr}}
.btn{
  display:inline-block;padding:.7rem 1rem;border-radius:.6rem;
  background:#0a7c66;color:white;font-weight:600;border:0
}
.btn:hover{background:#096e5b}
.checks{padding-left:1.1rem}
.checks li{margin:.35rem 0}

/* Articles */
.posts{display:grid;gap:1.25rem}
.post{background:white;border:1px solid rgba(0,0,0,.06);border-radius:12px;padding:1.25rem}
.post h3{margin:.25rem 0}
.post .meta{font-size:.9rem;color:#5a7184}
.readmore{font-weight:600}

/* Lists */
.link-list{margin:0;padding-left:1.2rem}
.link-list li{margin:.25rem 0}

/* Contact */
.contact-form{display:grid;gap:.75rem}
.contact-form input,.contact-form textarea{
  width:100%;padding:.75rem;border-radius:.6rem;border:1px solid #c9d7e3;background:#f9fbfd
}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid #a9e0d2;border-color:#77c4b3}

/* Footer */
.site-footer{padding:2rem 0;background:#0f2236;color:#cfe3ff}
.site-footer p{margin:0;text-align:center}