/* WILFRIED — GALERIE */

.wilfried-gallery-page {
background: #080706;
color: rgba(255, 248, 235, 0.74);
}

.wilfried-gallery-hero {
border-bottom: 1px solid rgba(211, 165, 79, 0.3);
margin-block-start: 0;
}

.wilfried-gallery-hero::after {
background:
linear-gradient(
90deg,
rgba(0, 0, 0, 0.12),
rgba(0, 0, 0, 0.68) 72%
);
content: "";
inset: 0;
pointer-events: none;
position: absolute;
}

.wilfried-gallery-hero__content {
margin-left: auto !important;
margin-right: min(8vw, 9rem) !important;
max-width: 760px !important;
position: relative;
z-index: 2;
}

.wilfried-gallery-eyebrow,
.wilfried-gallery-section-number {
color: #dfae54;
font-size: 0.76rem;
font-weight: 800;
letter-spacing: 0.16em;
text-transform: uppercase;
}

.wilfried-gallery-hero__title {
color: #fff8eb;
font-size: clamp(4.8rem, 8vw, 8rem);
line-height: 0.9;
margin-top: 1.5rem;
}

.wilfried-gallery-hero__intro {
color: rgba(255, 248, 235, 0.86) !important;
line-height: 1.55;
max-width: 720px;
}

.wilfried-gallery-albums,
.wilfried-gallery-collection,
.wilfried-gallery-future {
padding-bottom: clamp(4rem, 7vw, 7rem);
padding-top: clamp(4rem, 7vw, 7rem);
}

.wilfried-gallery-albums {
background:
radial-gradient(
circle at 100% 10%,
rgba(127, 33, 28, 0.28),
transparent 34%
),
#090807;
}

.wilfried-gallery-collection {
background:
radial-gradient(
circle at 10% 10%,
rgba(131, 35, 29, 0.3),
transparent 34%
),
linear-gradient(
135deg,
#230d0b,
#080706
);
border-bottom: 1px solid rgba(211, 165, 79, 0.24);
border-top: 1px solid rgba(211, 165, 79, 0.24);
}

.wilfried-gallery-future {
background:
radial-gradient(
circle at 15% 50%,
rgba(211, 165, 79, 0.14),
transparent 32%
),
linear-gradient(
120deg,
#30110e,
#080706
);
}

.wilfried-gallery-heading {
margin-bottom: 3.5rem;
}

.wilfried-gallery-heading h2,
.wilfried-gallery-future h2 {
color: #fff8eb !important;
font-size: clamp(3rem, 5vw, 5.4rem) !important;
line-height: 1;
max-width: 1100px;
}

.wilfried-gallery-heading > p,
.wilfried-gallery-future p {
color: rgba(255, 248, 235, 0.7);
max-width: 980px;
}

.wilfried-gallery-album-grid {
display: grid;
gap: clamp(1.5rem, 3vw, 3rem);
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-left: auto;
margin-right: auto;
max-width: 1500px;
}

.wilfried-gallery-album-card {
appearance: none;
background:
linear-gradient(
180deg,
rgba(42, 28, 22, 0.98),
rgba(13, 10, 8, 0.99)
);
border: 1px solid rgba(211, 165, 79, 0.3);
border-radius: 20px;
color: #fff8eb;
cursor: pointer;
overflow: hidden;
padding: 1rem 1rem 2rem;
text-align: left;
transition:
border-color 220ms ease,
box-shadow 220ms ease,
transform 220ms ease;
}

.wilfried-gallery-album-card:hover {
border-color: rgba(226, 180, 93, 0.68);
box-shadow: 0 34px 75px rgba(0, 0, 0, 0.46);
transform: translateY(-5px);
}

.wilfried-gallery-album-card img {
aspect-ratio: 16 / 10;
border-radius: 13px;
object-fit: cover;
width: 100%;
}

.wilfried-gallery-album-card span {
display: block;
margin-left: 0.8rem;
margin-right: 0.8rem;
}

.wilfried-gallery-album-card__number {
color: rgba(226, 180, 93, 0.58);
font-size: 2.6rem;
font-weight: 800;
line-height: 1;
margin-top: 1.5rem;
}

.wilfried-gallery-album-card__title {
color: #e2b45d;
font-family: var(--wp--preset--font-family--display);
font-size: clamp(1.7rem, 2.1vw, 2.35rem);
line-height: 1.15;
margin-top: 1rem;
}

.wilfried-gallery-album-card__description {
color: rgba(255, 248, 235, 0.64);
line-height: 1.65;
margin-top: 1rem;
}

.wilfried-gallery-filters {
display: flex;
flex-wrap: wrap;
gap: 0.8rem;
margin: 0 auto 3rem;
max-width: 1500px;
}

.wilfried-gallery-filters button {
background: transparent;
border: 1px solid rgba(211, 165, 79, 0.42);
border-radius: 999px;
color: #fff8eb;
cursor: pointer;
font-weight: 700;
padding: 0.75rem 1.2rem;
}

.wilfried-gallery-filters button:hover,
.wilfried-gallery-filters button.is-active {
background: #d4a550;
border-color: #d4a550;
color: #17100b;
}

.wilfried-gallery-grid {
display: grid;
gap: 1.4rem;
grid-auto-flow: dense;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin: 0 auto;
max-width: 1500px;
}

.wilfried-gallery-item {
border: 1px solid rgba(211, 165, 79, 0.28);
border-radius: 17px;
color: inherit;
overflow: hidden;
position: relative;
text-decoration: none;
}

.wilfried-gallery-item[hidden] {
display: none;
}

.wilfried-gallery-item--wide {
grid-column: span 2;
}

.wilfried-gallery-item--portrait {
grid-row: span 2;
}

.wilfried-gallery-item figure {
height: 100%;
margin: 0;
min-height: 330px;
position: relative;
}

.wilfried-gallery-item img {
height: 100%;
inset: 0;
object-fit: cover;
position: absolute;
transition: transform 500ms ease;
width: 100%;
}

.wilfried-gallery-item--portrait figure {
min-height: 680px;
}

.wilfried-gallery-item:hover img {
transform: scale(1.045);
}

.wilfried-gallery-item figcaption {
background:
linear-gradient(
180deg,
transparent,
rgba(0, 0, 0, 0.9)
);
bottom: 0;
left: 0;
padding: 4rem 1.6rem 1.5rem;
position: absolute;
right: 0;
}

.wilfried-gallery-item figcaption span,
.wilfried-gallery-item figcaption strong {
display: block;
}

.wilfried-gallery-item figcaption span {
color: #dfae54;
font-size: 0.7rem;
font-weight: 800;
letter-spacing: 0.13em;
text-transform: uppercase;
}

.wilfried-gallery-item figcaption strong {
color: #fff8eb;
font-family: var(--wp--preset--font-family--display);
font-size: clamp(1.4rem, 2vw, 2rem);
line-height: 1.15;
margin-top: 0.45rem;
}

.wilfried-gallery-lightbox {
background: rgba(7, 6, 5, 0.97);
border: 1px solid rgba(211, 165, 79, 0.42);
border-radius: 18px;
color: #fff8eb;
height: min(88vh, 950px);
max-width: min(92vw, 1500px);
padding: 0;
width: 92vw;
}

.wilfried-gallery-lightbox::backdrop {
background: rgba(0, 0, 0, 0.88);
backdrop-filter: blur(8px);
}

.wilfried-gallery-lightbox figure {
align-items: center;
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
margin: 0;
padding: 3.5rem 5rem;
}

.wilfried-gallery-lightbox img {
max-height: calc(100% - 4rem);
max-width: 100%;
object-fit: contain;
}

.wilfried-gallery-lightbox figcaption {
color: #e2b45d;
font-family: var(--wp--preset--font-family--display);
font-size: 1.45rem;
margin-top: 1rem;
text-align: center;
}

.wilfried-gallery-lightbox button {
background: rgba(16, 12, 10, 0.76);
border: 1px solid rgba(255, 248, 235, 0.28);
border-radius: 999px;
color: #fff8eb;
cursor: pointer;
height: 48px;
position: absolute;
width: 48px;
z-index: 2;
}

.wilfried-gallery-lightbox__close {
right: 1rem;
top: 1rem;
}

.wilfried-gallery-lightbox__previous,
.wilfried-gallery-lightbox__next {
font-size: 2rem;
top: 50%;
transform: translateY(-50%);
}

.wilfried-gallery-lightbox__previous {
left: 1rem;
}

.wilfried-gallery-lightbox__next {
right: 1rem;
}

.wilfried-gallery-future .wp-block-columns {
gap: clamp(3rem, 8vw, 8rem);
}

.wilfried-gallery-future__list {
color: rgba(255, 248, 235, 0.76);
font-size: 1.08rem;
line-height: 1.8;
}

@media (max-width: 1000px) {
.wilfried-gallery-album-grid,
.wilfried-gallery-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wilfried-gallery-hero__content {
margin-left: auto !important;
margin-right: auto !important;
padding-left: 2rem;
padding-right: 2rem;
}
}

@media (max-width: 700px) {
.wilfried-gallery-album-grid,
.wilfried-gallery-grid {
grid-template-columns: 1fr;
}

.wilfried-gallery-item--wide {
grid-column: auto;
}

.wilfried-gallery-item--portrait {
grid-row: auto;
}

.wilfried-gallery-item figure,
.wilfried-gallery-item--portrait figure {
min-height: 430px;
}

.wilfried-gallery-future .wp-block-columns {
flex-direction: column;
}

.wilfried-gallery-future .wp-block-column {
flex-basis: 100% !important;
width: 100%;
}

.wilfried-gallery-lightbox figure {
padding: 4rem 1rem 2rem;
}
}
