body { margin: 0; background: #163330; color: #14221f; font-family: Georgia, serif; }
.water { background: linear-gradient(#2c6b62, #173e39); color: #e7f3ef; padding: 1.4rem 8vw; }
.bank { background: #eadcc8; padding: 1.3rem 8vw 1.5rem 16vw; }
.bank.shift { padding-left: 8vw; padding-right: 18vw; }
.head { display: flex; align-items: center; gap: 1rem; }
.head img.mark { width: 92px; height: 92px; border-radius: 50%; object-fit: cover; margin-top: -8px; }
.head nav a { color: #e7f3ef; margin-right: 0.9rem; }
.water img, .bank img { width: min(100%, 640px); height: 220px; object-fit: cover; display: block; }
h1, h2 { margin: 0.4rem 0; }
p { line-height: 1.5; max-width: 42rem; }
@media (max-width: 700px) {
  .bank, .bank.shift { padding: 1rem 1rem 1.3rem; }
}