/* ═══════════════════════════════════════════════════════════════
   LIQUID GLASS — Base
   Tipografia + utility background. Carica DOPO Bootstrap reboot.
   Non resetta aggressivamente per non rompere i componenti Bootstrap.
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@300;400;500;600;900&display=swap');

body {
	font-family: var(--ff);
	font-size: 13px;
	color: var(--ink);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Mesh background — opt-in via classe, non globale.
   Usare su body solo in pagine shell-style (interne). */
.liquid-glass-bg {
	position: relative;
	background-color: #f4f9fa;
}
.liquid-glass-bg::before {
	content: '';
	position: fixed; inset: 0; z-index: 0;
	background:
		radial-gradient(ellipse 70% 60% at 0%   0%,   #e0f5f7 0%, transparent 55%),
		radial-gradient(ellipse 60% 50% at 100% 0%,   #d4f0f5 0%, transparent 55%),
		radial-gradient(ellipse 50% 60% at 50%  100%, #e8f8fa 0%, transparent 60%),
		radial-gradient(ellipse 40% 40% at 80%  60%,  #f0fafb 0%, transparent 55%),
		radial-gradient(ellipse 50% 40% at 20%  70%,  #e6f7f9 0%, transparent 55%);
	pointer-events: none;
}
.liquid-glass-bg::after {
	content: '';
	position: fixed; inset: 0; z-index: 0; pointer-events: none;
	background:
		radial-gradient(circle 400px at 10% 20%, rgba(0,130,144,.07) 0%, transparent 70%),
		radial-gradient(circle 300px at 90% 75%, rgba(0,149,169,.06) 0%, transparent 70%),
		radial-gradient(circle 250px at 55% 90%, rgba(0,130,144,.05) 0%, transparent 70%),
		radial-gradient(circle 200px at 30% 55%, rgba(255,203,5,.04) 0%, transparent 70%);
	animation: liquid-orbs 22s ease-in-out infinite alternate;
}
@keyframes liquid-orbs {
	from { transform: translate(0, 0) scale(1); }
	to   { transform: translate(-15px, 12px) scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
	.liquid-glass-bg::after { animation: none; }
}
