body {
    font-family: 'Georgia', serif;
    text-align: center;
    padding: 50px;
    /* Layered background: pottery wheel (left-bottom), kiln (right-top), then a soft paper color */
    background-image:
        url('images/pottery-wheel.jpg'),
        url('images/kiln.jpg'),
        linear-gradient(#f9f9f9, #f2efe9);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: left 5% bottom 5%, right 5% top 10%, center;
    background-size: 30% auto, 28% auto, cover;
    color: #333;
    /* Keep content readable on top of images */
    position: relative;
}

/* subtle translucent overlay to ensure contrast when images are vivid */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.75);
    pointer-events: none;
    z-index: 0;
}

/* ensure main content sits above the overlay */
body > * {
    position: relative;
    z-index: 1;
}

h1 {
    font-size: 2.5em;
    margin-bottom: 20px;
}

p {
    font-size: 1.2em;
    line-height: 1.6;
}

a {
    color: #8B4513; /* Saddle brown for pottery theme */
    text-decoration: none;
    font-weight: bold;
}

a:hover {
    text-decoration: underline;
}

.joke {
    font-style: italic;
    margin: 30px 0;
}

.copyright {
    font-size: 0.9em;
    margin-top: 50px;
}

/* logo styling */
.logo {
    max-width: 220px;
    height: auto;
    display: block;
    margin: 0 auto 20px;
}

/* navigation styling */
nav {
    margin: 20px 0;
}

nav a {
    margin: 0 15px;
    color: #8B4513;
    text-decoration: none;
    font-weight: bold;
}

nav a:hover {
    text-decoration: underline;
}