/* Premium Academic "Coming Soon" styling */
:root {
    --predictor-navy: #0f2744;
    --predictor-navy-mid: #1a3d6b;
    --predictor-accent: #29b64c;
    --app-bg: #0b1524;
}

body {
    background-color: var(--app-bg);
    margin: 0;
    overflow-x: hidden; /* Strict mobile safeguard */
}

/* Page Frame Structure */
.coming-soon-wrapper {
    min-height: calc(100vh - 140px);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at top center, #122847 0%, var(--app-bg) 80%);
    padding: 2.5rem 0;
}

/* Ambient Pulse Backgrounds */
.ambient-glow {
    position: absolute;
    width: 80vw;
    height: 80vw;
    max-width: 500px;
    background: radial-gradient(circle, rgba(41, 182, 76, 0.12) 0%, transparent 70%);
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: blur(60px);
    border-radius: 50%;
    animation: pulse 6s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 1;
}

.glow-2 {
    background: radial-gradient(circle, rgba(26, 61, 107, 0.25) 0%, transparent 70%);
    top: 20%;
    left: 80%;
    animation-delay: -3s;
    animation-duration: 9s;
}

/* Responsive Floating Educational Symbols */
.edu-decor {
    position: absolute;
    color: rgba(255, 255, 255, 0.04);
    pointer-events: none;
    z-index: 2;
}
.decor-1 { top: 20%; left: 12%; animation: hoverMotion 5s ease-in-out infinite alternate; }
.decor-2 { bottom: 25%; right: 10%; animation: hoverMotion 7s ease-in-out infinite -2s alternate; }

/* Micro-Engineered Animated Book Graphic */
.book-container {
    width: 100px;
    height: 100px;
    position: relative;
    animation: floatBook 4s ease-in-out infinite alternate;
    filter: drop-shadow(0 10px 20px rgba(41, 182, 76, 0.2));
}

.main-book-svg {
    width: 100%;
    height: 100%;
    will-change: transform;
}

/* Smooth Page Turn Simulator */
.flipping-page {
    transform-origin: 50px 50px;
    animation: flipPage 3s ease-in-out infinite alternate;
    will-change: transform, opacity;
}
.page-left { animation-delay: -0.5s; }
.page-right { animation-delay: -1.8s; }

/* Dashboard UI Container card */
.glass-card {
    background: rgba(16, 29, 49, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 25px 55px rgba(0, 0, 0, 0.45);
    position: relative;
    overflow: hidden;
}

/* Premium Desktop Spotlight Vector Overlay */
.spotlight-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(
        450px circle at var(--mouse-x, 50%) var(--mouse-y, 40%), 
        rgba(255, 255, 255, 0.05),
        transparent 60%
    );
    z-index: 0;
    pointer-events: none;
}

.glass-card > * { position: relative; z-index: 2; }

/* Accent Typography styles */
.badge {
    display: inline-block;
    padding: 0.45rem 1.1rem;
    border-radius: 9999px;
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    background: rgba(41, 182, 76, 0.08);
    color: var(--predictor-accent);
    border: 1px solid rgba(41, 182, 76, 0.25);
}

.text-gradient {
    background: linear-gradient(135deg, #ffffff 30%, var(--predictor-accent) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Call to Action Button Layout */
.return-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 2.2rem;
    border-radius: 99px;
    font-size: 0.95rem;
    font-weight: 800;
    color: #ffffff;
    background: linear-gradient(90deg, var(--predictor-navy-mid), var(--predictor-navy));
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 20px rgba(11, 21, 36, 0.6);
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    text-decoration: none;
    touch-action: manipulation; /* Improves response on touchscreens */
}

.return-btn:hover, .return-btn:active {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(41, 182, 76, 0.25);
    border-color: rgba(41, 182, 76, 0.5);
}

/* Keyframe System Configurations */
@keyframes fade-in-up {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

.animate-fade-in-up {
    animation: fade-in-up 0.7s cubic-bezier(0.215, 0.610, 0.355, 1);
}

@keyframes floatBook {
    0% { transform: translateY(0px) rotate(0deg); }
    100% { transform: translateY(-8px) rotate(2deg); }
}

@keyframes flipPage {
    0% { transform: scaleX(1) skewY(0deg); opacity: 0.9; }
    50% { transform: scaleX(0.2) skewY(-4deg); opacity: 0.6; }
    100% { transform: scaleX(0.95) skewY(0deg); opacity: 0.9; }
}

@keyframes hoverMotion {
    0% { transform: translateY(0) rotate(0deg); }
    100% { transform: translateY(-15px) rotate(8deg); }
}

@keyframes pulse {
    0% { transform: translate(-50%, -50%) scale(0.95); opacity: 0.4; }
    100% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.7; }
}

/* Smart Phone Optimization Overrides */
@media (max-width: 640px) {
    .coming-soon-wrapper {
        padding: 1.5rem 0;
    }
    .glass-card {
        border-radius: 1.5rem !important;
        background: rgba(16, 29, 49, 0.75); /* Added opacity for crisp small-screen legibility */
    }
    .edu-decor {
        opacity: 0.3; /* Subtle design element on mobile viewports */
    }
}