* {
  box-sizing: border-box;
  }

html {
scroll-behavior: smooth;
}

body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
color: #333;
background: #f7f7f5;
line-height: 1.6;
}

header {
text-align: center;
padding: 40px 20px 25px;
background: white;
border-bottom: 1px solid #ddd;
}

header h1 {
margin: 0;
font-family: Georgia, "Times New Roman", serif;
font-size: 2.4rem;
font-weight: normal;
letter-spacing: 0.05em;
}

.subtitle {
margin: 8px 0 0;
color: #777;
font-size: 1rem;
}

.menu {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 5px;
background: white;
padding: 0 15px 18px;
}

.menu a {
color: #444;
text-decoration: none;
padding: 7px 15px;
border-radius: 4px;
}

.menu a:hover,
.menu a.active {
background: #e8e8e3;
}

.years {
max-width: 1000px;
margin: 0 auto;
padding: 15px 20px;
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 4px 0;
border-bottom: 1px solid #ddd;
}

.years a {
color: #555;
text-decoration: none;
padding: 3px 10px;
font-size: 0.95rem;
border-right: 1px solid #ccc;
}

.years a:last-child {
border-right: none;
}

.years a:hover {
color: #000;
text-decoration: underline;
}

main {
max-width: 900px;
margin: 40px auto;
padding: 0 25px;
}

section {
background: white;
margin-bottom: 30px;
padding: 30px;
border: 1px solid #e2e2df;
}

h2 {
margin-top: 0;
font-family: Georgia, "Times New Roman", serif;
font-weight: normal;
color: #333;
}

a {
color: #555;
}

footer {
text-align: center;
padding: 30px 20px;
color: #888;
font-size: 0.9rem;
border-top: 1px solid #ddd;
}

@media (max-width: 600px) {


header {
    padding: 30px 15px 20px;
}

header h1 {
    font-size: 1.8rem;
}

.menu a {
    padding: 6px 10px;
}

.years {
    padding: 12px 10px;
}

.years a {
    padding: 3px 8px;
}

main {
    margin: 25px auto;
    padding: 0 12px;
}

section {
    padding: 20px;
}


}

.issues {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1000px;
    margin: 30px auto;
}

.issue {
    text-align: center;
}

.issue img {
    display: block;
    width: auto;
    height: 350px;
    margin: 0 auto;
}

@media (max-width: 700px) {
    .issues {
        grid-template-columns: 1fr;
    }
}