/* Keep the content centered inside a frame of floating illustrations. */
.service-artwork-section {
    --art-size: clamp(90px, 11vw, 165px);
    --art-gutter: clamp(110px, 14vw, 205px);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: calc(var(--art-size) + 45px) 0 !important;
}
.service-artwork-section > .container {
    position: relative;
    z-index: 1;
    width: calc(100% - var(--art-gutter) * 2);
    max-width: 960px;
    margin-inline: auto;
    padding: 0 !important;
}
.service-artwork-section .illus-heading { text-align: center; }
.service-artwork-section .illustrate-contents { margin-inline: auto; }
.service-artwork { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.service-artwork__float {
    position: absolute;
    width: var(--art-size);
    height: var(--art-size);
    opacity: .42;
    mix-blend-mode: multiply;
    animation: service-artwork-float var(--duration) ease-in-out var(--delay) infinite;
}
.service-artwork__float--top,
.service-artwork__float--bottom {
    left: clamp(12px, calc(var(--position) - var(--art-size) / 2), calc(100% - var(--art-size) - 12px));
}
.service-artwork__float--top { top: 22px; }
.service-artwork__float--bottom { bottom: 22px; animation-name: service-artwork-drift; }
.service-artwork__float--left,
.service-artwork__float--right {
    top: calc(var(--art-size) + 40px + (100% - var(--art-size) * 3 - 80px) * var(--edge-fraction, .5));
}
.service-artwork__float--left { left: 20px; }
.service-artwork__float--right { right: 20px; animation-name: service-artwork-drift; }
.service-artwork__float svg { display: block; width: 100%; height: 100%; overflow: hidden; }
.service-artwork-refined { --art-size: clamp(96px, 12vw, 180px); }
.service-artwork-refined .service-artwork__float { opacity: .52; }
.service-artwork-refined .service-artwork__float svg {
    /* Inset the crop so rotation leaves clear space around the complete outline. */
    box-sizing: border-box;
    padding: 10px;
    filter: contrast(1.08);
}
@keyframes service-artwork-float {
    0%, 100% { transform: translate3d(0, 0, 0) rotate(-3deg); }
    50% { transform: translate3d(10px, -16px, 0) rotate(3deg); }
}
@keyframes service-artwork-drift {
    0%, 100% { transform: translate3d(0, -8px, 0) rotate(2deg); }
    50% { transform: translate3d(-10px, 12px, 0) rotate(-3deg); }
}
@media (max-width: 767px) {
    .service-artwork-section { --art-size: 48px; --art-gutter: 58px; }
    .service-artwork-refined { --art-size: 52px; --art-gutter: 62px; }
    .service-artwork-refined .service-artwork__float { opacity: .4; }
    .service-artwork__float { opacity: .32; }
    .service-artwork__float--left { left: 3px; }
    .service-artwork__float--right { right: 3px; }
    .service-artwork-section .illus-first-detail p { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
    .service-artwork__float { animation: none; }
}