* { box-sizing: border-box; }

body {
font-family: system-ui, sans-serif;
margin: 24px;
background: #f5f5f5;
padding: 0;
}

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

.pdf-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
gap: 16px;
}

.pdf-card {
background: #fff;
border-radius: 8px;
box-shadow: 0 1px 4px rgba(0,0,0,.1);
overflow: hidden;
display: flex;
flex-direction: column;
}

.pdf-card .thumb-wrap {
width: 100%;
text-align: center;
padding: 0;
background: #e8e8e8;
}

.pdf-card .thumb-wrap img {
width: 100%;
height: auto;
display: block;
}

.pdf-card .no-thumb {
display: flex;
align-items: center;
justify-content: center;
min-height: 140px;
color: #999;
font-size: 13px;
}

.pdf-card .info {
padding: 12px;
}

.pdf-card .name {
font-size: 14px;
font-weight: 600;
color: #222;
margin: 0 0 8px;
word-break: break-word;
line-height: 1.3;
}

.pdf-card a {
display: inline-block;
font-size: 13px;
color: #1976d2;
text-decoration: none;
}
.pdf-card a:hover { text-decoration: underline; }

.button24,
a.button24 {
	height: 40px;
	width: auto;
	display: inline-block;
	color: white;
	text-decoration: none;
	padding: 4pt 6pt;
	border-width: 2px 0;
	border-style: solid none;
	border-color: #FDBE33 #000 #D77206;
	border-radius: 6px;
	background: linear-gradient(#F3AE0F, #E38916) #E38916;
	transition: 0.2s;
	text-align: center;
	margin-top: 10px;
}
a.button24:hover { background: linear-gradient(#f5ae00, #f59500) #f5ae00; }
a.button24:active { background: linear-gradient(#f59500, #f5ae00) #f59500; }