#conteneur_oeuvres{
	max-width:1400px;
	margin:0 auto;
	padding:5px 20px 34px;
	box-sizing:border-box;
}

/* =========================
   TOP
   ========================= */

.lg-oeuvre-top{
	display:grid;
	grid-template-columns:minmax(0, 1.2fr) minmax(320px, .8fr);
	gap:18px;
	margin-bottom:22px;
	align-items:stretch;
}

.lg-oeuvre-panel{
	background:linear-gradient(to bottom,#ffffff 0%,#fcfaf6 100%);
	border:1px solid #eadfc7;
	border-radius:20px;
	padding:20px;
	box-shadow:
		0 14px 30px rgba(88,68,28,.07),
		0 2px 8px rgba(88,68,28,.04);
	box-sizing:border-box;
}

.lg-oeuvre-panel__head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	margin-bottom:10px;
}

.lg-oeuvre-panel__head h1{
	margin:0;
	font-size:28px;
	line-height:1.08;
	color:#231b12;
	letter-spacing:-.02em;
}

.lg-oeuvre-reset{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border:1px solid #dccba6;
	background:#f6f0e3;
	color:#6a4b17;
	border-radius:999px;
	padding:9px 14px;
	font-weight:700;
	text-decoration:none;
	transition:all .18s ease;
}

.lg-oeuvre-reset:hover{
	background:#efe4cc;
	transform:translateY(-1px);
	text-decoration:none;
	color:#6a4b17;
}

.lg-oeuvre-search__intro,
.lg-oeuvre-cloud__intro{
	margin:0 0 16px;
	font-size:15px;
	line-height:1.6;
	color:#6d604d;
}

.lg-oeuvre-fields{
	display:grid;
	grid-template-columns:1.4fr .8fr .8fr;
	gap:14px;
}

.lg-oeuvre-field--wide{
	grid-column:auto;
}

.lg-oeuvre-field label{
	display:block;
	margin:0 0 7px;
	font-size:13px;
	font-weight:bold;
	color:#7c6131;
}

.lg-oeuvre-field select,
.lg-oeuvre-field input{
	width:100%;
	height:46px;
	padding:0 14px;
	border:1px solid #decfb1;
	border-radius:14px;
	background:#fff;
	font-size:15px;
	color:#2c2418;
	box-sizing:border-box;
	outline:none;
	transition:border-color .18s ease, box-shadow .18s ease;
}

.lg-oeuvre-field select:focus,
.lg-oeuvre-field input:focus{
	border-color:#c89b3c;
	box-shadow:0 0 0 3px rgba(200,155,60,.14);
}

.lg-oeuvre-searchbox{
	position:relative;
}

.lg-oeuvre-actions{
	display:flex;
	align-items:center;
	gap:14px;
	margin-top:16px;
}

.lg-oeuvre-submit{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:46px;
	padding:0 22px;
	border:none;
	border-radius:999px;
	cursor:pointer;
	font-size:15px;
	font-weight:700;
	color:#fff;
	background:linear-gradient(180deg,#d9b36a 0%,#b98b34 100%);
	box-shadow:0 10px 22px rgba(126,88,24,.18);
	transition:transform .18s ease, box-shadow .18s ease;
}

.lg-oeuvre-submit:hover{
	transform:translateY(-2px);
	box-shadow:0 14px 26px rgba(126,88,24,.23);
}

.lg-oeuvre-link-reset{
	color:#6f5a34;
	font-weight:700;
	text-decoration:none;
}

.lg-oeuvre-link-reset:hover{
	color:#9c6508;
	text-decoration:underline;
}

.lg-oeuvre-search__hint{
	margin-top:14px;
	font-size:13px;
	line-height:1.5;
	color:#7a6a50;
}

/* =========================
   CLOUD
   ========================= */
.lg-oeuvre-cloud__list{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	align-content:flex-start;
	align-items:flex-start;
	min-height:230px;
}

.lg-oeuvre-cloud__label{
	font-size:12px;
	font-weight:bold;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#9a7337;
	margin:0 0 10px;
}

.lg-oeuvre-cloud h2{
	margin:0 0 8px;
	font-size:24px;
	line-height:1.12;
	color:#211a12;
	letter-spacing:-.02em;
}

.lg-oeuvre-cloud__list{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	align-content:flex-start;
	min-height:230px;
}

.lg-oeuvre-cloud__placeholder{
	width:100%;
	padding:16px 18px;
	border-radius:16px;
	border:1px dashed #d8c5a0;
	background:linear-gradient(180deg,#faf5ea 0%,#f4ead7 100%);
	font-size:14px;
	line-height:1.5;
	color:#7a6437;
	box-sizing:border-box;
}

.lg-oeuvre-cloud__pill{
	--weight:.35;
	display:inline-flex;
	align-items:center;
	gap:10px;
	padding:11px 14px;
	border:1px solid rgba(180,130,35,calc(.22 + var(--weight) * .58));
	border-radius:999px;
	background:
		linear-gradient(
			180deg,
			rgba(255,248,232,calc(.92 - var(--weight) * .18)) 0%,
			rgba(223,182,93,calc(.12 + var(--weight) * .68)) 100%
		);
	color:#4b3411;
	cursor:pointer;
	box-shadow:
		0 6px 16px rgba(88,68,28,calc(.04 + var(--weight) * .10)),
		inset 0 1px 0 rgba(255,255,255,.55);
	transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.lg-oeuvre-cloud__pill span{
	font-size:14px;
	font-weight:700;
	line-height:1.1;
}

.lg-oeuvre-cloud__pill strong{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:28px;
	height:28px;
	padding:0 8px;
	border-radius:999px;
	background:rgba(255,255,255,calc(.92 - var(--weight) * .18));
	font-size:12px;
	font-weight:700;
	line-height:1;
	color:#815b12;
	box-sizing:border-box;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.5);
}

.lg-oeuvre-cloud__pill:hover{
	transform:translateY(-2px);
	box-shadow:
		0 12px 24px rgba(88,68,28,calc(.08 + var(--weight) * .14)),
		inset 0 1px 0 rgba(255,255,255,.6);
	border-color:#b98420;
}

/* =========================
   RESULTS HEAD
   ========================= */
.lg-oeuvre-results{
	margin-bottom:34px;
}

.lg-oeuvre-results__head{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:14px;
	margin:0 0 14px;
}

.lg-oeuvre-results__head h2{
	margin:0;
	font-size:28px;
	line-height:1.1;
	color:#211a12;
	letter-spacing:-.02em;
}

.lg-oeuvre-results__sub{
	margin:6px 0 0;
	font-size:14px;
	color:#78684b;
}

.lg-oeuvre-count{
	font-size:14px;
	font-weight:bold;
	color:#8b6d37;
}

/* =========================
   GRID
   ========================= */

.lg-oeuvre-grid{
	display:grid;
	grid-template-columns:repeat(5, minmax(0, 1fr));
	gap:18px;
	align-items:stretch;
}

.oeuvre-card{
	position:relative;
	display:block;
	min-width:0;
	text-decoration:none;
	border-radius:18px;
	overflow:hidden;
	background:#f6f1e7;
	border:1px solid #e6dbc5;
	box-shadow:0 10px 22px rgba(0,0,0,.07);
	transition:transform .20s ease, box-shadow .20s ease, border-color .20s ease;
}

.oeuvre-card:hover{
	transform:translateY(-4px);
	box-shadow:0 16px 30px rgba(0,0,0,.13);
	border-color:#cfb17a;
	text-decoration:none;
}

.oeuvre-card__media{
	position:relative;
	display:block;
	aspect-ratio:4 / 5;
	background:#ece4d3;
	overflow:hidden;
}

.oeuvre-card__media img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .35s ease, filter .35s ease;
}

.oeuvre-card:hover .oeuvre-card__media img{
	transform:scale(1.05);
	filter:brightness(1.04);
}

.oeuvre-card__overlay{
	position:absolute;
	inset:0;
	background:linear-gradient(
		to top,
		rgba(22,18,12,.88) 0%,
		rgba(22,18,12,.24) 52%,
		rgba(22,18,12,0) 78%
	);
	pointer-events:none;
}

.oeuvre-card__body{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	z-index:2;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:5px;
	padding:13px;
	box-sizing:border-box;
}

.oeuvre-card__cat{
	display:inline-block;
	padding:4px 8px;
	border-radius:999px;
	background:rgba(255,255,255,.95);
	color:#6e4f18;
	font-size:10px;
	font-weight:bold;
	line-height:1;
}

.oeuvre-card__title{
	display:block;
	font-size:17px;
	line-height:1.12;
	font-weight:700;
	color:#fff;
	text-shadow:0 1px 4px rgba(0,0,0,.34);
}

.oeuvre-card__artist{
	display:block;
	font-size:13px;
	line-height:1.2;
	font-weight:700;
	color:rgba(255,255,255,.88);
	text-shadow:0 1px 4px rgba(0,0,0,.28);
}

/* =========================
   PAGINATION / EMPTY
   ========================= */

.lg-oeuvre-pagination{
	display:flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	gap:8px;
	margin:22px 0 34px;
}

.lg-oeuvre-page{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:42px;
	height:42px;
	padding:0 12px;
	border-radius:999px;
	border:1px solid #e1d2b3;
	background:#fff;
	color:#6b4b17;
	text-decoration:none;
	font-weight:700;
	box-sizing:border-box;
	transition:all .16s ease;
}

.lg-oeuvre-page:hover{
	border-color:#c89b3c;
	background:#fbf3e2;
	text-decoration:none;
}

.lg-oeuvre-page.is-current{
	border-color:#b98b34;
	background:linear-gradient(180deg,#d9b36a 0%,#b98b34 100%);
	color:#fff;
}

.lg-oeuvre-empty{
	margin:0;
	padding:18px 18px;
	border-radius:16px;
	background:#fff8f4;
	border:1px solid #efd6c8;
	color:#8a4d2b;
	font-size:14px;
	line-height:1.6;
}

/* =========================
   RESPONSIVE
   ========================= */

@media screen and (max-width: 1200px){
	.lg-oeuvre-grid{
		grid-template-columns:repeat(4, minmax(0, 1fr));
	}
}

@media screen and (max-width: 980px){
	#conteneur_oeuvres{
		padding:5px 14px 28px;
	}

	.lg-oeuvre-top{
		grid-template-columns:1fr;
	}

	.lg-oeuvre-fields{
		grid-template-columns:1fr 1fr;
	}

	.lg-oeuvre-field--wide{
		grid-column:1 / -1;
	}

	.lg-oeuvre-grid{
		grid-template-columns:repeat(4, minmax(0, 1fr));
	}
}

@media screen and (max-width: 760px){
	.lg-oeuvre-panel{
		padding:16px;
		border-radius:18px;
	}

	.lg-oeuvre-panel__head{
		flex-direction:column;
		align-items:flex-start;
	}

	.lg-oeuvre-panel__head h1,
	.lg-oeuvre-results__head h2{
		font-size:24px;
	}

	.lg-oeuvre-fields{
		grid-template-columns:1fr;
	}

	.lg-oeuvre-actions{
		flex-direction:column;
		align-items:stretch;
	}

	.lg-oeuvre-submit{
		width:100%;
	}

	.lg-oeuvre-grid{
		grid-template-columns:repeat(3, minmax(0, 1fr));
		gap:14px;
	}

	.oeuvre-card__title{
		font-size:15px;
	}
}

@media screen and (max-width: 520px){
	#conteneur_oeuvres{
		padding-left:10px;
		padding-right:10px;
	}

	.lg-oeuvre-cloud__list{
		gap:10px;
	}

	.lg-oeuvre-cloud__pill{
		padding:10px 12px;
	}

	.lg-oeuvre-grid{
		grid-template-columns:repeat(3, minmax(0, 1fr));
		gap:12px;
	}

	.oeuvre-card__body{
		padding:10px;
	}

	.oeuvre-card__title{
		font-size:14px;
	}

	.oeuvre-card__artist{
		font-size:12px;
	}
}