/**
 * Smooth text shake on scroll — text only, page stays still
 */
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .pic-text-shake,
    .pic-text-shake.is-visible {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }
}

.pic-text-shake {
    opacity: 0;
    display: inline-block;
    max-width: 100%;
    transform: translate3d(0, 14px, 0);
    will-change: transform, opacity;
}

/* Block-level text keeps normal layout */
h1.pic-text-shake,
h2.pic-text-shake,
h3.pic-text-shake,
h4.pic-text-shake,
h5.pic-text-shake,
h6.pic-text-shake,
p.pic-text-shake,
li.pic-text-shake,
.label.pic-text-shake,
.lead.pic-text-shake,
.subtitle.pic-text-shake,
.section-title.pic-text-shake,
.widget-title.pic-text-shake,
.home-about-year.pic-text-shake,
.home-about-highlight.pic-text-shake,
.item-content.pic-text-shake,
.contact-details.pic-text-shake,
.message-box.pic-text-shake {
    display: block;
}

.pic-text-shake.is-visible {
    opacity: 1;
    animation: pic-text-soft-shake 0.85s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.pic-text-shake.is-visible.pic-text-instant {
    animation: none;
    opacity: 1;
    transform: none;
}

.pic-text-shake[data-shake="alt"].is-visible {
    animation-name: pic-text-soft-shake-alt;
}

.pic-text-delay-1.is-visible { animation-delay: 0.04s; }
.pic-text-delay-2.is-visible { animation-delay: 0.08s; }
.pic-text-delay-3.is-visible { animation-delay: 0.12s; }
.pic-text-delay-4.is-visible { animation-delay: 0.16s; }
.pic-text-delay-5.is-visible { animation-delay: 0.2s; }

/* Gentle text shake: rise in, soft sway, settle — page itself does not move */
@keyframes pic-text-soft-shake {
    0% {
        opacity: 0;
        transform: translate3d(0, 16px, 0);
    }
    35% {
        opacity: 1;
        transform: translate3d(-3px, -2px, 0);
    }
    55% {
        transform: translate3d(3px, 1px, 0);
    }
    72% {
        transform: translate3d(-1.5px, -1px, 0);
    }
    88% {
        transform: translate3d(1px, 0.5px, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes pic-text-soft-shake-alt {
    0% {
        opacity: 0;
        transform: translate3d(0, 14px, 0);
    }
    35% {
        opacity: 1;
        transform: translate3d(3px, -2px, 0);
    }
    55% {
        transform: translate3d(-3px, 1px, 0);
    }
    72% {
        transform: translate3d(1.5px, -1px, 0);
    }
    88% {
        transform: translate3d(-1px, 0.5px, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}