:root {
  --olive: #2d4a32;
  --leaf: #4a6b45;
  --clay: #b45a3c;
  --plaster: #e8dcc4;
  --tile: #f7f0e2;
  --ink: #243028;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: Tahoma, "Segoe UI", "Geeza Pro", sans-serif;
  background:
    radial-gradient(circle at 80% 0, rgba(180,90,60,.08), transparent 32%),
    var(--plaster);
  color: var(--ink);
  line-height: 1.85;
}
a { color: var(--clay); }
.ayvan {
  background: var(--olive);
  color: var(--tile);
  display: flex;
  justify-content: space-between;
  padding: 8px 6vw;
  font-size: 12px;
  letter-spacing: .08em;
}
.ayvan a { color: var(--tile); text-decoration: none; }
.sarv {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 6vw;
  background: var(--tile);
  border-bottom: 6px solid var(--clay);
}
.sarv img { width: 62px; height: 62px; }
.sarv h1 { margin: 0; font-size: 26px; color: var(--olive); }
.sarv h1 a { color: inherit; text-decoration: none; }
.sarv small { display: block; color: var(--clay); }
.jouy {
  display: flex;
  flex-wrap: wrap;
  background: #223628;
}
.jouy a {
  color: #f7f0e2;
  text-decoration: none;
  padding: 11px 16px;
  font-size: 14px;
}
.jouy a:hover, .jouy a.now { background: var(--clay); }
.hayat { width: min(980px, 92vw); margin: 28px auto 64px; }
.baghche {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 18px;
  align-items: stretch;
}
.baghche .sohan {
  background: var(--tile);
  padding: 28px 26px;
  border: 1px solid #d8c9a8;
}
.baghche h2 { margin: 0 0 12px; color: var(--olive); font-size: clamp(24px, 4vw, 36px); line-height: 1.3; }
.baghche img { width: 100%; height: 100%; object-fit: cover; border: 1px solid #d8c9a8; }
.kashi {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-top: 18px;
}
.kashi a {
  background: var(--tile);
  border: 1px solid #d8c9a8;
  padding: 18px 16px;
  text-decoration: none;
  color: inherit;
  border-top: 5px solid var(--leaf);
}
.kashi a:hover { border-top-color: var(--clay); }
.kashi h3 { margin: 0 0 6px; color: var(--olive); }
.safhe {
  background: var(--tile);
  border: 1px solid #d8c9a8;
  padding: 26px 28px;
}
.safhe h2 { margin-top: 0; color: var(--olive); }
.dokme {
  display: inline-block;
  background: var(--olive);
  color: #f7f0e2;
  text-decoration: none;
  padding: 8px 16px;
}
.paye {
  background: var(--olive);
  color: #d7e0d4;
  padding: 22px 6vw 32px;
  font-size: 13px;
}
.paye a { color: #f7f0e2; margin-left: 12px; }
@media (max-width: 760px) {
  .baghche, .kashi { grid-template-columns: 1fr; }
}