 
body {font-family: Arial, sans-serif; margin:0; padding:0; line-height:1.6; background:#fafafa;}
header {background:#222; color:#fff; padding:15px; text-align:center;}
header nav a {color:#fff; margin:0 10px; text-decoration:none; font-weight:bold;}
header nav a:hover {text-decoration:underline;}
.hero {background:#444; color:#fff; padding:60px 20px; text-align:center;}
.gallery {padding:40px 20px; text-align:center;}
.gallery-grid {display:grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); gap:10px; margin-top:20px;}
.gallery-grid img {width:100%; border-radius:8px;}
footer {background:#222; color:#fff; text-align:center; padding:20px; margin-top:40px;}
.contact-fixed {position:fixed; bottom:20px; right:20px; display:flex; flex-direction:column; gap:10px;}
.contact-fixed img {width:50px; height:50px; border-radius:50%; box-shadow:0 2px 5px rgba(0,0,0,0.3); transition:transform 0.2s;}
.contact-fixed img:hover {transform:scale(1.1);}
body {font-family: Arial, sans-serif; margin:0; padding:0; line-height:1.6; background:#fafafa;}
header {background:#222; color:#fff; padding:15px; text-align:center;}
header nav a {color:#fff; margin:0 10px; text-decoration:none; font-weight:bold;}
header nav a:hover {text-decoration:underline;}
.hero {background:#444; color:#fff; padding:60px 20px; text-align:center;}
.gallery {padding:40px 20px; text-align:center;}
.gallery-grid {display:grid; grid-template-columns: repeat(2, 1fr); gap:10px; margin-top:20px;}
.gallery-grid img {width:100%; border-radius:8px;}
footer {background:#222; color:#fff; text-align:center; padding:20px; margin-top:40px;}
.contact-fixed {position:fixed; bottom:20px; right:20px; display:flex; flex-direction:column; gap:10px;}
.contact-fixed img {width:50px; height:50px; border-radius:50%; box-shadow:0 2px 5px rgba(0,0,0,0.3); transition:transform 0.2s;}
.contact-fixed img:hover {transform:scale(1.1);}

@media (max-width: 600px) {
  .gallery-grid { grid-template-columns: 1fr; }
}
/* Gallery 2 cột – ảnh hiển thị đẹp, cân khung */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.gallery-item {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  cursor: pointer;
  transition: transform 0.3s ease;
}

.gallery-item:hover {
  transform: scale(1.02);
}

.gallery-item img {
  width: 100%;
  height: 400px;      /* cố định chiều cao khung */
  object-fit: cover;  /* fill khung, crop đều 4 phía */
  display: block;
}
.gallery-item img {
  width: 100%;
  height: auto;     /* chiều cao khung cố định */
  object-fit: contain; /* ảnh crop đều, nhìn gọn */
  display: block;
  border-radius: 8px;

