/*
Theme Name: DataGurus Launching Soon
Theme URI: https://datagurus.co.uk
Author: DataGurus
Description: Minimal animated coming soon page for DataGurus.
Version: 1.1
*/

:root {
    --teal: #0fa7a5;
    --cyan: #36c7df;
    --green: #91c83e;
    --navy: #102f43;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body { height: 100%; }

body {
    font-family: "Inter", sans-serif;
    color: var(--navy);
    background: linear-gradient(135deg, #ffffff 0%, #f4fbfb 50%, #eef8fb 100%);
    overflow: hidden;
}

/* Background layers */
#network {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.orb {
    position: fixed;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.55;
    z-index: 0;
    animation: drift 18s ease-in-out infinite alternate;
}
.orb.one   { width: 420px; height: 420px; background: rgba(54,199,223,0.35); top: -120px; right: -100px; }
.orb.two   { width: 360px; height: 360px; background: rgba(145,200,62,0.30); bottom: -120px; left: -100px; animation-delay: -6s; }
.orb.three { width: 260px; height: 260px; background: rgba(15,167,165,0.25); top: 45%; left: 60%; animation-delay: -12s; }

@keyframes drift {
    0%   { transform: translate(0, 0) scale(1); }
    50%  { transform: translate(-40px, 30px) scale(1.08); }
    100% { transform: translate(30px, -40px) scale(0.95); }
}

/* Layout: everything centred */
.page {
    position: relative;
    z-index: 2;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 36px;
    padding: 24px;
    text-align: center;
}
.admin-bar .page { min-height: calc(100vh - 32px); }

/* Logo */
.logo-wrap {
    display: block;
    animation: logoIn 1.1s cubic-bezier(.2,.8,.2,1) both, float 6s ease-in-out 1.2s infinite;
}
.logo-wrap img {
    width: 280px;
    max-width: 70vw;
    height: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 20px 40px rgba(16,47,67,0.12));
}

@keyframes logoIn {
    from { opacity: 0; transform: translateY(20px) scale(0.85); filter: blur(8px); }
    to   { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-10px); }
}

/* Coming soon text */
h1 {
    font-size: clamp(44px, 8vw, 88px);
    line-height: 1;
    letter-spacing: -2.5px;
    font-weight: 700;
    background: linear-gradient(90deg, var(--teal), var(--cyan), var(--green), var(--cyan), var(--teal));
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    opacity: 0;
    animation: fadeUp 0.9s cubic-bezier(.2,.8,.2,1) 0.5s forwards, shimmer 6s linear 1.4s infinite;
}

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes shimmer {
    from { background-position: 0% 50%; }
    to   { background-position: 300% 50%; }
}

/* Mobile */
@media (max-width: 600px) {
    h1 { letter-spacing: -1.5px; }
    .page { gap: 28px; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
    h1 { opacity: 1; }
}