/* ==========================================================================
   Busi.bio page illustration
   --------------------------------------------------------------------------
   Inline SVG scene that introduces a page. Height is driven by the
   --busi-ill-h custom property; the width follows the aspect ratio.
   ========================================================================== */

.busi-illustration {
    display: inline-block;
    height: var(--busi-ill-h, 320px);
    width: auto;
    max-width: 100%;
    line-height: 0;
    vertical-align: middle;
}

.busi-illustration > svg {
    display: block;
    height: 100%;
    width: auto;
    max-width: 100%;
}

/* Soft float so the scene feels alive without being distracting. */
@media (prefers-reduced-motion: no-preference) {
    .busi-illustration > svg {
        animation: busiIllustrationFloat 7s ease-in-out infinite;
    }
}

@keyframes busiIllustrationFloat {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

/* Small screens: scale the scene down so it never overflows. */
@media (max-width: 640px) {
    .busi-illustration {
        height: min(var(--busi-ill-h, 320px), 210px);
    }
}
