.bg-home-hero {
    background-size: cover;
    background-position: bottom center;
}

.light .bg-home-hero {
    background-image: url("../images/ns-img-291-uPW3Jpt.jpg");
}

.dark .bg-home-hero {
    background-image: url("../images/ns-img-291-dark---MnesB.jpg");
}

header h1 {
    color: transparent;
    background: linear-gradient(to right, #91a7bd 0%, #ffffff 40%, #1364b0 100%);
    -webkit-background-clip: text;
    -webkit-text-stroke-color: #98ccff;
    text-shadow: 0 1px 0 rgba(232, 238, 246, 0.9);
    white-space: nowrap;
}

h1 span:not(.icon) {
    line-height: 2.25;
}

h1 span.icon, h2 span.icon, h3 span.icon, h4 span.icon, h5 span.icon, h6 span.icon {
    transition: all .3s;
    position: relative;
    display: inline-block;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    padding: 5px 20px 5px 36px;
    background-color: rgb(1 114 255 / 35%);
    color: #ffffff;
    transform: rotate(-3deg);
    margin-right: .5rem;
}

@media screen and (min-width: 768px) {
    h1 span:not(.icon) br {
        display: block;
    }
}

@media screen and (min-width: 320px) {
    h1 span:not(.icon) br {
        display: none;
    }
}

@media screen and (min-width: 320px) {
    h1 .line-space, h2 .line-space, h3 .line-space, h4 .line-space, h5 .line-space, h6 .line-space {
        height: 1rem;
    }
}

h1 span:hover, h2 span:hover, h3 span:hover, h4 span:hover, h5 span:hover, h6 span:hover {
    transform: rotate(0deg);
}

h1 span .icon, h2 span .icon, h3 span .icon, h4 span .icon, h5 span .icon, h6 span .icon {
    left: -55px;
}

@supports (hanging-punctuation: first) and (font: -apple-system-body) and (-webkit-appearance: none) {
    h1 span .icon,
    h2 span .icon,
    h3 span .icon,
    h4 span .icon,
    h5 span .icon,
    h6 span .icon {
        top: -40px;
        left: -60px;
    }
}

h1 span .icon.measure {
    left: -59px;
}

@keyframes circleMoveReverse {
    0%   { transform: translate(0px, 0px); }
    25%  { transform: translate(-3px, -3px); }
    50%  { transform: translate(0px, -6px); }
    75%  { transform: translate(3px, -3px); }
    100% { transform: translate(0px, 0px); }
}

section .icon img {
    animation: circleMoveReverse 4s linear infinite;
    will-change: transform;
}