body {
  margin: 0;
  padding: 0;
  font-family: 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', Arial, sans-serif;
  background: linear-gradient(135deg, #4e3d19 0%, #7a5f2a 100%);
  color: #f8f6e1;
}
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 32px 8vw 18px 8vw;
  background: rgba(99, 81, 36, 0.93);
  box-shadow: 0 4px 24px 0 rgba(64,50,17,0.12);
}
.logo {
  font-size: 2.3rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #bfa057;
  text-shadow: 0 1px 8px #7a5f2a66;
}
nav ul {
  display: flex;
  list-style: none;
  gap: 3vw;
  margin: 0;
  padding: 0;
}
nav a {
  text-decoration: none;
  color: #f5e4ba;
  font-size: 1.13rem;
  transition: color 0.18s;
}
nav a:hover {
  color: #ffe281;
}
.hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 64px 8vw 48px 8vw;
  min-height: 55vh;
  background: linear-gradient(105deg, #4c370d 0%, #7a6123 97%);
}
.hero-content{
  max-width: 510px;
}
.hero-content h1 {
  font-size: 2.7rem;
  margin-bottom: 14px;
  background: linear-gradient(93deg, #d1ad5e 5%, #a87b21 95%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-content p {
  font-size: 1.1rem;
  letter-spacing: 0.04em;
  color: #e8c97c;
}
.hero-image img {
  width: 320px;
  height: 320px;
  border-radius: 40% 60% 70% 30%/50% 57% 43% 50%;
  box-shadow: 0 10px 48px #7a6123aa, 0 0 0 12px #33290b;
  object-fit: cover;
  background: #65531c;
}
.about, .contact {
  max-width: 900px;
  margin: 58px auto;
  padding: 0 8vw;
  text-align: center;
}
.about h2, .gallery h2, .contact h2 {
  font-size: 1.7rem;
  color: #e1c77e;
  margin-bottom: 18px;
  font-weight: 600;
}
.about p {
  color: #f5e4bacf;
  font-size: 1.12rem;
}
.gallery {
  background: linear-gradient(115deg,#6b562740 0%, #736143b0 100%);
  padding: 48px 8vw 36px 8vw;
  text-align: center;
}
.gallery-images {
  display: flex;
  justify-content: center;
  gap: 34px;
  margin-top: 22px;
}
.gallery-images img {
  width: 210px;
  height: 210px;
  object-fit: cover;
  border-radius: 25% 75% 58% 42%/50% 35% 65% 50%;
  box-shadow: 0 8px 38px #c1a46999, 0 0 0 4px #7a5c2388;
  background: #998742;
}
.contact a {
  color: #e2cd92;
  text-decoration: underline;
}
.contact a:hover {
  color: #ffe281;
}
.footer {
  text-align: center;
  padding: 25px 0 20px 0;
  background: #654b1a;
  color: #e7d5ada0;
  font-size: 0.98rem;
  margin-top: 60px;
}
@media (max-width: 798px) {
  .hero {flex-direction: column;align-items: flex-start;}
  .hero-image img{width:210px;height:210px;margin-top:32px;}
  .gallery-images{flex-direction:column;gap:24px;}
}