/* OC-SCN-023: approved layered artwork; native1254px master, independent HTML labels. */
.oc-perspective{width:100%;max-width:600px;min-width:0;margin:0;justify-self:center;align-self:center;pointer-events:none;isolation:isolate}
.perspective-stage{position:relative;aspect-ratio:1}
.perspective-stage picture,.perspective-stage img{display:block;width:100%;height:auto}
.perspective-light{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.perspective-trace{opacity:0;stroke-dasharray:13 87;stroke-dashoffset:100;animation:perspective-travel 16s ease-in-out infinite}
.perspective-key{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0;padding:0 3%;color:#f2f8ec;font:500 15px/1.4 Inter,Arial,sans-serif;text-align:center}
.perspective-key span{position:relative;padding-top:27px}
.perspective-key span:before{content:"";position:absolute;top:0;left:50%;width:1px;height:17px;background:#d9ecd5b3}
.perspective-key span:after{content:"";position:absolute;top:0;left:calc(50% - 2px);width:5px;height:5px;border-radius:50%;background:#ecf5e6}
.oc-perspective[data-motion-level="quiet"] .perspective-trace{animation:none;opacity:0}
body.motion-idle .oc-perspective *,body.paused .oc-perspective *,.oc-perspective.no-motion *{animation-play-state:paused!important}
@keyframes perspective-travel{0%,12%{stroke-dashoffset:100;opacity:0}20%{opacity:.42}62%{stroke-dashoffset:0;opacity:.42}72%,100%{stroke-dashoffset:0;opacity:0}}
@media(max-width:999px){.oc-perspective{max-width:500px}}
@media(max-width:699px){.connected--art-v7 .oc-perspective{grid-row:4;margin:0 auto}.perspective-key{font-size:14px;gap:4px;padding-inline:0}.perspective-key span{padding-top:21px}.perspective-key span:before{height:13px}}
@media(prefers-reduced-motion:reduce){.oc-perspective .perspective-trace{animation:none!important;opacity:0}}
