a img {
    transition: transform 0.3s ease;
}

a img:hover {
    transform: scale(1.1);
}

main header a {
        transition: background-color .5s ease;
        border-radius: 5px;
        padding: 5px;
        transition: transform .2s ease;
        li, i{
            transition: color .1s ease;
        }
}
main header a:hover {
        background-color: rgb(236, 55, 55) !important;
        transform: scale(1.1);
        li, i{
            color: rgb(252, 249, 249);
        }
    }

.nl-home a:focus-visible, .nl-header a:focus-visible, .nl-footer a:focus-visible, .nl-mobile-nav summary:focus-visible, .nl-faq summary:focus-visible { outline: 2px solid var(--nl-gold); outline-offset: 3px; }
.nl-feature, .nl-plan, .nl-framework { transition: border-color .2s ease, background-color .2s ease; }
.nl-feature:hover { background: #0e1113; }
.nl-plan:hover { border-color: #41474b; }
.nl-plan-featured:hover { border-color: var(--nl-gold); }

.nl-header { transition: transform .32s cubic-bezier(.2,.75,.25,1), background-color .25s ease, box-shadow .25s ease; }
.nl-home [data-reveal] { transition: opacity .65s ease, transform .65s cubic-bezier(.2,.7,.2,1); transition-delay: var(--reveal-delay, 0ms); }
html.nl-motion-ready .nl-home [data-reveal]:not([data-revealed="true"]) { opacity: 0; transform: translateY(18px); }
.nl-security-visual img { transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .8s ease; }
.nl-security-visual:hover img { transform: scale(1.025); filter: brightness(1.08); }

@media (prefers-reduced-motion: reduce) {
  .nl-home *, .nl-header *, .nl-footer * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .nl-header { transform: none !important; }
  html.nl-motion-ready .nl-home [data-reveal] { opacity: 1 !important; transform: none !important; }
  .nl-security-visual img { transition: none !important; }
}

/* Keep the Notavel Labs brand mark at native size and still on hover. */
header.nl-header a.nl-brand:hover { transform: none !important; transition: none !important; background-color: transparent !important; }
header.nl-header a.nl-brand > img.nl-brand-logo, header.nl-header a.nl-brand > img.nl-brand-logo:hover { transform: none !important; transition: none !important; }

/* Match the header brand size and remove visual effects from the footer logo. */
.nl-footer .nl-footer-brand > a.nl-brand,
.nl-footer .nl-footer-brand > a.nl-brand:hover,
.nl-footer .nl-footer-brand > a.nl-brand:active {
  transform: none !important; transition: none !important; filter: none !important;
  animation: none !important; box-shadow: none !important; background: transparent !important;
}
.nl-footer .nl-footer-brand > a.nl-brand > img.nl-brand-logo,
.nl-footer .nl-footer-brand > a.nl-brand > img.nl-brand-logo:hover,
.nl-footer .nl-footer-brand > a.nl-brand > img.nl-brand-logo:active {
  width: 210.5px !important; max-width: 100% !important; height: auto !important; max-height: none !important;
  object-fit: contain !important; transform: none !important; transition: none !important;
  filter: none !important; opacity: 1 !important; animation: none !important; box-shadow: none !important;
}