/*
 * Testata, super menù e menu da telefono (fase 4, 2026-10-20). Fonte: mockup di Claude Design, Camicie.html
 * 739-772 (CSS), 1179-1212 (markup e misure che prevalgono), SPEC-TESTATA-COLLEZIONE.md sezioni 1-3.
 * Soglie del mockup: menu orizzontale da 1000 px, «Scrivi a Daniele» da 761 px, sotto l'hamburger.
 */

/* ---------- nastro nero: tre frasi che si danno il cambio, in dissolvenza lenta, 12 secondi il giro (Nicola, 2026-10-27).
   Voto e recensioni riletti sulla scheda Google il 2026-10-26 (4,9, 57): vanno aggiornati a mano. ---------- */
.fiore-topbar { position: relative; overflow: hidden; }
.fiore-topbar > p { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; max-width: none !important; margin: 0 !important; padding-inline: 16px; white-space: nowrap; opacity: 0; animation: fiore-nastro 12s infinite; }
.fiore-topbar > p:nth-of-type(2) { animation-delay: 4s; }
.fiore-topbar > p:nth-of-type(3) { animation-delay: 8s; }
.fiore-topbar > p { text-align: center; overflow: hidden; text-overflow: ellipsis; }
.fiore-topbar a { display: inline-flex; align-items: center; gap: 8px; min-width: 0; color: inherit; text-decoration: none; }
/* da telefono una frase lunga non deve uscire dallo schermo: carattere e spaziatura un po' più stretti */
@media (max-width: 420px) { .fiore-topbar > p { padding-inline: 12px; font-size: 11px; letter-spacing: .06em; } }
.fiore-topbar__g { width: 13px; height: 13px; filter: grayscale(1) brightness(1.9) contrast(.9); opacity: .85; }
@keyframes fiore-nastro {
	0% { opacity: 0; transform: translateY(3px); }
	9% { opacity: 1; transform: none; }
	30% { opacity: 1; transform: none; }
	39% { opacity: 0; transform: translateY(-3px); }
	100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.fiore-topbar > p { animation: none; }
	.fiore-topbar > p:first-of-type { opacity: 1; }
}

/* ---------- barra ---------- */
.fiore-header__riga { height: 58px; gap: 16px !important; }
.fiore-header .fiore-logo { flex: 0 0 auto; }
.fiore-header .fiore-logo img { height: 32px !important; width: auto !important; }

/* Menu al centro (computer). */
.fiore-header__nav { display: none !important; }
.fiore-header__nav .wp-block-navigation-item__content { padding: 6px 0; border-bottom: 2px solid transparent; transition: border-color .18s ease; }
.fiore-header__nav .wp-block-navigation-item__content:hover,
.fiore-header__nav .wp-block-navigation-item__content[aria-current],
.fiore-header__nav .wp-block-navigation-item.is-mega-aperto > .wp-block-navigation-item__content { border-color: currentColor; }

/* Azioni a destra: stesso carattere del menu. */
.fiore-header__azioni { gap: 18px !important; font: 400 12px/1 var(--wp--preset--font-family--sans); letter-spacing: .12em; text-transform: uppercase; }
.fiore-header__azioni .fiore-carrello-apri { color: inherit; text-decoration: none; white-space: nowrap; }
.fiore-header__cta { display: none !important; margin: 0; }
.fiore-header__cta .wp-block-button__link { min-height: 38px; padding: 0 16px; display: inline-flex; align-items: center; font-weight: 400; font-size: 12px; letter-spacing: .12em; transition: background-color .2s ease, color .2s ease; }

/* Hamburger 44×44, tre linee da 2 px. */
.fiore-burger { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 11px; border: 0; background: none; cursor: pointer; color: inherit; margin-right: -11px; }
.fiore-burger span { display: block; height: 2px; background: currentColor; }
.fiore-header .wp-block-html, .fiore-header .wp-block-html > * { margin: 0; }

@media (min-width: 761px) {
	.fiore-header__cta { display: flex !important; }
}
@media (min-width: 1000px) {
	.fiore-header__riga { height: 62px; }
	.fiore-header .fiore-logo img { height: 36px !important; }
	.fiore-header__nav { display: flex !important; }
	.fiore-burger { display: none; }
}
/* Con Maglieria le voci sono sei (2026-10-27): fino a 1199 px si stringono, sempre su una riga. */
@media (min-width: 1000px) and (max-width: 1199px) {
	.fiore-header__nav { gap: 16px !important; flex-wrap: nowrap !important; }
	.fiore-header__nav .wp-block-navigation-item__content { letter-spacing: .05em; white-space: nowrap; }
	.fiore-header__azioni { gap: 12px !important; }
	.fiore-header__cta .wp-block-button__link { padding: 0 12px; white-space: nowrap; letter-spacing: .06em; }
}

/* ---------- home: trasparente in cima, poi bianca al 90% con sfocatura, si attenua scendendo ---------- */
.home .fiore-header { transition: background-color .35s ease, border-color .35s ease, opacity .45s ease; }
.home .fiore-header.is-scrolled { background: rgba(255,255,255,.9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.home .fiore-header.is-mega:not(#fiore) { background: var(--wp--preset--color--paper); border-color: var(--wp--preset--color--line); -webkit-backdrop-filter: none; backdrop-filter: none; opacity: 1; }
.home .fiore-header.is-mega .fiore-logo--light { display: none; }
.home .fiore-header.is-mega .fiore-logo--dark { display: block; }
.home .fiore-header.is-mega :where(a, .fiore-burger) { color: var(--wp--preset--color--ink); }
.home .fiore-header.is-mega .fiore-header__cta .wp-block-button__link { color: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--ink); }
.home .fiore-header:not(.is-scrolled):not(.is-mega) :where(.fiore-header__riga a, .fiore-burger) { color: var(--wp--preset--color--paper); }
.home .fiore-header:not(.is-scrolled):not(.is-mega) .fiore-header__cta .wp-block-button__link { border-color: var(--wp--preset--color--paper); }
@media (min-width: 1000px) {
	.home .fiore-header.is-scrolled.is-scende:not(.is-mega):not(:hover):not(:focus-within) { opacity: .45; background: rgba(255,255,255,.6); }
}

/* ---------- super menù ---------- */
/* Il pannello sta sopra la pagina, non la spinge giù (revisione del 2026-10-20). */
.fiore-header { position: relative; }
.fiore-mega { display: none; position: absolute; top: 100%; left: 0; right: 0; box-shadow: 0 1px 0 var(--wp--preset--color--line); max-width: none !important; margin: 0 !important; border-top: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); }
.fiore-header.is-mega .fiore-mega { display: block; }
.fiore-mega__pannello { display: none; box-sizing: content-box; max-width: 1280px; margin: 0 auto !important; padding: 28px var(--wp--preset--spacing--gutter) 32px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .7fr); gap: 32px; }
.fiore-mega__pannello.fiore-mega--largo { grid-template-columns: minmax(0, 2fr) minmax(0, .7fr); }
/* Maglieria: quattro tipi in fila, foto più piccola (2026-10-27). */
.fiore-mega__pannello.fiore-mega--quattro { grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, .8fr); gap: 24px; }
.fiore-mega--quattro .fiore-mega__scheda { grid-template-columns: 84px minmax(0, 1fr); gap: 14px; }
.fiore-mega--quattro .fiore-mega__foto img { width: 84px !important; }
.fiore-mega--quattro .fiore-mega__titolo { font-size: 18px; }
.fiore-mega__pannello.is-aperto { display: grid; }
.fiore-mega__pannello > * { margin: 0 !important; }

.fiore-mega__scheda { position: relative; display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 18px; align-items: center; }
.fiore-mega__scheda > * { margin: 0 !important; }
.fiore-mega__foto img { width: 120px !important; aspect-ratio: 4 / 5; object-fit: cover; display: block; background: var(--wp--preset--color--paper-alt); }
.fiore-mega__testo { display: grid; gap: 6px; }
.fiore-mega__testo > * { margin: 0 !important; }
.fiore-mega__titolo { font: var(--peso-titolo, 400) 20px/1.2 var(--wp--preset--font-family--serif); color: var(--wp--preset--color--ink); }
.fiore-mega__frase, .fiore-mega__nota { font: 400 14px/1.45 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--text); text-wrap: pretty; }
.fiore-mega--cravatte .fiore-mega__frase { max-width: 38ch; }
.fiore-mega__link { margin-top: 4px !important; }
.fiore-mega__link a { display: inline-block; font: 900 12px/1 var(--wp--preset--font-family--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--ink); text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 5px; }
/* Il link della scheda copre tutta la scheda: si clicca anche sulla foto. */
.fiore-mega__scheda .fiore-mega__link a::after { content: ""; position: absolute; inset: 0; }
.fiore-mega__scheda:hover .fiore-mega__titolo { color: var(--wp--preset--color--ink-soft); }
.fiore-mega__scheda:hover .fiore-mega__foto img { opacity: .92; }

.fiore-mega__servizio { display: grid; gap: 12px; align-content: start; border-left: 1px solid var(--wp--preset--color--line); padding-left: 28px; }
.fiore-mega__servizio > * { margin: 0 !important; }
.fiore-mega__voce a { font: 400 13px/1.3 var(--wp--preset--font-family--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--ink); text-decoration: none; }
.fiore-mega__voce a:hover { text-decoration: underline; text-underline-offset: 4px; }
.fiore-mega__voce + .fiore-mega__nota { margin-top: 8px !important; }
.fiore-mega__servizio .fiore-mega__link { justify-self: start; }
.fiore-mega__bottone .wp-block-button__link { border-width: 1px; }
.fiore-mega__bottone .wp-block-button__link:hover { background: transparent; color: var(--wp--preset--color--ink); }
.fiore-header .fiore-mega a { color: var(--wp--preset--color--ink); }
.fiore-header .fiore-mega .fiore-mega__bottone .wp-block-button__link { color: var(--wp--preset--color--paper); }
.fiore-header .fiore-mega .fiore-mega__bottone .wp-block-button__link:hover { color: var(--wp--preset--color--ink); }

/* ---------- menu da telefono ---------- */
.fiore-pannello { display: none; position: fixed; inset: 0; z-index: 90; flex-direction: column; overflow-y: auto; background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); margin: 0 !important; }
.fiore-pannello.is-aperto { display: flex; }
body.admin-bar .fiore-pannello { top: var(--wp-admin--admin-bar--height, 0px); }
.fiore-pannello > * { margin: 0 !important; }
.fiore-pannello__testa { display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; height: 74px; padding-inline: var(--wp--preset--spacing--gutter); border-bottom: 1px solid var(--wp--preset--color--line); }
.fiore-pannello__testa img { height: 38px; width: auto; display: block; }
.fiore-pannello__chiudi { min-width: 44px; min-height: 44px; margin-right: -8px; border: 0; background: none; cursor: pointer; font: 900 12px/1 var(--wp--preset--font-family--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--ink); }

.fiore-pannello__voci { padding: 10px var(--wp--preset--spacing--gutter) 0; }
.fiore-pannello__voci > * { margin: 0 !important; }
.fiore-pannello__voce { border-bottom: 1px solid var(--wp--preset--color--line); padding: 0; }
.fiore-pannello__voce > a, .fiore-pannello__voce > summary { display: flex; align-items: center; justify-content: space-between; min-height: 60px; font: var(--peso-titolo, 400) 26px/1.15 var(--wp--preset--font-family--serif); color: var(--wp--preset--color--ink); text-decoration: none; cursor: pointer; list-style: none; }
.fiore-pannello__voce > summary::-webkit-details-marker { display: none; }
.fiore-pannello__voce > summary::after { content: "+"; font: 400 26px/1 var(--wp--preset--font-family--sans); }
.fiore-pannello__voce[open] > summary::after { content: "\2212"; }
.fiore-pannello__voce > :not(summary) { margin: 0 !important; }
details.fiore-pannello__voce > :last-child:not(summary) { padding-bottom: 14px; }

.fiore-pannello__sotto { margin: 0 !important; }
.fiore-pannello__sotto:not(.fiore-pannello__sotto--foto) { display: flex; }
.fiore-pannello__sotto a { flex: 1; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; min-height: 44px; padding: 8px 0; box-sizing: border-box; font: 400 16px/1.3 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--ink); text-decoration: none; }
.fiore-pannello__sotto small { font-size: 13.5px; color: var(--wp--preset--color--muted); }
.fiore-pannello__sotto:not(.fiore-pannello__sotto--foto) small { align-self: center; }
/* Con la foto: miniatura a sinistra, nome e nota uno sotto l'altro; il link copre la riga. */
.fiore-pannello__sotto--foto { position: relative; gap: 14px !important; align-items: center !important; padding: 8px 0; }
.fiore-pannello__sotto--foto > * { margin: 0 !important; }
.fiore-pannello__sotto--foto figure img { width: 48px !important; height: 60px !important; object-fit: cover; display: block; }
.fiore-pannello__sotto--foto p { display: grid; gap: 2px; font: 400 16px/1.3 var(--wp--preset--font-family--sans); }
.fiore-pannello__sotto--foto p br { display: none; }
.fiore-pannello__sotto--foto a { display: inline; min-height: 0; padding: 0; }
.fiore-pannello__sotto--foto a::after { content: ""; position: absolute; inset: 0; }

.fiore-pannello__piede { margin-top: auto !important; padding: 22px var(--wp--preset--spacing--gutter) 28px; display: grid !important; gap: 10px !important; }
.fiore-pannello__piede > .wp-block-button { width: 100%; margin: 0; }
.fiore-pannello__piede .wp-block-button__link { width: 100%; box-sizing: border-box; border-width: 1px; }

html.fiore-pannello-aperto { overflow: hidden; }

/* Fuoco da tastiera visibile anche sulla foto scura della home. */
.home .fiore-header:not(.is-scrolled):not(.is-mega) :focus-visible { outline-color: var(--wp--preset--color--paper) !important; }

@media (prefers-reduced-motion: reduce) {
	.home .fiore-header, .fiore-header__nav .wp-block-navigation-item__content, .fiore-header__cta .wp-block-button__link { transition: none; }
}

/* Revisione del 2026-10-20, voce 16: voci e «Carrello» in nero pieno come nel mockup (sulla home in cima restano
   bianche: la regola della home è più specifica). */
.fiore-header .fiore-header__nav .wp-block-navigation-item__content, .fiore-header .fiore-header__azioni .fiore-carrello-apri { color: var(--wp--preset--color--ink); }