diff --git a/theme/assets/css/main.css b/theme/assets/css/main.css index fd863bc..e30084f 100644 --- a/theme/assets/css/main.css +++ b/theme/assets/css/main.css @@ -2913,15 +2913,20 @@ p:last-child { margin-bottom: 0; } 100% { transform: translateY(var(--p-ty, -100vh)) translateX(var(--p-tx, 40px)) scale(var(--p-scale-end, 0.3)); opacity: 0; } } +@keyframes glow-appear { + from { opacity: 0; filter: blur(80px); transform: translate(-50%, -50%) scale(0.2); } + to { opacity: 0.65; filter: blur(22px); transform: translate(-50%, -50%) scale(1); } +} + @keyframes glow-drift { - 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.35; } - 15% { transform: translate(-20%, -30%) scale(1.15); opacity: 0.45; } - 30% { transform: translate(-65%, -70%) scale(0.9); opacity: 0.3; } - 45% { transform: translate(-80%, -40%) scale(1.1); opacity: 0.5; } - 60% { transform: translate(-30%, -75%) scale(0.95); opacity: 0.35; } - 75% { transform: translate(-70%, -25%) scale(1.2); opacity: 0.45; } - 90% { transform: translate(-40%, -60%) scale(1.05); opacity: 0.4; } - 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.35; } + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.65; } + 15% { transform: translate(-20%, -30%) scale(1.15); opacity: 0.75; } + 30% { transform: translate(-65%, -70%) scale(0.9); opacity: 0.55; } + 45% { transform: translate(-80%, -40%) scale(1.1); opacity: 0.8; } + 60% { transform: translate(-30%, -75%) scale(0.95); opacity: 0.65; } + 75% { transform: translate(-70%, -25%) scale(1.2); opacity: 0.75; } + 90% { transform: translate(-40%, -60%) scale(1.05); opacity: 0.7; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.65; } } /* Particle container */ @@ -2961,14 +2966,16 @@ p:last-child { margin-bottom: 0; } position: absolute; top: 50%; left: 50%; - width: 700px; - height: 700px; + width: 950px; + height: 950px; border-radius: 50%; - background: radial-gradient(circle, rgba(var(--color-primary-rgb), 0.18) 0%, rgba(var(--color-primary-rgb), 0.06) 50%, transparent 70%); + background: radial-gradient(circle, rgba(var(--color-primary-rgb), 0.32) 0%, rgba(var(--color-primary-rgb), 0.14) 45%, rgba(var(--color-primary-rgb), 0.04) 70%, transparent 90%); z-index: 1; pointer-events: none; - filter: blur(40px); - animation: glow-drift 20s ease-in-out infinite; + filter: blur(22px); + animation: + glow-appear 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards, + glow-drift 20s 0.45s ease-in-out infinite; } /* Animated hero layout - centered single-column content */ @@ -3024,12 +3031,14 @@ p:last-child { margin-bottom: 0; } .hero-particle, .hero-animated__glow { animation: none; - opacity: var(--p-opacity, 0.2); + opacity: 0.65; + transform: translate(-50%, -50%); + filter: blur(22px); } } @media (max-width: 768px) { - .hero-animated__glow { width: 400px; height: 400px; } + .hero-animated__glow { width: 580px; height: 580px; } .hero-animated__inner { padding-block: 7rem 4rem; } .hero-stats--three { gap: 1.5rem; flex-wrap: wrap; justify-content: center; } } @@ -3506,7 +3515,7 @@ p:last-child { margin-bottom: 0; } [data-theme="dark"] .hero-animated { background: #0D0D0D; } [data-theme="dark"] .page-hero-animated { background: #0D0D0D; } [data-theme="dark"] .hero-animated__glow { - background: radial-gradient(circle, rgba(var(--color-primary-rgb), 0.22) 0%, rgba(var(--color-primary-rgb), 0.08) 50%, transparent 70%); + background: radial-gradient(circle, rgba(var(--color-primary-rgb), 0.40) 0%, rgba(var(--color-primary-rgb), 0.18) 45%, rgba(var(--color-primary-rgb), 0.06) 70%, transparent 90%); } [data-theme="dark"] .site-footer { background: #0D0D0D; }