body {
  margin:0; font-family: 'Segoe UI', sans-serif; background:#fff; color:#222;
}
header {
  display:flex; justify-content:space-between; align-items:center;
  padding:15px 40px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,0.1);
}
header .logo { font-size:1.4rem; font-weight:700; }
nav a { margin-left:20px; text-decoration:none; color:#444; font-weight:500; }

.hero {
  position:relative; height:420px;
  background:url('hero.jpg') center/cover no-repeat;
  border-radius:12px; margin:20px; overflow:hidden;
}
.overlay {
  position:absolute; top:0; left:0; width:100%; height:100%;
  background:rgba(0,0,0,0.45);
}
.hero-content {
  position:relative; z-index:2; color:#fff; text-align:center;
  top:50%; transform:translateY(-50%);
}
.hero-content h1 { font-size:3rem; margin-bottom:10px; }
.sub { font-size:1.1rem; opacity:0.9; }

.section { padding:40px; text-align:center; }
.section h2 { font-size:2rem; margin-bottom:10px; }