/* =============================================================
   3Blaze Glass — materiale "liquid glass"
   Caricato su sito ed editor (enqueue_block_assets).
   Le variabili --blz-<settore>(-rgb) arrivano da wp-admin → 3Blaze → Settori.

   Regola del brand (logo LUISA): il vetro è PURO e trasparente.
   Il colore dei settori vive solo sul bordo e nella luce che il vetro
   riflette, mai come riempimento.

   1. Token        3. Bottoni (vetro puro, bordi di settore)
   2. Pannelli     4. Read more · 5. Tipografia di stile · 6. Immagini
   ============================================================= */

/* ── 1. Token ────────────────────────────────────────────────── */
:root {
	--blz-glass-blur: var(--wp--custom--glass--blur, 22px);
	--blz-glass-radius: var(--wp--custom--glass--radius, 28px);
	--blz-ease: var(--wp--custom--motion--ease, cubic-bezier(0.22, 1, 0.36, 1));
	--blz-aurora: linear-gradient(100deg, var(--blz-ia, #9b6bff) 0%, var(--blz-press, #2fe3a0) 50%, var(--blz-social, #3aa8ff) 100%);
	/* Corpo del vetro: luce bianca dall'alto, quasi niente in basso */
	--blz-glass-body: linear-gradient(165deg, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.045) 42%, rgba(255, 255, 255, 0.02) 100%);
	/* Testo "argento liquido": bianco che sfuma, per numeri e parole in evidenza */
	--blz-silver: linear-gradient(180deg, #ffffff 0%, #ecebf2 45%, #a9a9ba 100%);
	/* Bordo acceso (hover/focus): vetro più luminoso, mai colorato */
	--blz-rim-lit: inset 0 0 0 1px rgba(255, 255, 255, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 24px -8px rgba(255, 255, 255, 0.45);
	/* Filo di luce bianca sul bordo (vetro neutro) */
	--blz-rim-white: linear-gradient(160deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.1) 38%, rgba(255, 255, 255, 0.04) 62%, rgba(255, 255, 255, 0.32) 100%);
}

/* Maschera che lascia visibile solo il bordo da 1px di uno pseudo-elemento */
.blz-rim-mask,
.is-style-glass::before,
.is-style-glass-ia::before,
.is-style-glass-press::before,
.is-style-glass-social::before,
.wp-block-button__link::before,
.blz-btn-glass::before,
.blz-more__circle::before {
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}

/* ── 2. Pannelli (Gruppo, Colonna, Copertina, Media e testo) ── */
.is-style-glass,
.is-style-glass-ia,
.is-style-glass-press,
.is-style-glass-social {
	--g-rgb: 255, 255, 255;
	--g-light: 0.05;
	--g-rim: var(--blz-rim-white);

	position: relative;
	isolation: isolate;
	border-radius: var(--blz-glass-radius);
	padding: clamp(1.5rem, 3vw, 2.75rem);
	background:
		radial-gradient(120% 80% at 0% 0%, rgba(var(--g-rgb), var(--g-light)) 0%, rgba(var(--g-rgb), 0) 55%),
		var(--blz-glass-body);
	-webkit-backdrop-filter: blur(var(--blz-glass-blur)) saturate(160%);
	backdrop-filter: blur(var(--blz-glass-blur)) saturate(160%);
	box-shadow:
		inset 0 1px 1px rgba(255, 255, 255, 0.28),
		inset 0 -1px 0 rgba(255, 255, 255, 0.04),
		0 40px 90px -45px rgba(var(--g-rgb), calc(var(--g-light) * 2.4)),
		0 24px 60px -30px rgba(0, 0, 0, 0.75);
	transition: box-shadow var(--wp--custom--motion--base, 420ms) var(--blz-ease),
		transform var(--wp--custom--motion--base, 420ms) var(--blz-ease);
}

/* Settori: la luce si riflette dall'angolo, il colore pieno è solo sul bordo */
.is-style-glass-ia     { --g-rgb: var(--blz-ia-rgb, 155, 107, 255);    --g-light: 0.2;  --g-rim: linear-gradient(140deg, var(--blz-ia, #9b6bff) 0%, rgba(255, 255, 255, 0.18) 30%, rgba(255, 255, 255, 0.05) 62%, rgba(var(--blz-ia-rgb, 155, 107, 255), 0.55) 100%); }
.is-style-glass-press  { --g-rgb: var(--blz-press-rgb, 47, 227, 160);  --g-light: 0.17; --g-rim: linear-gradient(140deg, var(--blz-press, #2fe3a0) 0%, rgba(255, 255, 255, 0.18) 30%, rgba(255, 255, 255, 0.05) 62%, rgba(var(--blz-press-rgb, 47, 227, 160), 0.55) 100%); }
.is-style-glass-social { --g-rgb: var(--blz-social-rgb, 58, 168, 255); --g-light: 0.2;  --g-rim: linear-gradient(140deg, var(--blz-social, #3aa8ff) 0%, rgba(255, 255, 255, 0.18) 30%, rgba(255, 255, 255, 0.05) 62%, rgba(var(--blz-social-rgb, 58, 168, 255), 0.55) 100%); }

.is-style-glass::before,
.is-style-glass-ia::before,
.is-style-glass-press::before,
.is-style-glass-social::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	padding: 1px;
	border-radius: inherit;
	background: var(--g-rim);
	pointer-events: none;
}

/* Riflesso: lama di luce sul terzo superiore */
.is-style-glass::after,
.is-style-glass-ia::after,
.is-style-glass-press::after,
.is-style-glass-social::after {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 42%;
	z-index: 1;
	border-radius: inherit;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 100%);
	pointer-events: none;
}

.wp-block-cover.is-style-glass,
.wp-block-cover[class*="is-style-glass-"] {
	overflow: hidden;
	padding: clamp(1.5rem, 4vw, 3.5rem);
}

:is(.is-style-glass, .is-style-glass-ia, .is-style-glass-press, .is-style-glass-social):has(a):hover {
	transform: translateY(-3px);
	box-shadow:
		inset 0 1px 1px rgba(255, 255, 255, 0.34),
		inset 0 -1px 0 rgba(255, 255, 255, 0.05),
		0 50px 110px -45px rgba(var(--g-rgb), calc(var(--g-light) * 3.4)),
		0 28px 70px -30px rgba(0, 0, 0, 0.8);
}

/* ── 3. Bottoni: vetro puro ──────────────────────────────────── */
.wp-block-button .wp-block-button__link,
.blz-btn-glass {
	--rim: var(--blz-rim-white);
	--glow: 0 0 0 transparent;

	position: relative;
	isolation: isolate;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6em;
	overflow: hidden;
	border: 0;
	border-radius: 999px;
	background: var(--blz-glass-body);
	-webkit-backdrop-filter: blur(16px) saturate(170%);
	backdrop-filter: blur(16px) saturate(170%);
	box-shadow:
		inset 0 1px 1px rgba(255, 255, 255, 0.4),
		inset 0 -10px 18px -10px rgba(255, 255, 255, 0.08),
		0 12px 30px -14px rgba(0, 0, 0, 0.7),
		var(--glow);
	color: var(--wp--preset--color--white, #fff);
	text-decoration: none;
	transition: transform var(--wp--custom--motion--fast, 180ms) ease,
		box-shadow var(--wp--custom--motion--base, 420ms) var(--blz-ease),
		background var(--wp--custom--motion--base, 420ms) var(--blz-ease);
}

.blz-btn-glass {
	min-height: 44px;
	padding: 0 1.5em;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--xs, 0.75rem);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Bordo: filo di luce (bianco, o di settore nelle varianti) */
.wp-block-button__link::before,
.blz-btn-glass::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	padding: 1px;
	border-radius: inherit;
	background: var(--rim);
	pointer-events: none;
}

/* Riflesso che attraversa il vetro al passaggio */
.wp-block-button__link::after,
.blz-btn-glass::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.22) 48%, rgba(255, 255, 255, 0.04) 56%, transparent 70%);
	transform: translateX(-120%);
	transition: transform 0.9s var(--blz-ease);
	pointer-events: none;
}

.wp-block-button__link:hover,
.blz-btn-glass:hover {
	transform: translateY(-1px);
	background: linear-gradient(165deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.07) 45%, rgba(255, 255, 255, 0.03) 100%);
	color: var(--wp--preset--color--white, #fff);
}
.wp-block-button__link:hover::after,
.blz-btn-glass:hover::after {
	transform: translateX(120%);
}
.wp-block-button__link:active,
.blz-btn-glass:active {
	transform: translateY(0) scale(0.98);
}
.wp-block-button__link:focus-visible,
.blz-btn-glass:focus-visible {
	outline: 2px solid rgba(255, 255, 255, 0.85);
	outline-offset: 3px;
}

/* Varianti: il colore è solo nel bordo (e in un alone leggerissimo) */
.wp-block-button.is-style-aurora .wp-block-button__link,
.blz-btn-glass--rim {
	--rim: var(--blz-aurora);
	--glow: 0 0 26px -10px rgba(var(--blz-ia-rgb, 155, 107, 255), 0.55);
}
.wp-block-button.is-style-rim-ia .wp-block-button__link {
	--rim: linear-gradient(140deg, var(--blz-ia, #9b6bff), rgba(255, 255, 255, 0.25) 45%, var(--blz-ia, #9b6bff));
	--glow: 0 0 26px -10px rgba(var(--blz-ia-rgb, 155, 107, 255), 0.6);
}
.wp-block-button.is-style-rim-press .wp-block-button__link {
	--rim: linear-gradient(140deg, var(--blz-press, #2fe3a0), rgba(255, 255, 255, 0.25) 45%, var(--blz-press, #2fe3a0));
	--glow: 0 0 26px -10px rgba(var(--blz-press-rgb, 47, 227, 160), 0.55);
}
.wp-block-button.is-style-rim-social .wp-block-button__link {
	--rim: linear-gradient(140deg, var(--blz-social, #3aa8ff), rgba(255, 255, 255, 0.25) 45%, var(--blz-social, #3aa8ff));
	--glow: 0 0 26px -10px rgba(var(--blz-social-rgb, 58, 168, 255), 0.6);
}

/* Testo con freccia (nessun vetro): per link secondari accanto a un bottone */
.wp-block-button.is-style-ghost .wp-block-button__link {
	padding-left: 0;
	padding-right: 0;
	background: transparent;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	box-shadow: none;
	overflow: visible;
}
.wp-block-button.is-style-ghost .wp-block-button__link::before { content: none; }
.wp-block-button.is-style-ghost .wp-block-button__link::after {
	content: "";
	position: static;
	z-index: auto;
	width: 2.6em;
	height: 2.6em;
	flex: 0 0 auto;
	border-radius: 50%;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 40% no-repeat,
		var(--blz-glass-body);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3), inset 0 1px 1px rgba(255, 255, 255, 0.4);
	transform: none;
	transition: transform 0.4s var(--blz-ease), background-position 0.4s var(--blz-ease);
}
.wp-block-button.is-style-ghost .wp-block-button__link:hover::after { transform: translateX(4px); }

/* ── 4. Read more: etichetta + freccia in cerchio di vetro ──── */
.wp-block-read-more,
.blz-more {
	display: inline-flex;
	align-items: center;
	gap: 0.9em;
	color: var(--wp--preset--color--white, #fff);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--xs, 0.75rem);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-decoration: none;
	text-transform: uppercase;
}
.blz-more__label {
	background: linear-gradient(currentColor, currentColor) left bottom / 0 1px no-repeat;
	padding-bottom: 2px;
	transition: background-size 0.5s var(--blz-ease);
}
.blz-more__circle {
	position: relative;
	display: grid;
	place-items: center;
	width: 2.9em;
	height: 2.9em;
	border-radius: 50%;
	overflow: hidden;
	background: var(--blz-glass-body);
	box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.4);
	transition: transform 0.5s var(--blz-ease);
}
.blz-more__circle::before {
	content: "";
	position: absolute;
	inset: 0;
	padding: 1px;
	border-radius: inherit;
	background: var(--blz-rim-white);
}
.blz-more__circle .blz-icon {
	width: 45%;
	height: 45%;
	transition: transform 0.5s var(--blz-ease);
}
:is(.wp-block-read-more, .blz-more):hover .blz-more__label,
.wp-block-post:hover .blz-more__label { background-size: 100% 1px; }
:is(.wp-block-read-more, .blz-more):hover .blz-more__circle,
.wp-block-post:hover .blz-more__circle { transform: scale(1.08); }
:is(.wp-block-read-more, .blz-more):hover .blz-more__circle .blz-icon,
.wp-block-post:hover .blz-more__circle .blz-icon { animation: blz-arrow-through 0.6s var(--blz-ease); }

@keyframes blz-arrow-through {
	0%   { transform: translateX(0); }
	45%  { transform: translateX(160%); }
	46%  { transform: translateX(-160%); }
	100% { transform: translateX(0); }
}

/* ── 5. Tipografia di stile ──────────────────────────────────── */
.is-style-aurora:is(h1, h2, h3, h4, h5, h6, .wp-block-heading) {
	background: var(--blz-aurora);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

p.is-style-kicker {
	display: inline-flex;
	align-items: center;
	gap: 0.85em;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--mist);
}
p.is-style-kicker::before {
	content: "";
	width: 2.25em;
	height: 1px;
	background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0.15));
	transform-origin: left;
}

/* ── 6. Immagini ─────────────────────────────────────────────── */
.wp-block-image.is-style-glass-frame img {
	padding: 6px;
	border-radius: var(--blz-glass-radius);
	background: var(--blz-glass-body);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), inset 0 1px 1px rgba(255, 255, 255, 0.35), 0 30px 70px -30px rgba(0, 0, 0, 0.8);
}

/* ── Accessibilità e fallback ────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	.is-style-glass, .is-style-glass-ia, .is-style-glass-press, .is-style-glass-social,
	.wp-block-button__link, .blz-btn-glass, .wp-block-button__link::after, .blz-btn-glass::after {
		transition: none;
	}
	:is(.is-style-glass, .is-style-glass-ia, .is-style-glass-press, .is-style-glass-social):has(a):hover,
	.wp-block-button__link:hover, .blz-btn-glass:hover {
		transform: none;
	}
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.is-style-glass, .is-style-glass-ia, .is-style-glass-press, .is-style-glass-social,
	.wp-block-button__link, .blz-btn-glass {
		background-color: rgba(21, 21, 29, 0.92);
	}
}