/* prmpt Landing Page Styles */

/* Responsive adjustments */
@media (min-width: 640px) {
    #prmpt-logo {
        top: 32px !important;
        left: 32px !important;
        width: 266px !important;
    }
    
    #prmpt-caption {
        top: 180px !important;
        left: 32px !important;
        width: calc(50vw - 48px) !important;
    }
    
    #prmpt-nav {
        top: 32px !important;
        right: 32px !important;
        width: 330px !important;
    }
    
    #prmpt-nav span:first-child {
        display: block !important;
    }
    
    #prmpt-nav svg {
        width: 30px !important;
        height: 30px !important;
    }
    
    #outro-info {
        left: auto !important;
        right: 32px !important;
        bottom: 80px !important;
        width: 330px !important;
    }
    
    #outro-buy {
        left: auto !important;
        right: 32px !important;
        bottom: 32px !important;
        width: 330px !important;
        height: 174px !important;
    }
    
    #outro-footer {
        bottom: 32px !important;
        gap: 80px !important;
    }
}

@media (min-width: 1024px) {
    #prmpt-logo {
        width: 355px !important;
    }
    
    #prmpt-caption {
        width: 692px !important;
        top: 244px !important;
    }
    
    #main-canvas {
        top: 0 !important;
        height: 100% !important;
    }
}

/* Animation keyframes */
@keyframes fadeUpIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#prmpt-logo {
    animation: fadeUpIn 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) 0s forwards;
}

#prmpt-nav {
    animation: fadeUpIn 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) 0.15s forwards;
}

#prmpt-caption {
    animation: fadeUpIn 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) 0.3s forwards;
}

#outro-info {
    animation: fadeUpIn 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) 0.45s forwards;
}