@layer components{.pol{--pol-gutter:96px;--pol-t0:10%;--pol-span:56%}.pol__map{position:relative}.pol__beats{grid-auto-rows:1fr;display:grid;position:relative}.pol__beat{grid-template-columns:minmax(0, 1fr) var(--pol-gutter) minmax(0, 1fr);padding-block:var(--s-4);align-items:center;display:grid}.pol__dot{z-index:1;background:var(--surface);box-shadow:0 0 0 4px var(--canvas);border-radius:50%;grid-area:1/2;justify-self:center;position:relative}.pol__card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:var(--s-6) var(--s-8);grid-area:1/1;position:relative}.pol__beat:nth-child(2n) .pol__card{grid-column:3}.pol__card:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:0 0 0 1px #6d28d929,0 22px 44px -26px #6d28d973}.pol__key{font-family:var(--font-ui);color:var(--violet-700);font-size:13px;font-weight:500}.pol__title{margin-block:var(--s-2) var(--s-3);font-size:clamp(1.25rem,1.1rem + .5vw,1.5rem);font-weight:400}.pol__body{color:var(--ink-2)}.pol__wave{inline-size:var(--pol-gutter);block-size:100%;margin-inline:auto;position:absolute;inset-block:0;inset-inline:0;overflow:visible}.pol__wave path{fill:none;stroke-width:2px;stroke-linecap:round;vector-effect:non-scaling-stroke}.pol__wave--track path{stroke:var(--line)}.pol__wave--lit path{stroke:url(#pol-light)}.pol__stop-a{stop-color:var(--violet-500)}.pol__stop-b{stop-color:var(--green-700)}.pol__rail{display:none}@media (max-width:899px){.pol{--pol-gutter:16px;--pol-span:58%}.pol__beat{grid-template-columns:var(--pol-gutter) minmax(0, 1fr);-moz-column-gap:var(--s-4);column-gap:var(--s-4)}.pol__dot{grid-column:1}.pol__card,.pol__beat:nth-child(2n) .pol__card{padding:var(--s-4) var(--s-6);grid-column:2}.pol__wave{display:none}.pol__rail{inline-size:2px;display:block;position:absolute;inset-block:0;inset-inline-start:7px}.pol__rail--track{background:linear-gradient(transparent 12.5%, var(--line) 12.5%, var(--line) 87.5%, transparent 87.5%)}.pol__rail--lit{background:linear-gradient(transparent 12.5%, var(--violet-500) 12.5%, var(--green-700) 87.5%, transparent 87.5%)}}}@layer motion{@supports (animation-timeline:view()){.pol__map{view-timeline:--pol block}@media (prefers-reduced-motion:no-preference){:root:not([data-a11y-stopmotion]) .pol__wave--lit,:root:not([data-a11y-stopmotion]) .pol__rail--lit{animation:linear both pol-trace;animation-timeline:--pol;animation-range:cover var(--pol-t0) cover calc(var(--pol-t0) + var(--pol-span))}:root:not([data-a11y-stopmotion]) .pol__beat{--at:calc((var(--i) + .5) / var(--n));--lit-from:calc(var(--pol-t0) + var(--pol-span) * var(--at) - 2%);--lit-to:calc(var(--pol-t0) + var(--pol-span) * var(--at) + 1%)}:root:not([data-a11y-stopmotion]) .pol__dot .presence{animation:linear both pol-dot;animation-timeline:--pol;animation-range:cover var(--lit-from) cover var(--lit-to)}:root:not([data-a11y-stopmotion]) .pol__card:after{animation:linear both pol-bloom;animation-timeline:--pol;animation-range:cover var(--lit-from) cover var(--lit-to)}}}@keyframes pol-trace{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}@keyframes pol-dot{0%{opacity:.3;transform:scale(.82)}to{opacity:1;transform:none}}@keyframes pol-bloom{0%{opacity:0}to{opacity:1}}}
