/* Faber Warehouse 0.15.0 — shell/header condiviso */
.fws-shell-header,
.fws-shell-header * { box-sizing: border-box; }

.fws-shell-header {
	align-items: stretch;
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	background: rgba(9, 10, 9, .94);
	border-bottom: 1px solid rgba(255,255,255,.13);
	display: grid;
	font-family: var(--fws-ui, "Inter", sans-serif);
	grid-template-columns: minmax(170px,1fr) auto minmax(250px,1fr);
	height: 78px;
	left: 0;
	padding: 0 clamp(22px,3vw,52px);
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 50;
}

.fws-shell-header a { color: inherit; text-decoration: none; }

.fws-shell-header__brand {
	align-items: center;
	display: inline-flex;
	justify-self: start;
	min-width: 0;
}

.fws-shell-header__brand img {
	display: block;
	filter: brightness(0) invert(1);
	height: auto;
	max-width: 100%;
	width: clamp(148px,12vw,178px);
}

.fws-shell-header__nav {
	align-items: stretch;
	display: flex;
	gap: clamp(24px,3vw,46px);
	justify-content: center;
	min-width: 0;
}

.fws-shell-header__nav a {
	align-items: center;
	color: rgba(255,255,255,.58);
	display: flex;
	font-size: 9px;
	font-weight: 500;
	height: 78px;
	letter-spacing: .13em;
	position: relative;
	text-transform: uppercase;
	transition: color .22s ease;
	white-space: nowrap;
}

.fws-shell-header__nav a::after {
	background: var(--fws-gold, #b99a62);
	bottom: 16px;
	content: "";
	height: 1px;
	left: 0;
	opacity: 0;
	position: absolute;
	transform: scaleX(.35);
	transform-origin: center;
	transition: opacity .22s ease, transform .22s ease;
	width: 100%;
}

.fws-shell-header__nav a:hover,
.fws-shell-header__nav a:focus-visible { color: #fff; }

.fws-shell-header__nav a.is-active { color: var(--fws-gold, #b99a62); }
.fws-shell-header__nav a.is-active::after { opacity: 1; transform: scaleX(1); }

.fws-shell-header__actions {
	align-items: stretch;
	display: flex;
	justify-self: end;
	min-width: 0;
}

.fws-shell-header__selection {
	align-items: center;
	appearance: none;
	background: transparent;
	border: 0;
	border-left: 1px solid rgba(255,255,255,.12);
	border-right: 1px solid rgba(255,255,255,.12);
	color: rgba(255,255,255,.9) !important;
	cursor: pointer;
	display: flex;
	font-family: var(--fws-ui, "Inter", sans-serif);
	font-size: 8px;
	font-weight: 500;
	gap: 12px;
	letter-spacing: .13em;
	padding: 0 20px;
	text-transform: uppercase;
	transition: color .22s ease, background .22s ease;
	white-space: nowrap;
}

.fws-shell-header__selection strong {
	align-items: center;
	border: 1px solid rgba(185,154,98,.62);
	border-radius: 999px;
	color: var(--fws-gold, #b99a62);
	display: inline-flex;
	font-size: 8px;
	font-weight: 600;
	height: 24px;
	justify-content: center;
	letter-spacing: 0;
	min-width: 24px;
	padding: 0 6px;
	transition: background .22s ease, border-color .22s ease, color .22s ease;
}

.fws-shell-header__selection:hover,
.fws-shell-header__selection:focus-visible,
.fws-shell-header__selection.is-active { background: rgba(185,154,98,.07); }

.fws-shell-header__selection:hover strong,
.fws-shell-header__selection:focus-visible strong,
.fws-shell-header__selection.is-active strong,
.fws-shell-header__selection.has-selection strong {
	background: var(--fws-gold, #b99a62);
	border-color: var(--fws-gold, #b99a62);
	color: #0e0f0e;
}

.fws-shell-header__external {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 135px;
	padding-left: 20px;
}

.fws-shell-header__external a {
	color: rgba(255,255,255,.56);
	display: flex;
	font-size: 8px;
	justify-content: space-between;
	letter-spacing: .12em;
	line-height: 1.85;
	text-transform: uppercase;
	transition: color .22s ease;
	white-space: nowrap;
}

.fws-shell-header__external a:hover,
.fws-shell-header__external a:focus-visible { color: #fff; }
.fws-shell-header__external span { color: var(--fws-gold, #b99a62); margin-left: 16px; }

/* L'archivio ha un header in flusso perché la toolbar sottostante è sticky. */
.fws-slabs-body .fws-shell-header {
	position: sticky;
	top: 0;
}
.fws-slabs-body .fws-slabs-toolbar { top: 78px; }

@media (max-width: 1040px) {
	.fws-shell-header { grid-template-columns: minmax(145px,1fr) auto minmax(150px,1fr); padding-inline: 22px; }
	.fws-shell-header__nav { gap: 24px; }
	.fws-shell-header__external { min-width: 0; }
	.fws-shell-header__external a:first-child { display: none; }
}

@media (max-width: 760px) {
	.fws-shell-header {
		align-items: center;
		display: grid;
		grid-template-columns: 1fr auto;
		height: 64px;
		padding: 0 16px;
	}
	.fws-shell-header__brand img { width: 126px; }
	.fws-shell-header__nav,
	.fws-shell-header__external { display: none; }
	.fws-shell-header__actions { height: 64px; }
	.fws-shell-header__selection { border-right: 0; padding: 0 0 0 16px; }
	.fws-shell-header__selection strong { height: 22px; min-width: 22px; }
	.fws-slabs-body .fws-slabs-toolbar { top: 64px; }
	.fws-slab-preview-body .fws-slab-hero { padding-top: 64px; }
}


/* 0.16.0 — responsive polish / navigation usability */
.fws-shell-header__mobile-nav { display: none; }

.fws-shell-header a:focus-visible,
.fws-shell-header button:focus-visible {
	outline: 1px solid var(--fws-gold, #b99a62);
	outline-offset: -2px;
}

@media (min-width: 761px) {
	.fws-shell-header__nav a { font-size: 9.5px; }
	.fws-shell-header__selection { font-size: 8.5px; }
}

@media (max-width: 760px) {
	.fws-shell-header {
		align-items: center;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-rows: 64px 42px;
		height: 106px;
		padding: 0 16px;
	}
	.fws-shell-header__brand,
	.fws-shell-header__actions { grid-row: 1; }
	.fws-shell-header__brand img { width: 128px; }
	.fws-shell-header__actions { height: 64px; }
	.fws-shell-header__selection {
		font-size: 9px;
		gap: 9px;
		min-height: 44px;
		padding-left: 14px;
	}
	.fws-shell-header__selection strong {
		font-size: 8px;
		height: 24px;
		min-width: 24px;
	}
	.fws-shell-header__mobile-nav {
		align-self: stretch;
		border-top: 1px solid rgba(255,255,255,.08);
		display: grid;
		grid-column: 1 / -1;
		grid-row: 2;
		grid-template-columns: repeat(3, minmax(0,1fr));
		margin: 0 -16px;
		min-width: 0;
	}
	.fws-shell-header__mobile-nav a {
		align-items: center;
		border-right: 1px solid rgba(255,255,255,.08);
		color: rgba(255,255,255,.52);
		display: flex;
		font-size: 8.5px;
		font-weight: 500;
		justify-content: center;
		letter-spacing: .11em;
		min-width: 0;
		position: relative;
		text-transform: uppercase;
	}
	.fws-shell-header__mobile-nav a:last-child { border-right: 0; }
	.fws-shell-header__mobile-nav a.is-active { color: var(--fws-gold, #b99a62); }
	.fws-shell-header__mobile-nav a.is-active::after {
		background: var(--fws-gold, #b99a62);
		bottom: 0;
		content: "";
		height: 1px;
		left: 22%;
		position: absolute;
		right: 22%;
	}
	.fws-slabs-body .fws-slabs-toolbar { top: 106px; }
	.fws-slab-preview-body .fws-slab-hero { padding-top: 106px; }
}

@media (max-width: 380px) {
	.fws-shell-header { padding-inline: 12px; }
	.fws-shell-header__brand img { width: 116px; }
	.fws-shell-header__selection > span { display: none; }
	.fws-shell-header__mobile-nav { margin-inline: -12px; }
	.fws-shell-header__mobile-nav a { font-size: 8px; letter-spacing: .08em; }
}
