/* ==========================================================================
   Header — tre aree equivalenti, logo centrato rispetto alla viewport
   Desktop ≥ 1280px: menu a sinistra. Sotto: hamburger + menu a tutto schermo.
   ========================================================================== */

.asm-header {
	position: sticky;
	top: var(--asm-admin-bar);
	z-index: 100;
	background: var(--asm-header-bg-solid);
	color: var(--asm-avorio);
	border-bottom: 1px solid var(--asm-header-line);
	transition:
		background-color 600ms var(--asm-ease),
		border-color 600ms var(--asm-ease);
}

/* Homepage: trasparente sopra la Hero, poi nero quando si scorre (classe .is-solid da header.js) */
.asm-header-overlay .asm-header { margin-bottom: calc(-1 * var(--asm-header-h)); }
.asm-header-overlay .asm-header:not(.is-solid) {
	background: transparent;
	border-bottom-color: transparent;
}

/* Le tre aree: le colonne laterali hanno sempre la stessa larghezza */
.asm-header__bar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	column-gap: 32px;
	height: var(--asm-header-h);
	padding-inline: var(--asm-gutter);
}
.asm-header__left { display: flex; align-items: center; min-width: 0; height: 100%; }
.asm-header__brand { display: flex; justify-content: center; }
.asm-header__right { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }

/* Logo (testo provvisorio o immagine caricata) */
.asm-logo { display: inline-flex; flex-direction: column; align-items: center; color: inherit; line-height: 1; text-decoration: none; }
.asm-logo__img { width: auto; max-height: calc(var(--asm-header-h) - 28px); }
.asm-logo__top {
	font-family: var(--asm-font-sans);
	font-size: 9px;
	letter-spacing: 0.5em;
	margin-right: -0.5em; /* compensa lo spazio dopo l'ultima lettera: centratura ottica */
	text-transform: uppercase;
	margin-bottom: 7px;
}
.asm-logo__main {
	font-family: var(--asm-font-display);
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}
.asm-logo:hover { color: inherit; }

/* Menu principale */
.asm-header__nav { height: 100%; }
.asm-nav {
	display: flex;
	align-items: stretch;
	gap: clamp(18px, 1.7vw, 34px);
	height: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.asm-nav__item { display: flex; align-items: center; }
.asm-nav__link {
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0;
	border: 0;
	background: none;
	color: var(--asm-avorio);
	font-family: var(--asm-font-sans);
	font-size: var(--asm-nav-size);
	font-weight: 400;
	letter-spacing: var(--asm-nav-tracking);
	text-transform: uppercase;
	white-space: nowrap;
	transition: color 260ms var(--asm-ease);
}
.asm-nav__label { position: relative; display: inline-block; }
.asm-nav__label::after {
	content: "";
	position: absolute;
	left: 0;
	right: var(--asm-nav-tracking); /* la linea non include lo spazio finale */
	bottom: -7px;
	height: 1px;
	background: var(--asm-oro);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 360ms var(--asm-ease);
}
.asm-nav__link:hover,
.asm-nav__link:focus-visible,
.asm-nav__link[aria-expanded="true"] { color: var(--asm-oro); }
.asm-nav__link:hover .asm-nav__label::after,
.asm-nav__link:focus-visible .asm-nav__label::after,
.asm-nav__link[aria-expanded="true"] .asm-nav__label::after,
.asm-nav__item.is-current > .asm-nav__link .asm-nav__label::after { transform: scaleX(1); }

/* Icone */
.asm-iconbtn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	transition: color 260ms var(--asm-ease);
}
.asm-iconbtn:hover, .asm-iconbtn[aria-expanded="true"] { color: var(--asm-oro); }
.asm-header .asm-icon { width: 19px; height: 19px; stroke-width: 1; }

/* Numero nel carrello: piccolo numero oro, nessun pallino */
.asm-cart-count {
	position: absolute;
	top: 5px;
	right: 1px;
	font-family: var(--asm-font-sans);
	font-size: 10px;
	font-weight: 500;
	line-height: 1;
	color: var(--asm-oro);
}
.asm-cart-count[hidden] { display: none; }

/* Focus visibile ovunque nell'header */
.asm-header :focus-visible,
.asm-mmenu :focus-visible { outline: 1px solid var(--asm-oro); outline-offset: 4px; }

/* Ricerca */
.asm-search {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	background: var(--asm-nero);
	border-top: 1px solid var(--asm-header-line);
	border-bottom: 1px solid var(--asm-header-line);
}
.asm-search[hidden] { display: none; }
.asm-search__inner { display: flex; align-items: center; gap: var(--asm-sp-5); padding-block: var(--asm-sp-6); }
.asm-search__form { flex: 1; display: flex; align-items: center; border-bottom: 1px solid rgba(241, 237, 227, 0.35); }
.asm-search__form input[type="search"] {
	flex: 1;
	min-width: 0;
	height: 56px;
	border: 0;
	background: transparent;
	color: var(--asm-avorio);
	font-family: var(--asm-font-display);
	font-size: var(--asm-fs-h3);
	outline: none;
	-webkit-appearance: none;
	appearance: none;
}
.asm-search__form input::placeholder { color: rgba(241, 237, 227, 0.4); }

/* ---- Breakpoint: sotto 1280px niente menu orizzontale, si usa il menu a tutto schermo ---- */
.asm-header__burger { display: none; margin-left: -9px; }

/* .is-compact: aggiunta da header.js quando le voci non entrano con eleganza */
.asm-header.is-compact .asm-header__nav { display: none; }
.asm-header.is-compact .asm-header__burger { display: inline-flex; }
.asm-header.is-compact .asm-header__right .asm-langsel { display: none; }

@media (max-width: 1279px) {
	.asm-header__nav { display: none; }
	.asm-header__burger { display: inline-flex; }
	.asm-header__right .asm-langsel { display: none; }
	.asm-logo__main { font-size: 21px; }
}
@media (max-width: 767px) {
	.asm-header__bar { column-gap: 12px; }
	.asm-header__search,
	.asm-header__account { display: none; }
	.asm-header__right { margin-right: -9px; }
	.asm-logo__main { font-size: 18px; letter-spacing: 0.05em; }
	.asm-logo__top { font-size: 8px; margin-bottom: 5px; }
	.asm-search__form input[type="search"] { font-size: 1.375rem; }
}