@charset "UTF-8";

/**
 * grids.css 1.2.0
 * Author: hybrid.
 *
 * CSS Grid layout system with AJAX support.
 * Custom grid types (books, events, search, signatures...) in CUSTOM.
 *
 * Structure
 * .grid > .items > .item > .item-content
 *                        > .images / .thumbnails
 *                        > .infos
 *
 * Modifiers
 * .grid.list        — single column, horizontal layout
 * .grid.swiperable  — switchable to swiper
 * .grid.fluid       — masonry-style fluid layout
 * .grid.table       — table-like layout
 * .grid.search      — search results layout
 *
 * Item sizes
 * .item.large  — 2:1 thumbnail ratio
 * .item.small  — 1:1 thumbnail ratio
 * .item.sticky — full-width row (grid-column: 1 / -1)
 *
 * Tokens
 * --grid-gap          gap between items (responsive)
 * --items-per-row     number of columns (responsive)
 * --item-width        computed item width
 * --grid-font-size    font size scoped to grid
 * --grid-fluid-height row height for fluid layout
 *
 * Dependencies
 * --font-size         defined in fonts.css
 * --bright-color      defined in colors.css
 * --stroke-width      defined in structure.css
 * --duration-fast     defined in animations.css
 * --duration-normal   defined in animations.css
 * --ease              defined in animations.css
 */



/* ================================================================================================== */
/* ============================================= CONFIG ============================================= */
/* ================================================================================================== */


/* ============================== STYLE ============================== */

:root, .grid {
	--grid-font-size: 1em; /*var(--font-size);*/
	--grid-title-size: calc(var(--font-size) * 1.25);
}
@media (min-width:760px) {
	:root, .grid {
		--grid-title-size: calc(var(--font-size) * 2);
	}
}
@media (min-width:1600px) {
	:root, .grid {
		--grid-title-size: calc(var(--font-size) * 2.5);
	}
}


/* ============================== LAYOUT ============================== */

/* =============== DEFAULT =============== */

:root, .grid {
	--grid-gap: 1rem;
	--grid-gap-short: .25rem;

	--items-per-row: 1;
	/*--column-offset: 0;*/
	--item-width: calc((100% / var(--items-per-row)) - var(--grid-gap));

	--item-gap: 1em;
	--item-padding: 0;
	--item-border-radius: 0;
	--item-background-color: none; /*var(--bright-color);*/

	--item-empty-opacity: .33;
	--item-not-opacity: .5;
}
.grid.list {
	--grid-gap: 0; /*.25em;*/
	--items-per-row: 1 !important;

	--item-padding: 1em 0;
	--item-border-top: solid var(--stroke-width);
	/*--item-background-color: none;*/
}
.grid.swiperable {
	--item-width: calc(100% / var(--items-per-row));
}


/* =============== THEME =============== */

.grid.books { --items-per-row: 2; }
.grid.ads { --ad-item-width: 25rem; }


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

@media (min-width: 480px) {
	/* core */
	:root, .grid { --items-per-row: 2; }
	/* theme */
	.grid.books { --items-per-row: 3; }
}
@media (min-width: 760px) {
	/* default */
	:root, .grid {
		--sticky-item-size: 2;
		--grid-gap: 2rem;
		--grid-gap-short: .5rem;
	}

	/* theme */
	.grid.books { --items-per-row: 4; }
	/*.grid.gallery { --items-per-row: 4; }*/
}
@media (min-width: 1000px) {
	/* default */
	:root, .grid { --items-per-row: 3; }

	/* theme */
	.grid.books { --items-per-row: 5; }
}
@media (min-width: 1200px) {
	:root, .grid {
		--grid-gap: 3rem;
	}
}


/* =============== COLUMN CONTEXT =============== */

@media (min-width: 760px) {
	.columns .grid:not(.list) {
		--item-width: calc((100% / (var(--items-per-row) - 1)) - var(--grid-gap));
	}
}


/* ============================== FLUID ============================== */

@media (max-width: 760px) {
	:root { --grid-fluid-height: 10rem; }
}
@media (min-width: 760px) {
	:root { --grid-fluid-height: 15rem; }
}
@media (min-width: 1000px) {
	:root { --grid-fluid-height: 20rem; }
}


/* ============================== RESULTS ============================== */

:root {
	--results-gap: calc(var(--content-spacing) * 1.5); /* 2 */

	--results-title-sticky-top: calc(var(--header-height) + var(--contextual-height));
	--results-title-size: calc(var(--font-size) * 3); /*2em;*/
	--results-description-font-size: 1.125em;
}
#overlays {
	--results-title-sticky-top: 0;
	--results-title-size: calc(var(--font-size) * 1.5);
}


@media (min-width: 1000px) {
	:root {
		--results-description-font-size: 1.25em;
	}
}



/* ====================================================================================================== */
/* ============================================= ANIMATIONS ============================================= */
/* ====================================================================================================== */


/* ============================== CORE ============================== */

.grid .item,
.results-item {
	transition:
		opacity var(--duration-normal) var(--ease),
		transform var(--duration-normal) var(--ease);
}
.grid .item.off,
.results-title {
	transition:
		opacity var(--duration-fast) var(--ease),
		transform var(--duration-fast) var(--ease);
}


/* ============================== THEME ============================== */

.grid .infos,
.grid .infos > *:not(.button) {
	transition:
		opacity var(--duration-fast) var(--ease),
		transform var(--duration-fast) var(--ease);
}
/*
.grid a.item-content .thumbnail,
.grid a.item-content .infos {
	transition: all var(--duration-fast);
}
*/


/* ================================================================================================ */
/* ============================================= CORE ============================================= */
/* ================================================================================================ */


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

.grid {
	position: relative;
	width: 100%;
	font-size: var(--grid-font-size);
}

/* ============================== ITEMS ============================== */

.grid .items {
	position: relative;
	display: grid;
	grid-auto-flow: dense;
	grid-template-columns: repeat(auto-fill, minmax(var(--item-width), 1fr));
	gap: var(--grid-gap);
}
/*
.grid .items * {
	margin: 0;
}
.grid .items * + * {
	margin-top: 0;
}
*/


/* ============================== ITEM ============================== */

/* =============== DEFAULT =============== */

.grid .item {
	position: relative;
	display: flex;
	height: 100%;
	width: 100%;
}


/* =============== STATUS =============== */

/*
off,
disabled (reset.css)
*/

.grid .item.empty {
	opacity: .33;
}
.grid .item.not {
	opacity: .5;
}


/* =============== STICKY =============== */

.grid:not(.list) .item.sticky {
	grid-column: 1 / -1 !important;
	grid-row: auto;
}


/* ============================== MESSAGE ============================== */

.grid-message {

}
.grid:not(:has(.item, .grid-message)) {
    display: none;
}


/* ============================== ITEM CONTENT ============================== */

.grid .item-content {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--item-gap);
	height: 100%;
	width: 100%;
	margin: 0;
	padding: var(--item-padding);
	border-radius: var(--item-border-radius);
	background: var(--item-background-color);
}
.grid .item-content > * {
	margin: 0;
}


/* ============================== LIST ============================== */

.grid.list .item:before {
	content: '';
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	width: 100%;
	border-top: var(--item-border-top);
	pointer-events: none;
}
.grid.list .item-content {
	flex-direction: row;
	flex-wrap: wrap;
}


/* ============================== LOADING ============================== */

.grid-container.is-loading:before,
.grid.is-loading:before {
	display: none;
}
.grid-container.is-loading .results-title,
.grid-container.is-loading .results-description,
.grid-container.is-loading .item,
.grid-container.is-loading .grid-message,
.grid.is-loading .item {
	opacity: 0;
}


/* ============================== FLUID ============================== */

/**
 * Google Images style / JS
 * figure: aspect-ratio inline via style="aspect-ratio: 22/13;"
 * .grid-initialized — after JS init
 */

/* =============== DEFAULT =============== */

.grid.fluid .items {
	display: flex;
	flex-wrap: wrap;
	gap: var(--grid-gap);
}
.grid.fluid .item {
	flex: 1 0 auto;
	width: auto;
	height: var(--grid-fluid-height);
}
.grid.fluid figure {
	width: 100%;
	height: 100%;
	position: relative;
	max-width: none;
	aspect-ratio: auto !important;
}


/* =============== INIT =============== */

.grid.fluid.grid-initialized .item {
	height: auto;
	flex-grow: 0;
	aspect-ratio: auto !important;
}
.grid.fluid.grid-initialized .item-content,
.grid.fluid.grid-initialized figure {
	height: auto;
}


/* ============================== RESULTS ============================== */

/* =============== DEFAULT =============== */

.results {
	display: flex;
	flex-direction: column;
	gap: var(--results-gap) 0;
	width: 100%;
}
.results + .results {
	margin-top: var(--content-spacing);
}


/* =============== RESULTS MIN =============== */

.results.min {
	gap: var(--content-spacing);
}


/* =============== RESULTS ITEMS =============== */

.results > .results-items {
	display: flex;
	flex-direction: column;
	gap: calc(var(--content-spacing) * 2);
}


/* =============== RESULTS ITEM =============== */

.results-item {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
}


/* =============== RESULTS ITEM CONTENT =============== */

.results-item-content {
	display: flex;
	flex-direction: column;
	/*align-items: flex-start;*/
	gap: .5em;
	margin: 0;
}


/* =============== RESULTS-TITLE =============== */

.results-title {
	display: flex;
	align-items: baseline;
	font-size: var(--results-title-size);
	font-weight: var(--font-weight-medium);
	text-transform: uppercase;
}
.results-title > * {
	margin: 0;
}
body.is-loading .results-title {
	opacity: 0;
}
.results.unavailable .results-title {
	color: var(--grey-color);
}
.results-title.sticky {
	position: sticky;
	z-index: 100;
	top: var(--results-title-sticky-top);
}


/* =============== RESULTS-DESCRIPTION =============== */

.results-description {
	font-size: var(--results-description-font-size);
	max-width: calc(var(--content-max-width) * 2 / 3);
}


/* =============== SWIPER =============== */

.results.swiper-container .swiper-slide {
	opacity: 0;
}
.results.swiper-container .swiper-slide-active {
	opacity: 1;
}



/* ================================================================================================= */
/* ============================================= THEME ============================================= */
/* ================================================================================================= */

/* here for project-specific media overrides */


/* ============================== GALLERY ============================== */

/* =============== DEFAULT =============== */

.grid.gallery img {
	height: 100%;
	object-fit: cover;
}


/* =============== VIEWER =============== */

.grid.gallery.has-viewer .items:hover a.item-content {
	filter: grayscale(1) blur(.25em);
}
.grid.gallery.has-viewer .items:hover a.item-content:hover,
.grid.gallery.has-viewer a.item-content:hover {
	filter: grayscale(0) blur(0);
}


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

/* =============== DEFAULT =============== */

.grid .title {
	text-transform: uppercase;
	font-weight: var(--font-weight-medium);
}


/* =============== IMAGES =============== */

.grid .images {
	position: relative;
	height: 100%;
	width: 100%;
}


/* =============== THUMBNAILS =============== */

.grid .thumbnails {
	position: absolute;
	z-index: 10;
	inset: 0;
	width: 100%;
	aspect-ratio: 16/9;
	opacity: 0;
	pointer-events: none;
}
.grid.list .thumbnails {
	height: 100%;
}
.grid a.item-content:hover .thumbnails {
	opacity: 1;
}
.grid .item.large .thumbnail {
	aspect-ratio: 2/1;
}
.grid .item.small .thumbnail {
	aspect-ratio: 1/1;
}
.grid.list.small .thumbnail {
	display: none;
}


/* =============== INFOS =============== */

.grid .infos {
	position: relative;
	z-index: 10;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 1em;
	/*text-align: center;*/
	/*padding: 1.5em;*/
	margin: 0;
	width: 100%;
}
.grid .infos > * {
	margin: 0;
}
.grid .infos > * + * {
	margin-top: var(--grid-gap-short);
}
.grid .infos > .inline {
	justify-content: center;
}

/* LIST */

.grid.list .infos {
	text-align: left;
	padding: 0;
}
.grid.list .infos > * {
	margin: 0;
}



/* =============== DESCRIPTION =============== */

.grid .post-description {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	text-overflow: ellipsis;
	overflow: hidden;
	margin-top: 1em;
	height: 3em;
	width: 100%;
	font-size: .875em;
	line-height: 1;
	text-align: left !important;
}
.grid .post-time {
	display: flex;
	gap: 0 1em;
}
.grid .infos .post-time > * {
	flex-basis: 0;
}
.grid .post-location {
	text-align: center;
}


/* ============================== RESULTS-TITLE ============================== */

.results-title.sticky {
	padding: 1rem 0;
	margin-bottom: -1rem;
	background: var(--bright-color);
}


/* ============================== SEARCH ============================== */

/* =============== SEARCH =============== */



.grid.search.list .item-content {
	flex-direction: row;
}
.grid.search.list .cover {
	flex-grow: 1;
	flex-basis: 0;
	aspect-ratio: auto !important;
}
.grid.search .cover img {
	height: 100%;
	object-fit: contain;
}
.grid.list.list .infos {
	flex-grow: 2;
	flex-basis: 66%;
	text-align: left;
}

.grid.search.list .title {
	text-transform: uppercase;
	font-weight: var(--font-weight-bold);
}


.grid.search .post-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .25em;
}
.grid.search .post-title .post-tag {
	order: initial;
	margin: 0;
}
.grid.search .post-meta {
	justify-content: flex-start;
}


/* ============================== BOOKS ============================== */

/* =============== DEFAULT =============== */

.grid.books .item {
	align-items: flex-end;
	background: none;
}
.grid.books .item-content {
	height: auto;
}
.grid.books:not(.list) .infos {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: .75em;
	padding: 1em;
	background: rgba(var(--bright-rgb), .33);
	opacity: 0;
	visibility: hidden;
}
.grid.books:not(.list) .item-content:hover .cover {
	opacity: .33;
}
.grid.books:not(.list) .item-content:hover .infos {
	opacity: 1;
	visibility: visible;
}
.grid.books .item-content .infos > * {
	/*width: 100%;*/
	text-align: center;
	justify-content: center;
}
.grid.books.list .cover {
	width: 3em;
}
.grid.books .infos .title {
	font-size: 1em;
}


/* =============== HAS-AWARD =============== */

.grid.books .item.has-award .cover:before {
	content: "";
	position: absolute;
	z-index: 20;
	bottom: 0;
	right: 0;
	transform: translate(50%, 50%);
	display: block;
	height: 3em;
	width: 3em;
	border-radius: 50%;
	background: yellow; /* fallback */
	pointer-events: none;
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 96 96" class="slpj-pepites" preserveAspectRatio="none"><path fill="yellow" d="M56.856 58.272a5.722 5.722 0 0 1 5.713 5.72c0 3.146-2.562 5.707-5.713 5.707s-5.715-2.56-5.715-5.707a5.723 5.723 0 0 1 5.715-5.72m-17.777 0a5.722 5.722 0 0 1 5.713 5.72 5.717 5.717 0 0 1-5.713 5.707c-3.151 0-5.715-2.56-5.715-5.707a5.723 5.723 0 0 1 5.715-5.72m38.18 1.827c0 11.972-10.148 24.092-29.548 24.092-7.28 0-13.473-1.623-18.406-4.826-5.47-3.644-9.042-9.002-10.618-15.922l-.023-.106.094-.051 4.011-2.16.17-.091.036.19c1.18 6.398 4.087 11.063 8.882 14.258 4.093 2.657 9.577 4.061 15.854 4.061 17.11 0 24.9-10.08 24.9-19.445 0-8.144-5.109-13.889-15.186-17.072l-.05-.016-.042-.017c-1.414-.514-6.765-1.95-9.962-2.807-2.178-.584-3.898-1.047-4.661-1.276C38.9 37.766 28.784 34.729 28.784 24c0-11.305 10.475-15.317 19.444-15.317 7.544 0 13.802 2.928 17.627 8.238l.017.023.011.01.001.005.013.016-.002.001c1.597 2.114 2.497 4.419 3.167 6.397l.038.113-.105.057-3.898 2.095-.15.081-.052-.16c-.585-1.762-1.312-3.953-2.744-5.83l-.013-.02-.018-.018-.004-.006-.004-.006c-2.922-4.095-7.853-6.35-13.884-6.35-2.47 0-14.796.515-14.796 10.671 0 6.397 5.104 8.808 10.617 10.46.688.206 2.383.663 4.526 1.24 4.928 1.322 8.815 2.376 10.306 2.913C74.07 43.428 77.26 52.956 77.26 60.099M96 47.995C96 21.53 74.466 0 47.997 0 21.531 0 0 21.53 0 47.995 0 74.465 21.531 96 47.997 96 74.466 96 96 74.465 96 47.995"/></svg>');
	background-size: cover;
	background-repeat: no-repeat;
}


/* ============================== SIGNATURES ============================== */

.grid.signatures.list .item-content {
	gap: .375em 1em;
}
.grid.signatures .signature-books {
	width: 100%;
}


/* ============================== ALIAS ============================== */

.grid.taxonomies .title,
.grid.alias .title {
	font-size: var(--grid-title-size);
}
.grid.alias .item-content:hover .thumbnail.media {
	animation: tilt-shaking 0.25s linear;
}


/* ============================== MEDIAS ============================== */

.grid.medias .item-content:hover .thumbnail {
	animation: tilt-shaking 0.25s linear;
}
.grid.medias .infos {
	text-align: left;
}


/* =============== ARCHIVE-LINK =============== */
/** for resources **/

.grid.medias .grid-archive-link .thumbnail.media {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	border-radius: var(--thumbnail-border-radius);
	background: var(--dark-color);
}
.grid.medias .grid-archive-link [class^="icon-"] {
	font-size: 2em;
	color: var(--dark-color);
}
.grid.medias .grid-archive-link [class^="icon-"]:before {
	z-index: 10;
}
.grid.medias .grid-archive-link [class^="icon-"]:after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	padding: 1em;
	border-radius: 50%;
	background: var(--bright-color);
	transform: translate(-50%, -50%);
}
.grid.medias .grid-archive-link:hover [class^="icon-"]:after {
	transform: translate(-50%, -50%) scale(.75);
}


/* ============================== EVENTS ============================== */

/* =============== DEFAULT =============== */

.grid.events .description {
	margin-top: .375em;
}
.grid.events .item-content {
	gap: .375em 1em;
}


/* =============== CONTENT =============== */

.grid.events:not(.list) .post-time {
	justify-content: space-between;
}
.grid.events:not(.list) .post-location {
	flex-basis: 100%;
}


/* =============== LIST =============== */

.grid.events.list .item-content .title,
.grid.events.list .item-content .post-date,
.grid.events.list .item-content .post-time,
.grid.events.list .item-content .post-location {
	text-transform: uppercase;
}
.grid.events.list .item-content .description,
.grid.events.list .item-content .infos {
	width: 100%;
	flex-direction: row;
}
.grid.events.list .item-content .infos {
	font-weight: var(--font-weight-bold);
}
.grid.list.events .post-date {
	-webkit-box-ordinal-group: -1;
	-webkit-order: -2;
	   -moz-box-ordinal-group: -1;
	    -ms-flex-order: -2;
	        order: -2;
}


/* =============== EVENTS =============== */
/*
.grid.events .post-meta {
	justify-content: space-between;
}
*/


/* ============================== LIST ============================== */

/*
.grid.list.events .item-content {
	flex-direction: row;
	align-items: stretch;
}
.grid.list.events .images {
	position: relative;
}
.grid.list.events .infos {
	flex-direction: row;
	align-items: center;
	color: currentColor;
	background: none;
}
.grid.list.events .post-tag {
	color: var(--dark-color);
	border-color: var(--yellow-color);
	background: var(--yellow-color);
}
.grid.list.events a.item-content:hover .post-tag {
	color: var(--yellow-color);
	border-color: var(--dark-color);
	background: var(--dark-color);
}
.grid.list.events .post-meta {
	justify-content: flex-start;
}
.grid.list.events .post-date.large {
	padding: 1.5em;
}
*/

/* =============== @MEDIA =============== */
/*
@media (max-width: 760px) {
	.grid.list.events .images {
		display: none;
	}
}

@media (min-width: 1000px) {
	.grid.events.list .images {
		width: 20%;
	}
	.grid.events.list .infos {
		width: 80%;
	}
	.grid.events.list .post-date.large {
		width: 5%;
	}
	.grid.events.list .post-date.large + .infos {
		width: 75%;
	}
}
*/



/* =============== TABLE =============== */

.grid.table .items .item {
	flex-grow: 1;
}
.grid.table .items .item .item-content {
	padding: 1.25rem;
}
.grid.table .items .item .item-content > * {
	padding: 0;
}
.grid.table .items .item .item-content figure {
	max-width: 6rem;
	padding-bottom: 1.25rem;
}
.grid.table .items .item .item-content .infos {
	text-align: center;
}




/* ============================== CONTACTS ============================== */

/* =============== LOGOS =============== */

.grid.contacts.logos {
	--grid-gap: 0px;
	--items-per-row: 3;
}
.grid.contacts .thumbnail {
	max-width: none;
	aspect-ratio: 1/1;
	background: none;
}
.grid.contacts .thumbnail img {
	   object-fit: contain;
}
.grid.contacts.list .title {
	width: 200%;
}

@media (min-width: 760px) {
	.grid.contacts.logos {
		--items-per-row: 6;
	}
}
@media (min-width: 1000px) {
	.grid.contacts.logos {
		--items-per-row: 9;
	}
}


/* =============== TEAM =============== */

.grid.contacts .title .codir {
	font-weight: var(--font-weight-normal);
	text-transform: none;
}


/* =============== LIST =============== */


.grid.contacts.list .item-content {
	justify-content: space-between;
}
.grid.contacts.list .infos.inline {
	line-height: 1;
	flex-direction: row;
	justify-content: flex-start;
}
.grid.contacts.list .infos.inline .title {
	width: auto;
}
.grid.contacts.list .infos.inline .post-location {
	text-transform: uppercase;
}