/* ===== Minimal custom styles — everything else via Tailwind ===== */

/* Scroll snap */
html {
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
}
section[data-slide] {
    scroll-snap-align: start;
    position: relative;
    z-index: 1;
}
section[data-slide]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(10, 10, 15, 0.5);
    pointer-events: none;
    z-index: 0;
}
section[data-slide] > * {
    position: relative;
    z-index: 2;
}

/* Gradient text helper */
.gradient-text {
    background: linear-gradient(135deg, #6C5CE7 0%, #0984E3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Slide gradient glow pseudo-element */
.slide-glow::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(108, 92, 231, 0.3) 0%, transparent 70%);
    pointer-events: none;
    z-index: 2;
}

/* Allocation bar fill (CSS custom property driven) */
.alloc-bar-fill {
    height: 100%;
    border-radius: 4px;
    background: var(--bar-color, #6C5CE7);
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Bounce animation */
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(8px); }
    60% { transform: translateY(4px); }
}
.animate-bounce-hint { animation: bounce 2s infinite; }

/* SVG bar animation */
.bar-anim { transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1); }

/* Compare table horizontal scroll on mobile */
.compare-table-wrap { overflow-x: auto; }

/* Smooth transitions for interactive elements */
.card-hover {
    transition: transform 0.3s, border-color 0.3s, box-shadow 0.3s;
}
.card-hover:hover {
    transform: translateY(-4px);
    border-color: #6C5CE7;
    box-shadow: 0 8px 32px rgba(108, 92, 231, 0.1);
}

/* Scrollbar styling */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0a0a0f; }
::-webkit-scrollbar-thumb { background: #1e1e2e; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #6C5CE7; }