/* BoomBox Live — stile mobile-first. Colori/font in theme.json. */
:root {
	--bb-y: var(--wp--preset--color--giallo, #FFD200);
	--bb-m: var(--wp--preset--color--fucsia, #EE10E9);
	--bb-r: var(--wp--preset--color--rosso, #E2231A);
	--bb-c: var(--wp--preset--color--ciano, #1FC8DB);
	--bb-n: var(--wp--preset--color--notte, #1B0F2E);
	--bb-k: var(--wp--preset--color--nero, #0E0B14);
	--bb-w: #fff;
	--bb-radius: 18px;
	--bb-shadow: 4px 4px 0 var(--bb-k);
}
html { scroll-behavior: smooth; scroll-padding-top: 72px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; overflow-x: hidden; }
img { height: auto; max-width: 100%; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }

/* ---------- Header ---------- */
.bb-header {
	position: sticky; top: 0; z-index: 50;
	padding: .55rem 1rem calc(.55rem) ;
	background: rgba(27, 15, 46, .88);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	border-bottom: 3px solid var(--bb-m);
}
.admin-bar .bb-header { top: 46px; }
@media (min-width: 783px) { .admin-bar .bb-header { top: 32px; } }
.bb-header .bb-header__logo { margin: 0; }
.bb-header .bb-header__logo img { width: 132px; display: block; }
.bb-header__cta { margin: 0; }
.bb-btn-small .wp-block-button__link { padding: .45rem 1.1rem; font-size: 1rem; }

/* ---------- Sezioni ---------- */
.bb-main { margin: 0; }
.bb-main > .wp-block-post-content > .bb-section { margin-block: 0; }
.bb-section {
	padding-top: var(--wp--preset--spacing--60);
	padding-bottom: var(--wp--preset--spacing--60);
	text-align: center;
	position: relative;
}
.bb-section h2 { margin-top: 0; }
.bb-section .wp-block-buttons { justify-content: center; }
.bb-kicker {
	display: inline-block; margin: 0 auto .4rem !important;
	padding: .2rem .8rem; border-radius: 999px;
	background: var(--bb-r); color: #fff;
	font-family: var(--wp--preset--font-family--condensed); font-weight: 800;
	text-transform: uppercase; letter-spacing: .1em; font-size: .95rem;
}

/* Pulsanti outline */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: var(--bb-y); border-color: var(--bb-y);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--bb-y); color: var(--bb-k); }
.wp-block-button__link { box-shadow: var(--bb-shadow); transition: transform .12s ease, box-shadow .12s ease; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; }
.wp-block-button__link:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--bb-k); }

/* ---------- Hero ---------- */
.bb-hero {
	background:
		radial-gradient(circle at 50% 108%, rgba(255, 210, 0, .55) 0 18%, transparent 19%),
		linear-gradient(180deg, #1B0F2E 0%, #2c1046 50%, #7a0d78 100%);
	overflow: hidden;
	padding-top: clamp(2.2rem, 8vw, 4.5rem);
	padding-bottom: clamp(5.5rem, 22vw, 9rem);
}
.bb-hero::after { /* griglia synthwave */
	content: ""; position: absolute; left: -50%; right: -50%; bottom: 0; height: 42%;
	background:
		repeating-linear-gradient(90deg, rgba(31, 200, 219, .55) 0 2px, transparent 2px 64px),
		repeating-linear-gradient(0deg, rgba(31, 200, 219, .55) 0 2px, transparent 2px 34px);
	transform: perspective(260px) rotateX(62deg); transform-origin: bottom;
	-webkit-mask-image: linear-gradient(to top, #000 30%, transparent);
	mask-image: linear-gradient(to top, #000 30%, transparent);
	pointer-events: none;
}
.bb-hero > * { position: relative; z-index: 1; }
.bb-hero .bb-hero__logo { margin: 0 auto 1rem; max-width: 560px !important; }
.bb-hero .bb-hero__logo img { width: 100%; filter: drop-shadow(0 6px 0 rgba(0, 0, 0, .35)); }
.bb-hero__title {
	color: var(--bb-y);
	font-size: clamp(1.55rem, 6.4vw, 2.8rem) !important;
	text-shadow: 3px 3px 0 var(--bb-m), 6px 6px 0 var(--bb-k);
	margin: 0 auto .8rem;
}
.bb-hero__lead { font-size: 1.15rem; max-width: 34ch; margin-inline: auto !important; opacity: .95; }
.bb-hero__cta { gap: .9rem; margin-top: 1.6rem !important; flex-direction: column; align-items: center; }
.bb-hero__cta .wp-block-button { width: min(100%, 320px); }
.bb-hero__cta .wp-block-button__link { width: 100%; }
@media (min-width: 640px) { .bb-hero__cta { flex-direction: row; } .bb-hero__cta .wp-block-button { width: auto; } }

/* ---------- Pendrive ---------- */
.bb-pendrive { background: var(--bb-y); color: var(--bb-k); }
.bb-pendrive a:not(.wp-element-button) { color: var(--bb-r); }
.bb-pendrive__title { color: var(--bb-k); text-shadow: 3px 3px 0 var(--bb-m); }
.bb-pendrive .bb-pendrive__img { max-width: 340px !important; margin: 0 auto; }
.bb-pendrive .bb-pendrive__img img { width: 100%; animation: bb-float 4s ease-in-out infinite; }
@keyframes bb-float { 50% { transform: translateY(-8px) rotate(-1deg); } }
@media (prefers-reduced-motion: reduce) { .bb-pendrive .bb-pendrive__img img { animation: none; } }
.bb-checks { list-style: none; padding: 0; text-align: left; max-width: 26rem; margin-inline: auto !important; }
.bb-checks li { padding: .35rem 0 .35rem 2rem; position: relative; font-weight: 600; }
.bb-checks li::before {
	content: ""; position: absolute; left: 0; top: .55rem; width: 1.3rem; height: 1.3rem; border-radius: 50%;
	background: var(--bb-k) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3 3 7-7' fill='none' stroke='%23FFD200' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat;
}
.bb-buy {
	background: var(--bb-k); color: #fff; border-radius: var(--bb-radius);
	padding: 1.3rem 1.1rem 1.1rem; margin: 1.6rem auto 0; max-width: 26rem;
	box-shadow: 6px 6px 0 var(--bb-m);
}
.bb-buy__price { font-family: var(--wp--preset--font-family--display); font-size: 2.6rem; color: var(--bb-y); line-height: 1; margin-bottom: 1rem; }
.bb-buy__price del { opacity: .55; font-size: .55em; margin-right: .3em; }
.bb-buy__price ins { text-decoration: none; }
.bb-buy__price .woocommerce-price-suffix { display: block; font-family: var(--wp--preset--font-family--body); font-size: .85rem; color: #ddd; margin-top: .3rem; }
.bb-buy__row { display: flex; gap: .7rem; align-items: stretch; }
.bb-qty { display: flex; align-items: center; border: 2px solid var(--bb-y); border-radius: 999px; overflow: hidden; flex: none; }
.bb-qty__btn { appearance: none; background: transparent; color: var(--bb-y); border: 0; width: 44px; height: 48px; font-size: 1.5rem; line-height: 1; cursor: pointer; touch-action: manipulation; }
.bb-qty__btn:focus-visible { outline: 3px solid var(--bb-c); outline-offset: -3px; }
.bb-qty__val { min-width: 1.6rem; text-align: center; font-weight: 700; font-size: 1.2rem; }
.bb-buy__cta.wp-element-button {
	flex: 1; display: flex; align-items: center; justify-content: center; text-decoration: none;
	background: var(--bb-r); color: #fff; border-color: var(--bb-y); box-shadow: 3px 3px 0 var(--bb-y);
	font-family: var(--wp--preset--font-family--condensed); font-weight: 800; text-transform: uppercase;
	border-radius: 999px; border-width: 3px; border-style: solid; padding: .6rem 1rem; font-size: 1.2rem; min-height: 48px;
}
.bb-buy__cta.wp-element-button:hover { background: var(--bb-m); color: #fff; }
.bb-buy__note { font-size: .9rem; color: #ccc; margin: .8rem 0 0; }
.bb-buy__soldout { color: var(--bb-y); font-weight: 600; margin: 0; }
.bb-ship {
	background: #fff; border: 3px solid var(--bb-k); border-radius: var(--bb-radius); box-shadow: var(--bb-shadow);
	padding: 1.1rem 1.1rem .4rem; margin-top: 1.6rem !important; text-align: left;
}
.bb-ship h3 { font-size: 1.15rem !important; margin: 0 0 .5rem; }
.bb-ship p { font-size: 1rem; margin: 0 0 .7rem; }

/* ---------- Band ---------- */
.bb-band { background: var(--bb-n); }
.bb-band h2 { color: var(--bb-y); }
.bb-band__cover img { border: 3px solid var(--bb-y); border-radius: var(--bb-radius); box-shadow: 6px 6px 0 var(--bb-m); }
.bb-band p { text-align: left; }
.bb-members { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; margin-top: 1.8rem !important; }
.bb-member { margin: 0 !important; }
.bb-member figure { margin: 0 0 .5rem; }
.bb-member img { aspect-ratio: 3 / 4; object-fit: cover; width: 100%; border-radius: 12px; border: 2px solid var(--bb-c); }
.bb-member h3 { font-family: var(--wp--preset--font-family--condensed); font-weight: 800; font-size: 1.05rem !important; text-transform: uppercase; margin: 0; color: var(--bb-y); }
.bb-member p { text-align: center !important; font-size: .9rem; margin: .1rem 0 0; opacity: .85; line-height: 1.25; }

/* ---------- Live ---------- */
.bb-live { background: linear-gradient(160deg, #EE10E9 0%, #8a0fd1 100%); }
.bb-live h2 { color: #fff; text-shadow: 3px 3px 0 var(--bb-k); }
.bb-date {
	display: flex; align-items: center; gap: .9rem; text-align: left;
	background: var(--bb-k); border-radius: 14px; padding: .8rem 1rem; margin-inline: auto !important; max-width: 30rem;
	font-weight: 600;
}
.bb-date strong {
	flex: none; background: var(--bb-y); color: var(--bb-k); border-radius: 10px; padding: .35rem .55rem;
	font-family: var(--wp--preset--font-family--display); font-weight: 400; font-size: 1rem; line-height: 1.1; text-align: center;
}
.bb-live__note { max-width: 32ch; margin-inline: auto !important; }
.bb-live .is-style-outline > .wp-block-button__link { color: #fff; border-color: #fff; }

/* ---------- Contatti + Contact Form 7 ---------- */
.bb-contatti { background: var(--bb-n); }
.bb-contatti h2 { color: var(--bb-y); }
.bb-btn-wa .wp-block-button__link { background: #25D366; color: #0b2e17; }
.bb-btn-wa .wp-block-button__link::before {
	content: ""; width: 1.3em; height: 1.3em; margin-right: .5em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230b2e17' d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2c-1.5 0-3-.4-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8s-.4-.1-.6.1-.7.8-.8 1-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.3-.4.3-.4.8-1.4a.5.5 0 0 0 0-.4l-.8-1.9c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.2 5.2 5.2 0 0 0 1.1 2.8 11.8 11.8 0 0 0 4.6 4c1.7.7 2.3.8 3.2.7a2.7 2.7 0 0 0 1.8-1.3 2.2 2.2 0 0 0 .2-1.3c-.1-.1-.3-.2-.5-.3z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.bb-contatti .wpcf7 { text-align: left; max-width: 34rem; margin: 1.6rem auto 0; }
.bb-contatti .wpcf7 p { margin: 0 0 1rem; }
.bb-contatti .wpcf7 label { display: block; font-weight: 600; font-size: .95rem; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 input[type="date"], .wpcf7 select, .wpcf7 textarea {
	width: 100%; box-sizing: border-box; margin-top: .35rem;
	font: inherit; font-size: 16px; /* evita lo zoom automatico su iOS */
	padding: .8rem .9rem; border-radius: 12px; border: 2px solid #5b4a78; background: #120a20; color: #fff;
	-webkit-appearance: none; appearance: none;
}
.wpcf7 textarea { min-height: 8rem; resize: vertical; }
.wpcf7 input:focus, .wpcf7 select:focus, .wpcf7 textarea:focus { outline: none; border-color: var(--bb-y); box-shadow: 0 0 0 3px rgba(255, 210, 0, .35); }
.wpcf7 .wpcf7-acceptance { font-size: .95rem; font-weight: 400; }
.wpcf7 .wpcf7-acceptance input { width: 22px; height: 22px; vertical-align: middle; margin-right: .4rem; accent-color: var(--bb-y); }
.wpcf7 input[type="submit"] {
	width: 100%; min-height: 52px; border-radius: 999px; border: 3px solid var(--bb-k); box-shadow: 4px 4px 0 var(--bb-m);
	background: var(--bb-y); color: var(--bb-k); font-family: var(--wp--preset--font-family--condensed); font-weight: 800;
	font-size: 1.25rem; text-transform: uppercase; letter-spacing: .04em; cursor: pointer;
}
.wpcf7 .wpcf7-not-valid-tip { color: #ff8a8a; font-size: .9rem; }
.wpcf7 form .wpcf7-response-output { border-radius: 12px; margin: 1rem 0 0; }
.wpcf7 .wpcf7-spinner { display: block; margin: .6rem auto 0; }

/* ---------- Footer ---------- */
.bb-footer { background: var(--bb-k); text-align: center; padding: 2.5rem 1rem 6rem; border-top: 3px solid var(--bb-y); font-size: .95rem; }
.bb-footer .bb-footer__logo { max-width: 180px !important; margin: 0 auto .5rem; }
.bb-footer__claim { font-family: var(--wp--preset--font-family--condensed); text-transform: uppercase; letter-spacing: .12em; color: var(--bb-y); font-weight: 700; }
.bb-footer__links a, .bb-footer__copy a { color: #fff; }
.bb-footer__copy { opacity: .7; font-size: .85rem; }

/* ---------- Pagine interne (checkout, policy): fondo chiaro leggibile ---------- */
body:not(.home) .wp-site-blocks { background: #FFF6D6; color: var(--bb-k); }
body:not(.home) .bb-header, body:not(.home) .bb-footer { color: #fff; }
.bb-page { padding-top: 2rem; padding-bottom: 4rem; }
body:not(.home) .wp-site-blocks main a:not(.wp-element-button):not(.wc-block-components-button) { color: #b0170f; }
.bb-shop h1 { margin-bottom: 1rem; }
.bb-page h1 { font-size: clamp(1.6rem, 6vw, 2.4rem); }
body:not(.home) .wc-block-components-button:not(.is-link) { background: var(--bb-r); color: #fff; border-radius: 999px; min-height: 52px; font-weight: 700; }

/* Spazio per il pulsante WhatsApp flottante su mobile */
@media (max-width: 640px) { .bb-footer { padding-bottom: 7rem; } }
