/* Custom Styles for YSB SYS Pitch Web (MARP & Vanguard UI Architecture) */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;800&family=Raleway:wght@100;200;300;400;600&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;600&display=swap');

:root {
    --marp-accent: #6366f1;
    --marp-accent-hover: #818cf8;
    --marp-cyan: #06b6d4;
    --marp-emerald: #10b981;
    --marp-amber: #f59e0b;
    --marp-rose: #f43f5e;
    --marp-dark: #030712;
    --marp-card: #090d16;
    --marp-border: rgba(255, 255, 255, 0.1);
}

.font-outfit { font-family: 'Outfit', sans-serif; }
.font-raleway { font-family: 'Raleway', sans-serif; }
.font-mono-code { font-family: 'IBM Plex Mono', monospace; }

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #020617;
}
::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #475569;
}

/* Glassmorphism Card */
.glass-card {
    background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(51, 65, 85, 0.6);
}

/* Glowing Neon Borders */
.glow-brand {
    box-shadow: 0 0 35px -5px rgba(99, 102, 241, 0.3);
}

.glow-emerald {
    box-shadow: 0 0 35px -5px rgba(16, 185, 129, 0.3);
}

/* Three.js Canvas positioning */
#three-canvas {
    transition: opacity 1s ease;
}

/* Animated Gradient Background text */
@keyframes textGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.animate-text-gradient {
    background-size: 200% auto;
    animation: textGradient 6s ease infinite;
}

/* Slide Presentation Deck Styles */
.slide-section {
    transition: opacity 0.5s cubic-bezier(0.32, 0.72, 0, 1), transform 0.5s cubic-bezier(0.32, 0.72, 0, 1);
}
.slide-section.active-slide {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: scale(1) translateY(0);
    z-index: 20;
}
.slide-section:not(.active-slide) {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: scale(0.95) translateY(10px);
    z-index: 0;
}

/* MARP Interactive Card & Badge Effects */
.interactive-card {
    transition: all 0.3s cubic-bezier(0.32, 0.72, 0, 1);
    cursor: pointer;
}
.interactive-card:hover {
    transform: translateY(-3px) scale(1.015);
    border-color: rgba(99, 102, 241, 0.5) !important;
    box-shadow: 0 12px 30px -10px rgba(99, 102, 241, 0.25);
}
.interactive-card:active {
    transform: translateY(-1px) scale(0.99);
}

/* Modal Overlay Animation */
@keyframes modalEnter {
    from {
        opacity: 0;
        transform: scale(0.92) translateY(15px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.modal-animate-enter {
    animation: modalEnter 0.35s cubic-bezier(0.32, 0.72, 0, 1) forwards;
}