:root{
  --green:#244E3C;
  --accent:#2F7B5E;
  --bg:#F5F7F5;
  --text:#13271d
}
*{box-sizing:border-box}
html,body{
  margin:0;
  padding:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Manrope,sans-serif;
  color:var(--text);
  background:var(--bg)
}
a{color:var(--accent);text-decoration:none}
img{max-width:100%;display:block;border-radius:16px}
.container{width:min(1100px,92%);margin:0 auto}

.site-header{
  position:sticky; top:0; background:#ffffffd9; backdrop-filter:blur(8px);
  border-bottom:1px solid #e7efe9; z-index:20
}
.logo{font-weight:800;color:var(--green);letter-spacing:.02em}
.nav a{margin-left:18px;font-weight:600;color:var(--text)}
.flex{display:flex}.between{justify-content:space-between}.center{align-items:center}

.hero{
  background-size:cover; background-position:center; padding:110px 0 140px;
  border-bottom:1px solid #e7efe9
}
.hero .brand{
  font-size:clamp(34px,6vw,68px); line-height:1.04; margin:0 0 12px; color:#fff;
  text-shadow:0 3px 6px rgba(0,0,0,.5); letter-spacing:.1em; font-weight:800
}
.hero p{color:#eef7f1}

.page-header{padding:80px 0 20px;border-bottom:1px solid #e7efe9}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.split{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;margin:48px auto}

.card{background:#fff;border:1px solid #e7efe9;border-radius:16px;padding:20px}
.card.soft{background:#f8fbf9}

/* przyciski */
.btn{
  background:#3f8b6f; color:#fff; padding:12px 18px; border-radius:12px;
  font-weight:700; display:inline-block; text-align:center
}
.btn.ghost{ background:#2F7B5E; color:#fff; border:none }
.btn:hover, .btn.ghost:hover{ filter:brightness(0.92) }

.cta-row{display:flex;gap:12px;margin-top:10px}
.cta-row.centered{justify-content:center}

/* delikatny pas tła użyty dla Latest Advice */
.stripe{
  background:#eaf2ed; border-top:1px solid #e0ebe4; border-bottom:1px solid #e0ebe4;
  padding:36px 0; margin:36px 0 64px 0; /* większy odstęp w dół */
}

/* większa przerwa przed Why Green Albion */
.wide-gap{ margin-top:16px; }

/* GALERIE I MINIATURY – JEDNAKOWE PROPORCJE */
/* kafel ma stałe proporcje, obraz przycięty (bez zniekształceń) */
.gallery .tile{
  aspect-ratio: 4 / 3; /* nowoczesne przeglądarki */
  overflow:hidden; border-radius:16px; display:block
}
.gallery .tile img{
  width:100%; height:100%; object-fit:cover; border-radius:0;
  transition:transform .3s ease
}
.gallery .tile:hover img{ transform:scale(1.03) }

/* blog cards równych wysokości */
.equal-cards > * { display:flex; flex-direction:column }
.equal-cards .card { height:100% }

/* feedback buttons */
.feedback{ display:flex; gap:10px; align-items:center; margin-top:8px }
.feedback button{
  padding:8px 10px; border-radius:10px; border:1px solid #dfe8e3; background:#fff; cursor:pointer
}
.feedback button:hover{ filter:brightness(0.96) }
.feedback .thanks{ display:none; color:#2F7B5E; font-weight:600; margin-left:6px }

/* stopka */
.site-footer{
  margin-top:56px; padding:34px 0; background:#fff; border-top:1px solid #e7efe9
}
.site-footer .tiny{font-size:.85rem;color:#667}
.row{display:flex;gap:10px}
input,textarea{
  width:100%; padding:12px 14px; border-radius:12px; border:1px solid #dfe8e3; background:#fff
}

/* responsywność */
@media (max-width:900px){
  .grid,.grid-3{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
}
@media (max-width:640px){
  .grid,.grid-3,.grid-2{grid-template-columns:1fr}
  .nav a{margin-left:12px}
  /* przyciski jeden pod drugim */
  .cta-row{flex-direction:column}
  .cta-row a{width:100%}
}