.lch-evenements-prives-collage {
--lch-ec-bg: #f9f8f4;
--lch-ec-ink: #2a2622;
--lch-ec-gold: #b8924a;
--lch-ec-gap: #ffffff;
position: relative;
isolation: isolate;
overflow-x: clip;
background: var(--lch-ec-bg);
color: var(--lch-ec-ink);
padding: clamp(2.75rem, 6vw, 4.75rem) 0 clamp(3.5rem, 7vw, 5.5rem);
font-family: "Outfit", system-ui, sans-serif;
}
.lch-evenements-prives-collage__inner {
width: min(1280px, calc(100% - 2.5rem));
margin: 0 auto;
box-sizing: border-box;
}
.lch-evenements-prives-collage__title,
.wpcursor-component.lch-evenements-prives-collage .lch-evenements-prives-collage__title,
.lch-evenements-prives-collage h2.lch-evenements-prives-collage__title {
margin: 0 auto 1.85rem !important;
max-width: 16ch;
text-align: center;
font-family: "Cormorant Garamond", Georgia, serif !important;
font-weight: 500 !important;
font-size: clamp(1.95rem, 3.5vw, 2.85rem) !important;
line-height: 1.16 !important;
color: var(--lch-ec-ink) !important;
text-wrap: balance;
}
.lch-evenements-prives-collage__title-accent,
.wpcursor-component.lch-evenements-prives-collage .lch-evenements-prives-collage__title-accent {
font-family: "Cormorant Garamond", Georgia, serif !important;
display: inline !important;
margin-left: 0.22em !important;
color: var(--lch-ec-gold) !important;
font-style: italic !important;
font-weight: 500 !important;
}
.lch-evenements-prives-collage__grid {
display: grid;
grid-template-columns: 1.2fr 1fr 0.78fr 1fr;
grid-template-rows: 1fr 1fr;
gap: 0.55rem;
min-height: min(70vh, 40rem);
background: var(--lch-ec-gap);
}
.lch-evenements-prives-collage__item {
margin: 0;
overflow: hidden;
background: #d9d3c8;
min-height: 0;
}
.lch-evenements-prives-collage__item--1 { grid-column: 1; grid-row: 1 / 3; }
.lch-evenements-prives-collage__item--2 { grid-column: 2; grid-row: 1; }
.lch-evenements-prives-collage__item--3 { grid-column: 2; grid-row: 2; }
.lch-evenements-prives-collage__item--4 { grid-column: 3; grid-row: 1 / 3; }
.lch-evenements-prives-collage__item--5 { grid-column: 4; grid-row: 1 / 3; }
.lch-evenements-prives-collage__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: transform 0.65s ease;
}
.lch-evenements-prives-collage__item--1 .lch-evenements-prives-collage__image { object-position: 45% center; }
.lch-evenements-prives-collage__item--2 .lch-evenements-prives-collage__image { object-position: center 40%; }
.lch-evenements-prives-collage__item--3 .lch-evenements-prives-collage__image { object-position: center 55%; }
.lch-evenements-prives-collage__item--4 .lch-evenements-prives-collage__image { object-position: center center; }
.lch-evenements-prives-collage__item--5 .lch-evenements-prives-collage__image { object-position: center 35%; }
.lch-evenements-prives-collage__item:hover .lch-evenements-prives-collage__image {
transform: scale(1.035);
}
@media (max-width: 960px) {
.lch-evenements-prives-collage__grid {
grid-template-columns: 1fr 1fr;
grid-template-rows: auto;
min-height: 0;
}
.lch-evenements-prives-collage__item--1 { grid-column: 1; grid-row: 1 / 3; min-height: 0; }
.lch-evenements-prives-collage__item--2,
.lch-evenements-prives-collage__item--3 {
min-height: 0;
aspect-ratio: 4 / 3;
}
.lch-evenements-prives-collage__item--2 { grid-column: 2; grid-row: 1; }
.lch-evenements-prives-collage__item--3 { grid-column: 2; grid-row: 2; }
.lch-evenements-prives-collage__item--4,
.lch-evenements-prives-collage__item--5 {
min-height: 0;
aspect-ratio: 4 / 3;
}
.lch-evenements-prives-collage__item--4 { grid-column: 1; grid-row: 3; }
.lch-evenements-prives-collage__item--5 { grid-column: 2; grid-row: 3; }
}
@media (max-width: 560px) {
.lch-evenements-prives-collage__inner { width: calc(100% - 1.75rem); }
.lch-evenements-prives-collage__grid {
grid-template-columns: 1fr;
gap: 0.5rem;
}
.lch-evenements-prives-collage__item--1,
.lch-evenements-prives-collage__item--2,
.lch-evenements-prives-collage__item--3,
.lch-evenements-prives-collage__item--4,
.lch-evenements-prives-collage__item--5 {
grid-column: 1;
grid-row: auto;
min-height: 14rem;
aspect-ratio: 4 / 3;
}
.lch-evenements-prives-collage__item--1,
.lch-evenements-prives-collage__item--4,
.lch-evenements-prives-collage__item--5 {
aspect-ratio: 3 / 4;
min-height: 18rem;
}
}
@media (prefers-reduced-motion: reduce) {
.lch-evenements-prives-collage__image { transition: none; }
.lch-evenements-prives-collage__item:hover .lch-evenements-prives-collage__image { transform: none; }
}