body { margin:0; font-family: Arial, sans-serif; color:#333; }
#hero { position:relative; height:100vh; overflow:hidden; }
#hero video { width:100%; height:100%; object-fit:cover; }
.hero-overlay { position:absolute; top:0; left:0; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; background:rgba(0, 0, 0, 0); color:white; text-align:center; }
.hero-buttons .btn { background:#ff7f50; padding:10px 20px; margin:5px; color:white; text-decoration:none; border-radius:5px; }
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:10px; padding:20px; }
.gallery-grid img { width:100%; border-radius:8px; }
form { display:flex; flex-direction:column; max-width:400px; margin:auto; padding:20px; }
form input, form textarea { margin-bottom:10px; padding:10px; font-size:16px; border-radius:5px; border:1px solid #ccc; }
form button { background:#ff7f50; color:white; padding:10px; font-size:16px; border:none; border-radius:5px; cursor:pointer; }
p {
  font-family: Georgia, serif;
  margin: 10px 0;
}

.highlight {
  color: red;
}

.split-section {
  display: grid;
  grid-template-columns: 1fr 2fr; /* 33% / 66% */
  gap: 20px;
}

.split-section img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
}

/* Make right container positioning context */
.right-image {
  position: relative;
}

/* Overlay styling */
.image-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: white;
  padding: 20px;
  background: rgba(0, 0, 0, 0.35); /* subtle dark overlay */
  border-radius: 10px;
}

/* Optional: nicer typography */
.image-overlay h1 {
  margin: 0 0 10px 0;
  font-size: 2rem;
}

.image-overlay p {
  margin: 0;
  font-size: 1.1rem;
}