/* glolos.com */
/* Colors: #d4b8ff, #0a0e1a, #3d1f6d, #121630, #6b3fa0, #a78bfa, #f0abfc, #e8e0f4, #9b8fb8, #c471ed */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Libre Baskerville', serif; font-weight: 400; font-size: 17px; line-height: 1.85; background: #0a0e1a; color: #e8e0f4; overflow-x: hidden; }
.hero { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: #0a0e1a; position: relative; }
.hero-blob { width: clamp(280px, 60vw, 600px); height: clamp(260px, 50vh, 500px); background: radial-gradient(ellipse at 40% 35%, #6b3fa0 0%, #3d1f6d 50%, rgba(10, 14, 26, 0.8) 100%); border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 80px 20px rgba(167, 139, 250, 0.15); animation: breathe 6s ease-in-out infinite, blobIn 2.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; opacity: 0; transform: scale(0.05); filter: blur(0.5px); }
@keyframes blobIn { to { opacity: 1; transform: scale(1); } }
@keyframes breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.015); } }
.hero-title { font-family: 'Outfit', sans-serif; font-weight: 700; font-size: clamp(3rem, 8vw, 6rem); color: #e8e0f4; letter-spacing: 0.12em; opacity: 0; animation: fadeIn 1s 2.6s ease forwards; }
@keyframes fadeIn { to { opacity: 1; } }
.colony { position: relative; padding: 120px 40px 160px; max-width: 900px; margin: 0 auto; }
.blob { padding: 48px 40px; margin-bottom: 80px; border-radius: 55% 45% 50% 50% / 45% 55% 45% 55%; background: radial-gradient(ellipse at 38% 32%, #3d1f6d 0%, rgba(10, 14, 26, 0.9) 100%); box-shadow: 0 0 60px 15px rgba(167, 139, 250, 0.12); position: relative; animation: breathe 7s ease-in-out infinite; }
.blob-left { margin-right: 15%; border-radius: 50% 60% 45% 55% / 55% 45% 60% 40%; }
.blob-right { margin-left: 15%; border-radius: 60% 45% 55% 50% / 40% 60% 45% 55%; animation-duration: 5s; }
.blob-heading { font-family: 'Outfit', sans-serif; font-weight: 600; font-size: clamp(1.8rem, 4vw, 3rem); color: #a78bfa; margin-bottom: 16px; letter-spacing: 0.02em; }
.blob-text { color: #e8e0f4; max-width: 480px; }
.blob-italic { font-style: italic; color: #9b8fb8; }
.blob:hover { box-shadow: 0 0 100px 40px rgba(167, 139, 250, 0.25); }
.site-footer { text-align: center; padding: 60px 40px; background: #0a0e1a; }
.footer-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #a78bfa; margin-bottom: 12px; animation: breathe 4s ease-in-out infinite; }
.site-footer p { font-family: 'Space Mono', monospace; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: #9b8fb8; }
@media (max-width: 768px) { .colony { padding: 80px 24px 120px; } .blob-left, .blob-right { margin-left: 0; margin-right: 0; border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%; } .blob { padding: 36px 28px; } }