@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,300..900;1,6..12,300..900&display=swap');

:root {
    --smartfix-site-font: "Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

html,
body,
button,
input,
select,
textarea {
    font-family: var(--smartfix-site-font) !important;
}

body *:not(.fa):not(.fas):not(.far):not(.fal):not(.fab):not(.fad):not(.glyphicon):not(.slick-arrow):not([class^="ion-"]):not([class*=" ion-"]) {
    font-family: var(--smartfix-site-font) !important;
}

.smartfix-logo-3d {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
    min-height: 76px;
    perspective: 1000px;
    transform-style: preserve-3d;
    transition: transform .35s ease;
    will-change: transform;
}

.smartfix-logo-3d::before {
    content: "";
    position: absolute;
    inset: 9% -14% -7%;
    z-index: -1;
    border-radius: 999px;
    background:
        radial-gradient(circle at 30% 32%, rgba(96, 165, 250, .55), transparent 42%),
        radial-gradient(circle at 70% 62%, rgba(14, 165, 233, .42), transparent 48%),
        conic-gradient(from 145deg, rgba(29, 78, 216, .18), rgba(125, 211, 252, .46), rgba(29, 78, 216, .18));
    filter: blur(18px) saturate(1.15);
    opacity: .74;
    transform: translateZ(-46px) rotateX(64deg) scale(.96);
    animation: smartfix-logo-glow 4.2s ease-in-out infinite;
}

.smartfix-logo-3d__image {
    display: block;
    transform-origin: center;
    transform: rotateX(3deg) rotateY(-14deg) translateZ(24px);
    backface-visibility: hidden;
    filter: drop-shadow(0 17px 20px rgba(0, 0, 0, .38)) drop-shadow(0 0 10px rgba(59, 130, 246, .2));
    transition: transform .35s ease, filter .35s ease;
    animation: smartfix-logo-float 4s ease-in-out infinite;
    will-change: transform;
}

.smartfix-logo-3d:hover,
.smartfix-logo-3d:focus-visible {
    transform: translateY(-2px) scale(1.03);
}

.smartfix-logo-3d:hover .smartfix-logo-3d__image,
.smartfix-logo-3d:focus-visible .smartfix-logo-3d__image {
    filter: drop-shadow(0 24px 30px rgba(37, 99, 235, .46)) drop-shadow(0 0 18px rgba(96, 165, 250, .38));
    animation: smartfix-logo-hover 1.35s ease-in-out infinite;
}

.smartfix-logo-3d:focus-visible {
    border-radius: 1rem;
    outline: 2px solid rgba(147, 197, 253, .95);
    outline-offset: .35rem;
}

@keyframes smartfix-logo-float {
    0%,
    100% {
        transform: rotateX(3deg) rotateY(-14deg) translateY(0) translateZ(24px);
    }

    50% {
        transform: rotateX(8deg) rotateY(12deg) translateY(-5px) translateZ(32px);
    }
}

@keyframes smartfix-logo-hover {
    0%,
    100% {
        transform: rotateX(10deg) rotateY(18deg) translateY(-5px) translateZ(38px) scale(1.06);
    }

    50% {
        transform: rotateX(-3deg) rotateY(-18deg) translateY(-7px) translateZ(42px) scale(1.08);
    }
}

@keyframes smartfix-logo-glow {
    0%,
    100% {
        opacity: .55;
        transform: translateZ(-46px) rotateX(64deg) scale(.92) rotateZ(-5deg);
    }

    50% {
        opacity: .92;
        transform: translateZ(-46px) rotateX(64deg) scale(1.1) rotateZ(5deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .smartfix-logo-3d,
    .smartfix-logo-3d::before,
    .smartfix-logo-3d__image {
        animation: none;
        transition: none;
    }
}