/*
 * TikTokBanner (screens.jsx dell'oracolo, `function TikTokBanner()`) — banner
 * scuro con CTA social. Uso reale: sezione `.fm-tiktok` già nel contenuto
 * vero della home page (ID 1442915), link reale già presente
 * (https://www.tiktok.com/@flashmac_shop, da un Customizer di flashmac-sf
 * — flashmac_sf_social_tiktok — non portato in questo tema: da valutare se
 * serve un controllo equivalente qui, per ora il link resta quello scritto
 * nel blocco). Sfondo Band "a" nell'oracolo = bg-base = stesso colore dello
 * sfondo pagina (theme.json): nessun "breakout" full-bleed necessario qui,
 * a differenza di TrustBar/PromoCards (Band "b" = bianco, distinto dallo
 * sfondo pagina) — la card scura è l'unico elemento visivamente distinto.
 *
 * Il bottone reale ha già una classe propria (fm-btn-light, non una delle
 * nostre Stili registrate) ma il colore di default (gradiente "flash") già
 * coincide con la richiesta dell'oracolo per questo banner — nessuna CSS
 * dedicata a .fm-btn-light necessaria.
 */
.fm-tiktok {
	position: relative;
	overflow: hidden;
	max-width: var(--wp--custom--shell--default);
	margin: var(--wp--preset--spacing--8) auto;
	padding: var(--wp--preset--spacing--7) var(--wp--custom--gutter-shell);
	border-radius: var(--wp--custom--radius--xl);
	background: var(--wp--preset--color--ink-950);
}
.fm-tiktok::before {
	content: "";
	position: absolute;
	top: -40px;
	right: 80px;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	background: var(--wp--preset--gradient--violet);
	filter: blur(80px);
	opacity: 0.4;
}
.fm-tiktok::after {
	content: "♪";
	position: absolute;
	right: 48px;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--wp--preset--font-family--display);
	font-weight: var(--wp--custom--fw--bold);
	font-size: 120px;
	line-height: 1;
	color: rgba(255, 255, 255, 0.06);
}
@media (max-width: 767px) {
	.fm-tiktok::after {
		display: none;
	}
}

.fm-tiktok .fm-kick {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	font-family: var(--wp--preset--font-family--spec);
	font-size: var(--wp--preset--font-size--xxxs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: var(--wp--custom--fw--bold);
	color: var(--wp--custom--on-accent);
	background: rgba(255, 255, 255, 0.12);
	padding: 5px 12px;
	border-radius: var(--wp--custom--radius--pill);
}

.fm-tiktok > h2 {
	position: relative;
	max-width: 560px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: var(--wp--custom--fw--bold);
	font-size: var(--wp--preset--font-size--xxxl);
	letter-spacing: -0.02em;
	margin: 16px 0 8px;
	color: var(--wp--custom--on-accent);
}

.fm-tiktok > p {
	position: relative;
	max-width: 400px;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.5;
	margin: 0 0 22px;
	color: var(--wp--preset--color--ink-200);
}
.fm-tiktok > p strong {
	color: var(--wp--custom--on-accent);
}