/* Bowling Varese: pulsanti, menu, schede, footer, WhatsApp, testo degli editor. */

/* Pulsanti */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-2);
	padding: 0.85em 1.6em;
	border: 2px solid transparent;
	border-radius: var(--raggio-pillola);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: var(--peso-titolo);
	letter-spacing: var(--spaziatura-maiuscolo);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color var(--transizione), color var(--transizione), box-shadow var(--transizione), transform var(--transizione);
}

.btn--primario {
	background: var(--colore-magenta);
	color: var(--colore-su-magenta);
}

.btn--primario:hover {
	background: var(--colore-bianco);
	color: var(--colore-sfondo);
	box-shadow: var(--bagliore-magenta);
}

.btn--secondario {
	border-color: var(--colore-ciano);
	background: transparent;
	color: var(--colore-ciano);
}

.btn--secondario:hover {
	background: var(--colore-ciano);
	color: var(--colore-su-ciano);
	box-shadow: var(--bagliore-ciano);
}

@media (prefers-reduced-motion: no-preference) {
	.btn:hover {
		transform: translateY(-2px);
	}
}

.nav-principale__cta {
	flex: none;
	align-self: center;
}

/* Pulsante del menu mobile */
.menu-toggle {
	display: none;
	position: relative;
	flex: none;
	width: 3rem;
	height: 3rem;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--colore-bianco);
	cursor: pointer;
}

.js .menu-toggle {
	display: block;
}

.menu-toggle__barre,
.menu-toggle__barre::before,
.menu-toggle__barre::after {
	position: absolute;
	left: 50%;
	width: 1.75rem;
	height: 3px;
	border-radius: 2px;
	background: currentColor;
	transform: translateX(-50%);
	transition: transform var(--transizione), top var(--transizione), background-color var(--transizione);
}

.menu-toggle__barre {
	top: 50%;
	margin-top: -1.5px;
}

.menu-toggle__barre::before,
.menu-toggle__barre::after {
	content: "";
	left: 50%;
}

.menu-toggle__barre::before {
	top: -0.5rem;
	transform: translateX(-50%);
}

.menu-toggle__barre::after {
	top: 0.5rem;
	transform: translateX(-50%);
}

.menu-aperto .menu-toggle__barre {
	background: transparent;
}

.menu-aperto .menu-toggle__barre::before {
	top: 0;
	transform: translateX(-50%) rotate(45deg);
}

.menu-aperto .menu-toggle__barre::after {
	top: 0;
	transform: translateX(-50%) rotate(-45deg);
}

@media (min-width: 80em) {
	.js .menu-toggle {
		display: none;
	}
}

/* Intestazione di pagina */
.intestazione-pagina {
	padding-block: var(--sp-8) var(--sp-7);
	text-align: center;
}

.titolo--pagina {
	font-size: var(--titolo-2);
	text-shadow: var(--neon-magenta);
}

.sottotitolo {
	margin: 0 auto;
	max-width: 40rem;
	font-size: var(--testo-lead);
	color: var(--colore-testo-attenuato);
}

/* Testo scritto nell'editor */
.contenuto > *:last-child {
	margin-bottom: 0;
}

.contenuto h2,
.contenuto h3,
.contenuto h4 {
	margin-top: var(--sp-7);
}

.contenuto img {
	border-radius: var(--raggio-m);
}

.contenuto blockquote {
	margin: var(--sp-6) 0;
	padding-left: var(--sp-5);
	border-left: 4px solid var(--colore-magenta);
	font-size: var(--testo-lead);
}

.alignleft {
	float: left;
	margin: 0 var(--sp-5) var(--sp-4) 0;
}

.alignright {
	float: right;
	margin: 0 0 var(--sp-4) var(--sp-5);
}

.aligncenter {
	margin-inline: auto;
}

.wp-caption-text,
figcaption {
	font-size: var(--testo-piccolo);
	color: var(--colore-testo-attenuato);
}

/* Schede articolo */
.scheda {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--colore-bordo);
	border-radius: var(--raggio-m);
	background: var(--colore-sfondo-alt);
}

.scheda__immagine img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.scheda__corpo {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--sp-2);
	padding: var(--sp-5);
}

.scheda__data {
	font-size: var(--testo-piccolo);
	color: var(--colore-testo-attenuato);
}

.scheda__titolo {
	margin: 0;
	font-size: var(--titolo-4);
}

.scheda__titolo a {
	color: var(--colore-bianco);
	text-decoration: none;
}

.scheda__titolo a:hover {
	color: var(--colore-ciano);
}

.scheda__estratto > *:last-child {
	margin-bottom: 0;
}

.scheda__link {
	margin-top: auto;
	font-weight: var(--peso-forte);
}

.articolo__data {
	color: var(--colore-testo-attenuato);
	text-align: center;
}

.articolo__immagine {
	margin-bottom: var(--sp-6);
}

.articolo__indietro {
	margin-top: var(--sp-7);
}

/* Paginazione */
.pagination {
	margin-top: var(--sp-7);
}

.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--sp-2);
}

.pagination .page-numbers {
	display: inline-block;
	min-width: 2.75rem;
	padding: var(--sp-2) var(--sp-4);
	border: 1px solid var(--colore-bordo);
	border-radius: var(--raggio-pillola);
	color: var(--colore-bianco);
	text-align: center;
	text-decoration: none;
}

.pagination .page-numbers.current,
.pagination a.page-numbers:hover {
	border-color: var(--colore-ciano);
	color: var(--colore-ciano);
}

/* Modulo di ricerca e campi */
.modulo-ricerca {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-3);
	margin-top: var(--sp-6);
}

.campo {
	flex: 1 1 14rem;
	min-width: 0;
	padding: 0.85em 1.1em;
	border: 2px solid var(--colore-bordo);
	border-radius: var(--raggio-m);
	background: var(--colore-sfondo-alt);
	color: var(--colore-bianco);
	font: inherit;
}

.campo:focus-visible {
	border-color: var(--colore-ciano);
	outline-offset: 2px;
}

/* Footer */
.footer-colonna--marchio .logo__img {
	width: min(100%, 18rem);
	height: auto;
	margin-bottom: var(--sp-5);
}

.footer-testo {
	max-width: 28rem;
	line-height: 1.9;
}

.footer-titolo {
	margin-bottom: var(--sp-5);
	color: var(--colore-ciano);
	font-size: var(--titolo-4);
	font-weight: 500;
	letter-spacing: var(--spaziatura-maiuscolo);
}

.footer-elenco {
	display: grid;
	gap: var(--sp-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-elenco li {
	display: flex;
	align-items: flex-start;
	gap: var(--sp-3);
}

.footer-elenco .icona {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 0.2em;
	color: var(--colore-ciano);
}

.footer-elenco .icona--piena {
	fill: currentColor;
}

.sito-footer a {
	color: var(--colore-bianco);
	text-decoration: none;
}

.sito-footer a:hover {
	color: var(--colore-ciano);
	text-decoration: underline;
}

.footer-nota {
	margin-bottom: var(--sp-5);
	line-height: 1.9;
}

.footer-orari {
	display: grid;
	gap: var(--sp-3);
	margin: 0;
}

/* Giorni sopra e orario sotto, sempre uguale per tutte le righe */
.footer-orari__riga {
	display: grid;
	gap: var(--sp-1);
}

.footer-orari dt {
	font-weight: var(--peso-forte);
}

.footer-orari dd {
	margin: 0;
}

.orario {
	white-space: nowrap;
}

.footer-societa {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--sp-1) var(--sp-5);
	margin: 0;
}

.menu-legale {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--sp-2) var(--sp-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-firma {
	margin: 0;
}

.footer-firma a {
	font-weight: var(--peso-forte);
}

/* Pulsante WhatsApp flottante */
.whatsapp-flottante {
	position: fixed;
	bottom: var(--sp-5);
	left: var(--sp-5);
	z-index: var(--z-whatsapp);
	display: inline-flex;
	align-items: center;
	gap: var(--sp-3);
	padding: 0.75rem;
	border-radius: var(--raggio-pillola);
	background: var(--colore-whatsapp);
	color: var(--colore-bianco);
	font-size: var(--testo-piccolo);
	font-weight: var(--peso-forte);
	text-decoration: none;
	box-shadow: var(--ombra-scheda);
}

.whatsapp-flottante:hover {
	color: var(--colore-bianco);
}

.whatsapp-flottante .icona {
	flex: none;
	width: 2rem;
	height: 2rem;
}

.whatsapp-flottante__testo {
	display: none;
	padding-right: var(--sp-2);
	white-space: nowrap;
}

@media (hover: hover) and (min-width: 48em) {
	.whatsapp-flottante:hover .whatsapp-flottante__testo,
	.whatsapp-flottante:focus-visible .whatsapp-flottante__testo {
		display: inline;
	}
}