/* Local service artwork: examples to check, never an acceptance or partner badge. */
.service-figure { margin:0 0 24px; width:100%; }
.service-art { isolation:isolate; position:relative; width:100%; height:216px; overflow:hidden; border-radius:18px; background:#edf1e5; }
.service-art::after { content:""; position:absolute; width:240px; height:240px; border:1px solid #b7c69c55; border-radius:50%; right:-65px; top:-80px; z-index:-1; }
.service-figure figcaption { margin-top:10px; color:#747d6d; font-size:11px; letter-spacing:.01em; line-height:1.5; }
.service-scene { position:absolute; inset:0; pointer-events:none; }
.service-mark { position:absolute; display:flex; align-items:center; gap:11px; padding:14px 16px; min-height:62px; background:#fff; border:1px solid #e2e7db; border-radius:15px; box-shadow:0 10px 24px -18px #24331d70; z-index:1; transition:transform .3s ease; }
.service-mark img { width:30px; height:30px; flex-shrink:0; object-fit:contain; }
.service-mark span { font-size:12px; font-weight:600; line-height:1.25; white-space:nowrap; color:#20271f; }
.service-mark-1 { top:25px; left:20px; transform:rotate(-5deg); }
.service-mark-2 { top:84px; right:20px; transform:rotate(5deg); }
.service-mark-3 { top:143px; left:24px; transform:rotate(-3deg); }
.service-art-shopping { background:#eff1e5; }
.service-art-shopping .service-mark { left:auto; right:20px; top:124px; transform:rotate(-5deg); }
.service-shopping-bag { width:115px; height:124px; background:#d5f96e; border-radius:9px 9px 18px 18px; position:absolute; top:58px; left:28px; transform:rotate(-11deg); box-shadow:0 12px 25px -18px #52612b; }
.service-shopping-bag::before { content:""; width:43px; height:35px; position:absolute; left:34px; top:-21px; border:5px solid #586c39; border-bottom:0; border-radius:25px 25px 0 0; }
.service-shopping-bag span { display:block; width:50px; height:50px; margin:35px auto; border:2px solid #778b4b; border-radius:50%; }
.service-shopping-bag span::before { content:""; display:block; width:18px; height:9px; border-left:3px solid #586c39; border-bottom:3px solid #586c39; transform:rotate(-45deg); margin:15px 12px; }
.service-receipt { position:absolute; right:30px; top:25px; width:86px; height:100px; background:#fff; border:1px solid #e2e7db; border-radius:6px; transform:rotate(12deg); padding:22px 14px; }
.service-receipt i { display:block; height:4px; background:#ccd5bb; margin-bottom:12px; border-radius:3px; }
.service-receipt i:nth-child(2) { width:65%; }
.service-art-subscriptions { background:#e7ecdd; }
.service-art-subscriptions .service-mark-2 { right:18px; top:76px; }
.service-player { position:absolute; width:170px; height:110px; border-radius:18px; right:-20px; bottom:20px; background:#2b3525; transform:rotate(12deg); display:flex; align-items:center; gap:5px; padding:35px 30px; }
.service-player i { display:block; width:5px; height:19px; border-radius:4px; background:#d5f96e; }
.service-player i:nth-child(3) { height:30px; }
.service-player i:nth-child(4) { height:42px; }
.service-player i:nth-child(5) { height:34px; }
.service-art-ai { background:#263021; }
.service-art-ai::after { border-color:#d5f96e25; }
.service-art-ai .service-mark { border-color:#e4eadc; }
.service-art-ai .service-mark-1 { top:23px; left:24px; }
.service-art-ai .service-mark-2 { right:18px; top:82px; }
.service-orbit { width:215px; height:110px; border:1px solid #d5f96e55; position:absolute; left:28px; top:54px; border-radius:50%; transform:rotate(-45deg); }
.service-orbit.second { transform:rotate(35deg); }
.service-art-creative { background:#eff1e6; }
.service-art-creative .service-mark-1 { left:22px; top:29px; }
.service-art-creative .service-mark-2 { top:136px; right:23px; }
.service-palette { position:absolute; display:flex; gap:6px; bottom:24px; left:24px; transform:rotate(-6deg); }
.service-palette i { width:39px; height:52px; border-radius:9px; background:#20271f; border:3px solid #fff; box-shadow:0 4px 7px #20271f12; }
.service-palette i:nth-child(2) { background:#8f9e6f; }
.service-palette i:nth-child(3) { background:#d5f96e; }
.service-curve { position:absolute; width:230px; right:-15px; top:4px; fill:#d5f96e; stroke:#859868; stroke-width:2; }
.service-curve path { fill:none; }
.service-art-work { background:#e9eee1; }
.service-art-work .service-mark-1 { left:17px; top:23px; }
.service-art-work .service-mark-2 { top:128px; right:17px; }
.service-chat { position:absolute; right:25px; top:84px; width:105px; height:56px; border-radius:12px 12px 3px 12px; background:#d5f96e; padding:15px; transform:rotate(6deg); }
.service-chat.second { left:23px; top:118px; background:#dbe2ce; width:88px; transform:rotate(-6deg); }
.service-chat i { height:3px; background:#70834e; display:block; margin-bottom:7px; border-radius:3px; }
.service-chat i:last-child { width:60%; }
.service-art-gaming { background:#2a3424; }
.service-art-gaming::after { border-color:#d5f96e20; }
.service-gamepad { position:absolute; right:-25px; bottom:-30px; width:200px; height:200px; transform:rotate(20deg); }
.service-gamepad svg { fill:#d5f96e17; stroke:#d5f96e50; stroke-width:.8; width:100%; height:100%; }
@media (hover:hover) and (pointer:fine) {
 .use-case-card:hover .service-mark-1 { transform:translateY(-3px) rotate(-7deg); }
 .use-case-card:hover .service-mark-2 { transform:translateY(-2px) rotate(7deg); }
 .use-case-card:hover .service-mark-3 { transform:translateY(-4px) rotate(-5deg); }
}
@media(max-width:650px) {
 .service-art { height:228px; }
 .service-mark-1 { left:26px; }
 .service-mark-2 { right:26px; }
 .service-mark-3 { left:30px; }
 .service-figure figcaption { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) {
 .service-mark { transition:none; }
 .use-case-card:hover .service-mark-1 { transform:rotate(-5deg); }
 .use-case-card:hover .service-mark-2 { transform:rotate(5deg); }
 .use-case-card:hover .service-mark-3 { transform:rotate(-3deg); }
}
