.ambient-bg { position: fixed; inset: 0; z-index: -2; background: #f7f9fc; overflow: hidden; }
.blob { position: absolute; border-radius: 50%; filter: blur(120px); opacity: 0.55; animation: float 18s infinite alternate ease-in-out; }
.blob-1 { top: -15%; left: -10%; width: 60vw; height: 60vw; background: radial-gradient(circle, #bae6fd 0%, #7dd3fc 100%); }
.blob-2 { bottom: -15%; right: -10%; width: 50vw; height: 50vw; background: radial-gradient(circle, #c7d2fe 0%, #a5b4fc 100%); animation-direction: alternate-reverse; }
@keyframes float { to { transform: translate(8%, 8%) scale(1.08); } }
.glass-panel { background: rgba(255, 255, 255, 0.88); backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.7); }
.hide-scrollbar::-webkit-scrollbar { display: none; }

#main-nav { transition: max-width 0.7s cubic-bezier(0.4, 0, 0.2, 1), padding 0.7s ease; white-space: nowrap; overflow: hidden; max-width: 1400px; }
.nav-folded { max-width: 275px !important; padding-right: 24px !important; }
.nav-hidden-items { opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }

.hero-bg-slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1s ease-in-out; }
.hero-bg-slide.active { opacity: 1; }

.scroll-icon { transition: opacity 0.4s ease, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1); position: absolute; }