/* ==========================================================================
   1. ΑΠΟΛΥΤΟ ΚΕΝΤΡΑΡΙΣΜΑ LOGO ΣΤΟ MOBILE HEADER
   ========================================================================== */
@media (max-width: 768px) {
    #sp-header {
        position: relative !important;
        padding: 8px 0 !important;
        background: #ffffff !important;
    }

    #sp-header .container > .row,
    #sp-header .row {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    #sp-logo, 
    #sp-header .logo {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 0 auto !important;
        padding: 0 !important;
        float: none !important;
        text-align: center !important;
    }

    #sp-logo a, 
    #sp-header .logo a {
        display: inline-block !important;
        margin: 0 auto !important;
    }

    #sp-logo img, 
    #sp-header .logo img {
        display: block !important;
        margin: 0 auto !important;
        max-height: 46px !important;
        height: auto !important;
        width: auto !important;
    }

    #sp-menu, 
    .sp-megamenu-wrapper, 
    #offcanvas-toggler, 
    .offcanvas-toggler {
        position: absolute !important;
        right: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        z-index: 999 !important;
        width: auto !important;
        float: none !important;
    }
}

/* ==========================================================================
   2. ΟΜΑΛΗ ΜΕΤΑΒΑΣΗ & TOUCH INTERACTIONS
   ========================================================================== */
html {
    scroll-behavior: smooth;
    -webkit-tap-highlight-color: transparent;
}

body {
    animation: argoPageFade 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes argoPageFade {
    0% {
        opacity: 0;
        transform: translateY(6px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.sppb-addon-feature, 
.argo-step-card, 
.argo-btn-primary, 
.argo-btn-secondary {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease !important;
}

.sppb-addon-feature:active, 
.argo-step-card:active {
    transform: scale(0.98) !important;
}