/* HERO */

.hero{
    height:100vh;
    padding: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    position: relative;
    overflow: hidden; /* important */
}

/* background flouté */
.hero::before{
    content: "";
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;

    background:url("/sources/imgs/works/max.png") center/cover no-repeat;

    filter: blur(8px);
    transform: scale(1.1); /* évite les bords blancs */

    z-index: -1;
}
.hero .title_container{
	width: 100%;
	background:rgba(0,0,0,0.5);
	padding: 40px;

}
.hero h1{
	font-family:"Playfair Display";
	font-size:60px;
	/* padding:40px 40px; */
}

/* SECTIONS */

section{
	padding:100px 10%;
}

.section-title{
	font-size:36px;
	margin-bottom:40px;
	font-family:"Playfair Display";
}

.section-title::after{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background-color: #d4a373;
}


/* GALLERY */

.gallery{
	padding: 100px 10%;
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
	gap:25px;
}

.gallery .item h2
{
	display: none;
	font-size: 22px;
	letter-spacing: 2px;
	font-family: "Playfair Display";
	text-align: center;
	padding-bottom: 10px;
}

.artwork{
	position:relative;
	cursor:pointer;
}

.artwork img{
	width:100%;
	height:300px;
	object-fit:cover;
	border-radius:10px;
	transition:0.4s;
}

.artwork:hover img{
	transform:scale(1.05);
	filter: blur(5px);
}

.overlay{
	position:absolute;
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	color: white;
	text-align: center;
	bottom:0;
	background:rgba(0,0,0,0.6);
	width:100%;
	height: 0;
	padding:15px;
	opacity:0;
	transition:0.7s;
	border-radius:0 0 10px 10px;
}

.overlay .work-name{
	font-family:"Playfair Display";
}

.artwork:hover .overlay{
	opacity:1;
	width:101%;
	height: 101%;
	transform:scale(1.05);
	margin: auto;
}

/* ABOUT */

.about {
    overflow: hidden;
    padding: 80px 40px;
    /* max-width: 1000px; */
    margin: 0 auto;
}

.about .img-wrap {
    float: left;
    width: 35vw;
    max-width: 600px;
    min-width: 220px;
    position: relative;
    margin-right: 50px;
    margin-bottom: 20px;
}

.about .img-wrap::after {
    content: "";
    position: absolute;
    inset: 10px -10px -10px 10px;
    border: 1px solid #d4a373;
    border-radius: 14px;
    z-index: -1;
}

.about img {
    border-radius: 10px;
    width: 100%;
    display: block;
    position: relative;
    z-index: 1;
}

.about .p-next-img {
    color: #aaa;
    font-size: 15px;
    line-height: 1.9;
    font-weight: 300;
}

.about .p-next-img p {
    margin-bottom: 20px;
}

/* EXHIBITIONS */

.exhibitions{
	background:#1b1b1b;
	display: flex;
	width: 100%;
	justify-content: space-around;
	flex-wrap: wrap;
}
.exhibitions .section{
	padding: 30px 0;
}

.exhibition-item{
	margin-bottom:10px;
}

/* CONTACT */

.contact{
	text-align:center;
}

.contact input,
.contact textarea{
	width:80%;
	max-width:500px;
	padding:12px;
	margin:10px;
	border:none;
	border-radius:5px;
}

button{
	padding:12px 30px;
	background:#d4a373;
	border:none;
	color:white;
	cursor:pointer;
	font-size:16px;
}



/* MOBILE */

@media(max-width:768px){

	section{
		padding: 50px 20px;
	}

	.gallery{
		padding: 10px 20px;
	}
	.gallery .item h2
	{
		display: block;
	}

	.about{
		grid-template-columns:1fr;
	}

	.hero h1{
		font-size:40px;
	}
	.about {
		padding: 10px;
	}
	.about .img-wrap{
		width: 80vw;
		float: none;
	}
}