/*	============================================================ */
/*	#region *** POSTER :: the Swiss exhibition poster */
/*	============================================================ */
	/* the exhibition poster :: the name turned on its side up the page's spine, one photograph cut into the sheet, the facts in blocks of type, the
	galleries as huge words, orange for the marks, everything flush left */

	html[data-template="poster"] {
		--ps-orange:							var(--ws-accent);
		--ps-ink:								var(--ws-ink);
	}

	html[data-template="poster"] h1,
	html[data-template="poster"] h2,
	html[data-template="poster"] h3 {
		font-weight:							800;
		letter-spacing:							-0.04em;
		line-height:							0.92;
	}

	/* the header :: the name set up the left edge of the screen, the pages in a numbered column at the top right */
	html[data-template="poster"] .tpl__head--spine {
		position:								relative;
		max-width:								var(--ws-max);
		width:									100%;
		margin:									0 auto;
		padding:								22px var(--ws-gap);
		display:								flex;
		align-items:							flex-start;
		justify-content:						space-between;
		gap:									22px;

		border:									none;
		background:								transparent;
	}

	html[data-template="poster"] .tpl__head--spine .ws__brandname {
		font-family:							var(--ws-ff-head);
		font-size:								15px;
		font-weight:							800;
		letter-spacing:							-0.01em;
	}

	html[data-template="poster"] .tpl__head--spine .ws__nav {
		flex-direction:							column;
		align-items:							flex-start;
		gap:									2px;
	}

	html[data-template="poster"] .tpl__head--spine .ws__navlink {
		padding:								0;
		display:								inline-flex;
		align-items:							baseline;
		gap:									10px;

		border:									none;

		color:									var(--ps-ink);
		font-size:								14px;
		font-weight:							700;
		letter-spacing:							-0.01em;
		text-transform:							none;
	}

	html[data-template="poster"] .tpl__head--spine .tpl__no {
		color:									var(--ps-orange);
		font-size:								11px;
	}

	html[data-template="poster"] .tpl__head--spine .ws__navlink:hover .tpl__nt,
	html[data-template="poster"] .tpl__head--spine .ws__navlink.is-on .tpl__nt {
		background:								var(--ps-orange);

		color:									rgb(255, 255, 255);
	}

	html[data-template="poster"] .tpl__head--spine .ws__burger {
		border:									2px solid var(--ps-ink);
		border-radius:							0;
	}

	@media all and (min-width: 961px) {
		html[data-template="poster"] .tpl__head--spine .ws__brand {
			position:							fixed;
			top:								0;
			bottom:								0;
			left:								0;
			z-index:							10;
			width:								54px;
			padding:							22px 0;
			align-items:						center;
			justify-content:					flex-end;

			border-right:						2px solid var(--ps-ink);
			background:							var(--ws-bg);
		}

		html[data-template="poster"] .tpl__head--spine .ws__brandname {
			font-size:							22px;
			writing-mode:						vertical-rl;
			transform:							rotate(180deg);
			white-space:						nowrap;
		}

		html[data-template="poster"] body {
			padding-left:						54px;
		}

		/* the home page :: the cover prints the name huge and turned, so the spine keeps only its rule */
		html[data-template="poster"] body:has(.tpl__cover--exhibition:not(.is-bare)) .tpl__head--spine .ws__brandname {
			visibility:							hidden;
		}

		html[data-template="poster"] .tpl__head--spine {
			justify-content:					flex-end;
		}
	}

	/* the cover :: the poster's sheet - the name huge and turned, one photograph cut into it, the show's facts in blocks */
	html[data-template="poster"] .tpl__cover--exhibition {
		height:									auto;
		padding:								0 var(--ws-gap) clamp(36px, 5vw, 70px);
		display:								block;
		overflow:								visible;

		background:								transparent;
	}

	html[data-template="poster"] .tpl__sheetposter {
		max-width:								var(--ws-max);
		min-height:								min(84vh, 860px);
		margin:									0 auto;
		display:								grid;
		grid-template-columns:					repeat(12, minmax(0, 1fr));
		grid-template-rows:						auto 1fr auto;
		gap:									16px;
	}

	html[data-template="poster"] .tpl__turned {
		grid-column:							1 / 4;
		grid-row:								1 / 4;
		align-self:								end;

		font-size:								clamp(54px, 9vw, 150px);
		line-height:							0.86;
		writing-mode:							vertical-rl;
		transform:								rotate(180deg);
		overflow-wrap:							anywhere;
	}

	html[data-template="poster"] .tpl__cutout {
		grid-column:							4 / 13;
		grid-row:								1 / 3;
		margin:									0;
		overflow:								hidden;

		clip-path:								polygon(0 0, 100% 0, 100% 86%, 82% 100%, 0 100%);
	}

	html[data-template="poster"] .tpl__cutout .ws__heroimg {
		position:								static;
		height:									100%;
		min-height:								52vh;
	}

	html[data-template="poster"] .tpl__showfacts {
		grid-column:							4 / 9;
		grid-row:								3;
		margin:									0;
		display:								flex;
		flex-direction:							column;
		gap:									2px;
	}

	html[data-template="poster"] .tpl__showfacts dt {
		color:									var(--ps-orange);
		font-family:							var(--ws-ff-head);
		font-size:								clamp(22px, 2.4vw, 34px);
		font-weight:							800;
		letter-spacing:							-0.03em;
	}

	html[data-template="poster"] .tpl__showfacts dd {
		margin:									0;

		font-family:							var(--ws-ff-head);
		font-size:								clamp(18px, 1.8vw, 26px);
		font-weight:							700;
		letter-spacing:							-0.02em;
	}

	html[data-template="poster"] .tpl__sheetposter .ws__heroline {
		grid-column:							9 / 13;
		grid-row:								3;
		margin:									0;
		opacity:								1;

		font-size:								15px;
		line-height:							1.45;
	}

	html[data-template="poster"] .tpl__cover--exhibition.is-bare .tpl__turned {
		grid-column:							1 / 13;

		writing-mode:							horizontal-tb;
		transform:								none;
	}

	/* the sections :: flush left, heavy, numbered by orange */
	html[data-template="poster"] .ws__section + .ws__section {
		border-top:								2px solid var(--ps-ink);
	}

	html[data-template="poster"] .ws__title {
		font-size:								clamp(48px, 7vw, 110px);
	}

	html[data-template="poster"] .ws__sectitle {
		font-size:								clamp(34px, 4.4vw, 70px);
	}

	html[data-template="poster"] .ws__kicker {
		color:									var(--ps-orange);
		font-weight:							800;
		letter-spacing:							0;
		text-transform:							none;
	}

	html[data-template="poster"] .ws__more {
		border-bottom:							3px solid var(--ps-orange);

		color:									var(--ps-ink);
		font-weight:							800;
		letter-spacing:							0;
		text-transform:							none;
	}

	html[data-template="poster"] .ws__lead {
		max-width:								900px;

		color:									var(--ps-ink);
		font-size:								clamp(22px, 2.4vw, 34px);
		font-weight:							600;
		letter-spacing:							-0.02em;
		line-height:							1.2;
	}

	html[data-template="poster"] .ws__words--centred {
		max-width:								none;

		text-align:								left;
	}

	html[data-template="poster"] .ws__btn {
		border:									none;
		border-radius:							0;
		background:								var(--ps-orange);

		color:									rgb(255, 255, 255);
		font-weight:							800;
		letter-spacing:							0;
		text-transform:							none;
	}

	/* the gallery index :: the galleries as huge words, one a line, its photograph appearing in the word's space when pointed */
	html[data-template="poster"] .tpl__bigtype {
		margin:									0;
		padding:								0;

		list-style:								none;
	}

	html[data-template="poster"] .tpl__bigtype li {
		border-top:								2px solid var(--ps-ink);
	}

	html[data-template="poster"] .tpl__bigtype a {
		position:								relative;
		padding:								10px 0;
		display:								grid;
		grid-template-columns:					54px minmax(0, 1fr) auto;
		gap:									16px;
		align-items:							baseline;
		overflow:								hidden;
	}

	html[data-template="poster"] .tpl__bigno {
		color:									var(--ps-orange);
		font-size:								14px;
		font-weight:							800;
	}

	html[data-template="poster"] .tpl__bigword {
		position:								relative;
		z-index:								1;

		font-family:							var(--ws-ff-head);
		font-size:								clamp(36px, 7vw, 110px);
		font-weight:							800;
		letter-spacing:							-0.05em;
		line-height:							0.95;
		transition:								color 0.2s;
	}

	html[data-template="poster"] .tpl__bigcount {
		position:								relative;
		z-index:								1;

		font-size:								14px;
		font-weight:							700;
	}

	html[data-template="poster"] .tpl__bigimg {
		position:								absolute;
		top:									0;
		right:									0;
		height:									100%;
		width:									46%;
		opacity:								0;

		object-fit:								cover;

		transform:								translateX(20px);
		transition:								opacity 0.3s, transform 0.4s;
	}

	html[data-template="poster"] .tpl__bigtype a:hover .tpl__bigimg,
	html[data-template="poster"] .tpl__bigtype a:focus-visible .tpl__bigimg {
		opacity:								1;

		transform:								none;
	}

	html[data-template="poster"] .tpl__bigtype a:hover .tpl__bigword {
		color:									var(--ps-orange);
	}

	/* a gallery :: the cut-out mosaic, hard edges, orange numbers */
	html[data-template="poster"] .ws__gallery {
		counter-reset:							cut;
	}

	html[data-template="poster"] .ws__item {
		position:								relative;

		border-radius:							0;

		counter-increment:						cut;
	}

	html[data-template="poster"] section[data-type="gallery"] .ws__item::before {
		position:								absolute;
		bottom:									0;
		left:									0;
		z-index:								1;
		padding:								4px 8px;

		background:								var(--ps-orange);

		content:								counter(cut, decimal-leading-zero);
		color:									rgb(255, 255, 255);
		font-size:								12px;
		font-weight:							800;
	}

	/* about, the record, contact :: blocks of type */
	html[data-template="poster"] .ws__portrait {
		border-radius:							0;
		clip-path:								polygon(0 0, 100% 0, 100% 88%, 84% 100%, 0 100%);
	}

	html[data-template="poster"] .ws__badge {
		padding:								4px 0;

		border:									none;
		border-radius:							0;

		font-weight:							800;
	}

	html[data-template="poster"] .ws__badge--accent {
		color:									var(--ps-orange);
	}

	html[data-template="poster"] .ws__stats {
		grid-template-columns:					repeat(auto-fit, minmax(170px, 1fr));
		gap:									20px 36px;
	}

	html[data-template="poster"] .ws__stat {
		padding:								0;

		border-radius:							0;
		background:								none;
	}

	html[data-template="poster"] .ws__statnum {
		font-family:							var(--ws-ff-head);
		font-size:								clamp(40px, 4.4vw, 72px);
		font-weight:							800;
		letter-spacing:							-0.05em;
	}

	html[data-template="poster"] .ws__award {
		border-radius:							0;
		background:								var(--ps-orange);
	}

	html[data-template="poster"] .ws__inp {
		border:									2px solid var(--ps-ink);
		border-radius:							0;
	}

	/* the foot :: the poster's foot - the facts in blocks */
	html[data-template="poster"] .tpl__foot--posterfoot {
		margin-top:								var(--ws-space);

		border-top:								2px solid var(--ps-ink);
	}

	html[data-template="poster"] .tpl__foot--posterfoot .ws__wrap {
		padding-top:							20px;
		padding-bottom:							30px;
		display:								grid;
		grid-template-columns:					repeat(auto-fit, minmax(200px, 1fr));
		gap:									14px 24px;
		align-items:							end;

		color:									var(--ws-soft);
		font-size:								13px;
	}

	html[data-template="poster"] .tpl__pf {
		color:									var(--ps-ink);
		font-family:							var(--ws-ff-head);
		font-size:								clamp(18px, 2vw, 28px);
		font-weight:							800;
		letter-spacing:							-0.03em;
		line-height:							1;
	}

	@media all and (max-width: 960px) {
		html[data-template="poster"] .tpl__sheetposter {
			grid-template-columns:				minmax(0, 1fr);
			grid-template-rows:					auto;
		}

		html[data-template="poster"] .tpl__turned,
		html[data-template="poster"] .tpl__cutout,
		html[data-template="poster"] .tpl__showfacts,
		html[data-template="poster"] .tpl__sheetposter .ws__heroline {
			grid-column:						1;
			grid-row:							auto;
		}

		html[data-template="poster"] .tpl__turned {
			font-size:							clamp(40px, 11.5vw, 110px);
			writing-mode:						horizontal-tb;
			transform:							none;
		}
	}

	@media all and (max-width: 760px) {
		html[data-template="poster"] .tpl__head--spine {
			align-items:						center;
		}

		html[data-template="poster"] .tpl__head--spine .ws__nav {
			padding:							8px var(--ws-gap) 16px;

			border-bottom:						2px solid var(--ps-ink);
		}

		html[data-template="poster"] .tpl__head--spine .ws__navlink {
			padding:							10px 0;
		}

		html[data-template="poster"] .tpl__bigtype a {
			grid-template-columns:				34px minmax(0, 1fr);
		}

		html[data-template="poster"] .tpl__bigcount {
			grid-column:						2;
		}

		html[data-template="poster"] .tpl__bigimg {
			display:							none;
		}
	}

/*	============================================================ */
/*	#endregion END POSTER */
/*	============================================================ */