/* tuiles.css Début */
/* Affichage en tuiles */
/* S'adapte à la largeur de la fenêtre */
/* R. Delhaye - 2026 */

.tuiles {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 1.5rem;
	padding: 0;
	list-style: none;
}
.tuile {
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,.08);
	transition: transform .2s;
}
.tuile:hover {
	transform: translateY(-4px);
}
.tuile a {
	display: block;
	color: inherit;
	text-decoration: none;
	padding: 1rem;
}
.tuile img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 6px;
}
@media screen and (max-width: 1000px) {
	.tuiles { grid-template-columns: 1fr 1fr 1fr; }
}
@media screen and (max-width: 700px) {
	.tuiles { grid-template-columns: 1fr 1fr; }
}
@media screen and (max-width: 500px) {
	.tuiles { grid-template-columns: 1fr; }
}
@media screen and (hover: none) and (pointer: coarse) {
	.tuiles { grid-template-columns: 1fr; }
}
@media screen and (hover: none) and (pointer: coarse) and (min-width:1000px) {
	.tuiles { grid-template-columns: 1fr 1fr; }
}
/* tuiles.css Fin */