/* === Atelier pages === */

/* Atelier entrance animations: Elementor's fadeInLeft / fadeInRight / fadeInUp at its
   1.25s default or its 2s "slow" duration (ease), after the stated delay;
   assets/js/atelier.js adds .is-revealed when the element first enters the viewport. */
@keyframes atelier-in-left {
	from {
		opacity: 0;
		transform: translate3d(var(--atelier-slide, -100%), 0, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes atelier-in-right {
	from {
		opacity: 0;
		transform: translate3d(var(--atelier-slide, 100%), 0, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes atelier-in-up {
	from {
		opacity: 0;
		transform: translate3d(0, 100%, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes atelier-fade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.tillander-motion .is-style-atelier-in-left:not(.is-revealed),
.tillander-motion .is-style-atelier-in-right:not(.is-revealed),
.tillander-motion .is-style-atelier-in-up:not(.is-revealed),
.tillander-motion .is-style-atelier-in-left-slow:not(.is-revealed),
.tillander-motion .is-style-atelier-in-right-slow:not(.is-revealed),
.tillander-motion .is-style-atelier-in-left-slow-200:not(.is-revealed),
.tillander-motion .is-style-atelier-in-right-slow-200:not(.is-revealed),
.tillander-motion .is-style-atelier-in-left-slow-300:not(.is-revealed),
.tillander-motion .is-style-atelier-in-right-slow-300:not(.is-revealed),
.tillander-motion .is-style-atelier-in-up-slow:not(.is-revealed),
.tillander-motion .is-style-atelier-in-up-slow-200:not(.is-revealed),
.tillander-motion .is-style-atelier-fade-slow:not(.is-revealed),
.tillander-motion .is-style-atelier-fade-slow-200:not(.is-revealed),
.tillander-motion .is-style-atelier-fade-slow-300:not(.is-revealed),
.tillander-motion .is-style-atelier-fade-slow-nm:not(.is-revealed),
.tillander-motion .is-style-atelier-fade-slow-200-nm:not(.is-revealed) {
	visibility: hidden;
}

.is-style-atelier-in-left.is-revealed {
	animation: atelier-in-left 1.25s ease both;
}

.is-style-atelier-in-right.is-revealed {
	animation: atelier-in-right 1.25s ease both;
}

.is-style-atelier-in-up.is-revealed {
	animation: atelier-in-up 1.25s ease both;
}

.is-style-atelier-in-left-slow.is-revealed,
.is-style-atelier-in-left-slow-200.is-revealed,
.is-style-atelier-in-left-slow-300.is-revealed {
	animation: atelier-in-left 2s ease both;
}

.is-style-atelier-in-right-slow.is-revealed,
.is-style-atelier-in-right-slow-200.is-revealed,
.is-style-atelier-in-right-slow-300.is-revealed {
	animation: atelier-in-right 2s ease both;
}

.is-style-atelier-in-up-slow.is-revealed,
.is-style-atelier-in-up-slow-200.is-revealed {
	animation: atelier-in-up 2s ease both;
}

.is-style-atelier-fade-slow.is-revealed,
.is-style-atelier-fade-slow-200.is-revealed,
.is-style-atelier-fade-slow-300.is-revealed,
.is-style-atelier-fade-slow-nm.is-revealed,
.is-style-atelier-fade-slow-200-nm.is-revealed {
	animation: atelier-fade 2s ease both;
}

.is-style-atelier-in-left-slow-200.is-revealed,
.is-style-atelier-in-right-slow-200.is-revealed,
.is-style-atelier-in-up-slow-200.is-revealed,
.is-style-atelier-fade-slow-200.is-revealed,
.is-style-atelier-fade-slow-200-nm.is-revealed {
	animation-delay: 0.2s;
}

.is-style-atelier-in-left-slow-300.is-revealed,
.is-style-atelier-in-right-slow-300.is-revealed,
.is-style-atelier-fade-slow-300.is-revealed {
	animation-delay: 0.3s;
}

/* The -nm styles stand still on phones (Elementor's animation_mobile: none). */
@media (width <= 767px) {
	.tillander-motion .is-style-atelier-fade-slow-nm:not(.is-revealed),
	.tillander-motion .is-style-atelier-fade-slow-200-nm:not(.is-revealed) {
		visibility: visible;
	}

	.is-style-atelier-fade-slow-nm.is-revealed,
	.is-style-atelier-fade-slow-200-nm.is-revealed {
		animation: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tillander-motion .is-style-atelier-in-left:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-right:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-up:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-left-slow:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-right-slow:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-left-slow-200:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-right-slow-200:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-left-slow-300:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-right-slow-300:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-up-slow:not(.is-revealed),
	.tillander-motion .is-style-atelier-in-up-slow-200:not(.is-revealed),
	.tillander-motion .is-style-atelier-fade-slow:not(.is-revealed),
	.tillander-motion .is-style-atelier-fade-slow-200:not(.is-revealed),
	.tillander-motion .is-style-atelier-fade-slow-300:not(.is-revealed),
	.tillander-motion .is-style-atelier-fade-slow-nm:not(.is-revealed),
	.tillander-motion .is-style-atelier-fade-slow-200-nm:not(.is-revealed) {
		visibility: visible;
	}

	.is-style-atelier-in-left.is-revealed,
	.is-style-atelier-in-right.is-revealed,
	.is-style-atelier-in-up.is-revealed,
	.is-style-atelier-in-left-slow.is-revealed,
	.is-style-atelier-in-right-slow.is-revealed,
	.is-style-atelier-in-left-slow-200.is-revealed,
	.is-style-atelier-in-right-slow-200.is-revealed,
	.is-style-atelier-in-left-slow-300.is-revealed,
	.is-style-atelier-in-right-slow-300.is-revealed,
	.is-style-atelier-in-up-slow.is-revealed,
	.is-style-atelier-in-up-slow-200.is-revealed,
	.is-style-atelier-fade-slow.is-revealed,
	.is-style-atelier-fade-slow-200.is-revealed,
	.is-style-atelier-fade-slow-300.is-revealed,
	.is-style-atelier-fade-slow-nm.is-revealed,
	.is-style-atelier-fade-slow-200-nm.is-revealed {
		animation: none;
	}
}

/* Atelier: shared hero and anchor row (philosophy, us, history). */

/* The phone cover's hairlines enter from beyond the edge: Elementor slides the
   whole divider widget, half the cover wide. */
.wp-block-group.is-style-atelier-drop-cover .wp-block-separator.is-style-atelier-in-left {
	--atelier-slide: -50vw;
}

.wp-block-group.is-style-atelier-drop-cover .wp-block-separator.is-style-atelier-in-right {
	--atelier-slide: 50vw;
}

@media (width <= 767px) {
	.wp-block-group.is-style-atelier-drop-box {
		border-bottom: 1px solid #000;
	}
}

/* Atelier: philosophy. */

/* The making-of film fills the WORKSHOP band, cropped like a cover image. */
.wp-block-group.is-style-atelier-video-band > .wp-block-video video {
	height: 100%;
}

@media (width <= 1024px) {
	.wp-block-group.is-style-atelier-plate {
		width: 80%;
	}

	.wp-block-group.is-style-atelier-droppe .wp-block-image {
		text-align: start;
	}

	.wp-block-group.is-style-atelier-droppe .wp-block-image img {
		width: 41%;
	}
}

@media (width <= 767px) {
	.wp-block-group.is-style-atelier-plate {
		width: 90%;
	}

	.wp-block-group.is-style-atelier-droppe .wp-block-image img {
		width: 50%;
	}

	/* WORKSHOP's link keeps the band showing through its frame. */
	.wp-block-group.is-style-atelier-video-band p.is-style-action-link a {
		background: transparent;
	}
}

/* Atelier: materials and maintenance. */

/* Title band: over the hero's top-left corner, letting the pointer through to
   the photos. */
.wp-block-group.is-style-atelier-materials-title {
	position: relative;
	z-index: 7;
	pointer-events: none;
}

/* Photo hero: each column darkens towards its foot (30%; the middle one evenly,
   20%) under its label. The label's link covers the column and draws a 1px line
   3px under the label in 0.3s while the pointer is over the column. */
.wp-block-group.is-style-atelier-materials-hero > :is(.wp-block-group) {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	cursor: pointer;
}

.wp-block-group.is-style-atelier-materials-hero > :is(.wp-block-group)::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: linear-gradient(rgb(152 152 152 / 0%) 0%, #000 100%);
	opacity: 0.3;
	pointer-events: none;
}

.wp-block-group.is-style-atelier-materials-hero > :is(.wp-block-group):nth-child(2)::before {
	background: #000;
	opacity: 0.2;
}

.wp-block-group.is-style-atelier-materials-hero :is(a) {
	padding-bottom: 1px;
	background: linear-gradient(currentcolor, currentcolor) 0 100% / 0 1px no-repeat;
	text-decoration: none;
	transition: background-size 0.3s;
}

.wp-block-group.is-style-atelier-materials-hero :is(a)::after {
	content: "";
	position: absolute;
	inset: 0;
}

.wp-block-group.is-style-atelier-materials-hero > :is(.wp-block-group):hover :is(a),
.wp-block-group.is-style-atelier-materials-hero :is(a):focus-visible {
	background-size: 100% 1px;
}

/* Title strips (a title over a hairline): the hairline row spans the strip; the
   title paints over the hairline (whose entrance style makes it a layer). */
.wp-block-group.is-style-atelier-materials-strip > :is(.wp-block-group):first-child {
	align-self: stretch;
}

.wp-block-group.is-style-atelier-materials-strip > :is(:last-child) {
	position: relative;
}

.wp-block-group.is-style-atelier-materials-strip .wp-block-separator {
	width: 100%;
}

/* Feature rows: the copy half keeps its width when the phones' photo band runs
   past its edges. */
.wp-block-group.is-style-atelier-materials-feature > :is(.wp-block-group),
.wp-block-group.is-style-atelier-materials-feature-reverse > :is(.wp-block-group) {
	min-width: 0;
}

/* The copy block is as wide as its measure (its min-width), at the copy half's
   far edge on reversed rows, where the photo is on the right. */
@media (width >= 768px) {
	.wp-block-group.is-style-atelier-materials-feature-reverse.is-layout-flex {
		flex-direction: row-reverse;
	}

	.wp-block-group.is-style-atelier-materials-feature > :last-child > :last-child {
		width: 0;
	}

	.wp-block-group.is-style-atelier-materials-feature-reverse > :last-child > :last-child {
		align-self: flex-end;
		width: 0;
	}
}

/* Cards: the white card covers the hairline band behind it. */
.wp-block-group.is-style-atelier-materials-cards > :is(.wp-block-group) {
	position: relative;
	z-index: 20;
}

/* The VIEW layer: invisible until the pointer is over the photo, then it fades in
   (0.3s) and a 1.5px line draws in under VIEW (0.4s); the link covers the photo. */
.wp-block-group.is-style-atelier-materials-view {
	position: relative;
	opacity: 0;
	transition: opacity 0.3s;
}

.wp-block-group.is-style-atelier-materials-view:hover,
.wp-block-group.is-style-atelier-materials-view:focus-within {
	opacity: 1;
}

.wp-block-group.is-style-atelier-materials-view :is(a) {
	padding-bottom: 1px;
	background: linear-gradient(#000, #000) 0 100% / 0 1.5px no-repeat;
	text-decoration: none;
	transition: background-size 0.4s;
}

.wp-block-group.is-style-atelier-materials-view :is(a)::after {
	content: "";
	position: absolute;
	inset: 0;
}

.wp-block-group.is-style-atelier-materials-view:hover :is(a),
.wp-block-group.is-style-atelier-materials-view :is(a):focus-visible {
	background-size: 100% 1.5px;
}

/* The maintenance form, as the source's Elementor form: white labels above 40px
   fields on 61% black, NAME and SURNAME side by side from 768px, the reCAPTCHA
   note in 10px type, SEND centred 25px under it. */
.wp-block-group.is-style-atelier-maintenance-form {
	box-sizing: border-box;
	width: 100%;
	max-width: 691px;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__fields {
	margin: 0 -5px;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__field,
.wp-block-group.is-style-atelier-maintenance-form .tillander-form__note,
.wp-block-group.is-style-atelier-maintenance-form .tillander-form__submit {
	box-sizing: border-box;
	margin: 0 0 25px;
	padding: 0 5px;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__field label {
	padding-bottom: 8px;
	color: #fff;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.9rem;
	font-weight: 100;
	line-height: 1;
	letter-spacing: 0.4px;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__field :is(input, textarea) {
	box-sizing: border-box;
	width: 100%;
	min-height: 40px;
	margin: 0;
	padding: 8px 16px;
	border: 1px solid rgb(105 114 125);
	border-radius: 0;
	background: rgb(0 0 0 / 61%);
	color: #fff;
	font-family: var(--wp--preset--font-family--body);
	font-size: 15px;
	font-weight: 400;
	line-height: 21px;
	letter-spacing: normal;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__field textarea {
	padding: 5px 14px;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__note {
	margin-top: 26px;
	color: #fff;
	font-family: var(--wp--preset--font-family--body);
	font-size: 10px;
	font-weight: 400;
	line-height: 15px;
	letter-spacing: 0.4px;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__note :is(a) {
	color: #fff;
	text-decoration: underline;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form__submit {
	display: flex;
	justify-content: center;
	margin-bottom: 0;
}

.wp-block-group.is-style-atelier-maintenance-form .tillander-form .tillander-form__button {
	min-height: 33px;
	padding: 2px;
	border: 0;
	border-radius: 0;
	background: #000;
	color: #fff;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.9rem;
	font-weight: 200;
	line-height: 1;
	letter-spacing: 0.025px;
	text-transform: uppercase;
	cursor: pointer;
}

@media (width <= 767px) {
	.wp-block-group.is-style-atelier-materials-card.is-layout-flex {
		flex-direction: column-reverse;
	}

	.wp-block-group.is-style-atelier-maintenance-form .tillander-form__field--half {
		flex-basis: 100%;
	}
}

/* Atelier: us. */

/* The quote layer over each team photo: hidden until the pointer is over the
   photo, then faded in over 0.2s (the source's `transition: 0.2s`). It keeps the
   photo's height; a longer quote is clipped, as on the source. */
.wp-block-group.is-style-atelier-us-quote {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: opacity 0.2s ease;
}

.wp-block-group.is-style-atelier-us-quote:hover,
.wp-block-group.is-style-atelier-us-quote:focus-within {
	opacity: 1;
}

/* The designer rows clip their split letters at the row's edges; the photo
   paints over the letters that run into it. Jenny's row has the photo on the
   left; phones put every photo first. */
.wp-block-group.is-style-atelier-us-split,
.wp-block-group.is-style-atelier-us-split-reverse {
	overflow: hidden;
}

@media (width >= 768px) {
	.wp-block-group.is-style-atelier-us-split-reverse {
		flex-direction: row-reverse;
	}
}

@media (width <= 767px) {
	.wp-block-group.is-style-atelier-us-split,
	.wp-block-group.is-style-atelier-us-split-reverse {
		flex-direction: column-reverse;
	}
}

/* Atelier: history. */

/* The story's two text columns (`columns: 2`, the style's own CSS) are one
   column on phones. */
@media (width <= 767px) {
	.wp-block-group.is-style-atelier-history-columns {
		columns: 1;
	}
}

/* The timeline (the source's Essential Addons content timeline). A year is a
   block with 64px below it (32px below 992px) holding its drop (65px on a white
   disc, 20px down) and its card. A 2px grey line runs from 25px down to the next
   year, and a black one fills it to the reading line while the year is
   highlighted (--atelier-progress, assets/js/atelier-history.js). Highlighted
   years bring their card, its copy and the drop to full opacity over 0.3s. */
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow {
	position: relative;
	z-index: 0;
	display: flow-root;
	padding-bottom: 64px;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow:not(:last-child)::before,
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow:not(:last-child)::after,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::before,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 25px;
	left: 50%;
	width: 2px;
	height: 100%;
	background: var(--wp--preset--color--line);
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow:not(:last-child)::after,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::after {
	height: min(var(--atelier-progress, 0px), 100%);
	background: var(--wp--preset--color--contrast);
	opacity: 0;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow.is-highlighted::after,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow.is-highlighted::after {
	opacity: 1;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow > .wp-block-image.size-full,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-image.size-full {
	position: absolute;
	top: 0;
	left: 50%;
	width: 65px;
	height: 65px;
	margin: 20px 0 0 -32px;
	border-radius: 50%;
	background: var(--wp--preset--color--base);
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow > .wp-block-image.size-full :where(img),
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-image.size-full :where(img) {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 10px;
	opacity: 0.4;
	transition: opacity 0.3s;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow > .wp-block-group.has-background,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background {
	position: relative;
	box-sizing: border-box;
	width: 45%;
	border-radius: 4px;
	opacity: 0.8;
	transition: opacity 0.3s;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow:nth-child(even) > .wp-block-group.has-background {
	float: right;
}

/* A READ MORE year's paragraphs and links: 16px apart, as the card's copy. */
.wp-block-group.is-style-atelier-history-more > .wp-block-paragraph,
.wp-block-group.is-style-atelier-history-more > .wp-block-group.is-layout-flow > .wp-block-paragraph {
	margin: 16px 0;
}

/* The card's copy: 16px between paragraphs and at the card's edges. */
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .wp-block-paragraph,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .wp-block-paragraph {
	margin: 16px 0;
	opacity: 0.8;
	transition: opacity 0.3s;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .is-style-atelier-history-more,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .is-style-atelier-history-more {
	opacity: 0.8;
	transition: opacity 0.3s;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-image.size-full :where(img),
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-group.has-background,
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-group.has-background > .wp-block-paragraph,
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-group.has-background > .is-style-atelier-history-more,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-image.size-full :where(img),
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-group.has-background,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-group.has-background > .wp-block-paragraph,
.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow.is-highlighted > .wp-block-group.has-background > .is-style-atelier-history-more {
	opacity: 1;
}

/* The year: the source sets it in its own copy of the extra-light Conso at weight
   600, which the browser emboldens synthetically (about 1px of stroke at this
   size, grown to the right) and which sits 2px lower on the line than the
   theme's Conso. The theme's Conso has a real semibold, so the extra-light face
   carries that stroke and offset here. */
.is-style-atelier-history-timeline .has-conso-font-family,
.is-style-atelier-history-timeline-right .has-conso-font-family {
	transform: translate(1px, 2px);
	-webkit-text-stroke: 1px currentcolor;
}

/* The year, from 1025px up: beside the line on the card's other side, 15px down. */
.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .has-conso-font-family {
	position: absolute;
	top: 0;
	left: calc(100% + 85px);
	box-sizing: border-box;
	width: 100%;
	margin: 15px 15px 0;
	padding: 0.8em 0 0.8em 5px;
}

.is-style-atelier-history-timeline > .wp-block-group.is-layout-flow:nth-child(even) > .wp-block-group.has-background > .has-conso-font-family {
	right: calc(100% + 85px);
	left: auto;
	padding: 0.8em 5px;
	text-align: right;
}

/* READ MORE: the text clamps to two lines until the year's own anchor is the
   URL target; READ MORE links to it, Show less back to the timeline's top. */
.wp-block-group.is-style-atelier-history-more > .wp-block-group.is-layout-flow {
	display: -webkit-box;
	max-height: 48px;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	transition: max-height 0.35s;
}

.wp-block-group.is-style-atelier-history-more:target > .wp-block-group.is-layout-flow {
	max-height: 1000vh;
	-webkit-line-clamp: unset;
}

.wp-block-group.is-style-atelier-history-more > .wp-block-paragraph :where(a) {
	display: inline-block;
	float: left;
	margin-top: 0.75rem;
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.5;
	text-decoration: underline;
	text-transform: uppercase;
}

.wp-block-group.is-style-atelier-history-more > .wp-block-paragraph :where(a:last-of-type),
.wp-block-group.is-style-atelier-history-more:target > .wp-block-paragraph :where(a:first-of-type) {
	display: none;
}

.wp-block-group.is-style-atelier-history-more:target > .wp-block-paragraph :where(a:last-of-type) {
	display: inline-block;
}

/* Tablets (992px up): the line at a quarter, the cards right of it (68%), the
   year left of it (a quarter of the card). */
@media (width >= 992px) {
	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::before,
	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::after {
		left: 25%;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-image.size-full {
		left: 25%;
		margin-left: -15px;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background {
		float: right;
		width: 68%;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .has-conso-font-family {
		position: absolute;
		top: 0;
		right: calc(100% + 85px);
		box-sizing: border-box;
		width: 25%;
		margin: 15px 15px 0 -2px;
		padding: 0.8em 0 0.8em 5px;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:nth-child(even) > .wp-block-group.has-background > .has-conso-font-family {
		padding: 0.8em 5px;
	}
}

/* Below 992px: the line 18px in from the left, the drop over it, the cards 60px
   in, the year floated above the text. As on the source, a READ MORE year's
   clamped text has no room beside the year until it is opened; opened, it runs
   below the year. */
@media (width <= 991px) {
	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow {
		padding-bottom: 32px;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::before,
	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow:not(:last-child)::after {
		left: 18px;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-image.size-full {
		left: 0;
		margin-left: -15px;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background {
		width: auto;
		margin-left: 60px;
	}

	.is-style-atelier-history-timeline-right > .wp-block-group.is-layout-flow > .wp-block-group.has-background > .has-conso-font-family {
		float: left;
		box-sizing: border-box;
		width: 100%;
		margin: 15px 15px 0 -2px;
		padding: 0.8em 0;
	}

	.wp-block-group.is-style-atelier-history-more:target > .wp-block-group.is-layout-flow {
		clear: both;
	}
}

/* The company logos: centred in their cells at the source's widths (a share of
   the cell, the SVG at most its own 331px), a grey rule between the cells from
   1025px up. */
.is-style-atelier-history-logos :where(.wp-block-image) {
	text-align: center;
}

.is-style-atelier-history-logos > .is-layout-flex:first-child :where(img) {
	width: min(165.5px, 50%);
}

.is-style-atelier-history-logos > .is-layout-flex:last-child :where(img) {
	width: 55%;
}

@media (width >= 1025px) {
	.is-style-atelier-history-logos > .is-layout-flex:last-child {
		border-left: 1px solid #bcbcbc;
	}
}

@media (width <= 1024px) {
	.is-style-atelier-history-logos > .is-layout-flex:first-child :where(img) {
		width: min(211.84px, 64%);
	}

	.is-style-atelier-history-logos > .is-layout-flex:last-child :where(img) {
		width: 80%;
	}
}

@media (width <= 767px) {
	.is-style-atelier-history-logos > .is-layout-flex:first-child :where(img) {
		width: min(99.3px, 30%);
	}

	.is-style-atelier-history-logos > .is-layout-flex:last-child :where(img) {
		width: 35%;
	}
}