/* "Slow down" section: the tablet-vs-drip absorption story. Colours follow the section's blue panel. */
.ritual-visual .story{position:relative;z-index:1;width:min(400px,86%);display:flex;flex-direction:column;gap:4px}
.story-head{min-height:70px;text-align:center}
.story-eyebrow{display:block;font-size:9px;letter-spacing:2px;font-weight:650;color:#b6d1ff;transition:opacity .25s,transform .25s}
.story-line{display:block;margin-top:10px;font-family:'Manrope',sans-serif;font-weight:500;font-size:22px;letter-spacing:-.6px;line-height:1.25;color:#fff;transition:opacity .25s,transform .25s}
.story-head.swap .story-eyebrow,.story-head.swap .story-line{opacity:0;transform:translateY(6px)}
.story-svg{display:block;width:100%;height:auto;overflow:visible}
.story-svg .route{fill:none;stroke:#fff;stroke-linecap:round;transition:stroke-opacity .9s ease}
.story-svg .route-tablet{stroke-opacity:.4;stroke-width:1.4;stroke-dasharray:2 7}
.story-svg .route-iv{stroke-opacity:0;stroke-width:2}
.story-svg.act2 .route-tablet{stroke-opacity:.12}
.story-svg.act2 .route-iv{stroke-opacity:.55}
.story-svg .stop circle{fill:#fff;fill-opacity:.45;transform-box:fill-box;transform-origin:center;transition:fill-opacity .4s,transform .5s cubic-bezier(.34,1.56,.64,1)}
.story-svg .stop text{fill:#fff;fill-opacity:.55;font:650 7.5px 'DM Sans',sans-serif;letter-spacing:1.6px;transition:fill-opacity .4s}
.story-svg .stop.on circle{fill-opacity:1;transform:scale(1.7)}
.story-svg .stop.on text{fill-opacity:1}
.story-svg.act2 .stop circle,.story-svg.act2 .stop text{fill-opacity:.18}
.story-svg .vessel{fill:#fff;fill-opacity:.06;stroke:#fff;stroke-opacity:.4;stroke-width:1}
.story-svg .vessel-label,.story-svg .row-label{fill:#b6d1ff;font:650 7.5px 'DM Sans',sans-serif;letter-spacing:2px}
.story-svg .row-label{fill:#d0e0ff}
.story-svg .row-val{fill:#fff;font:500 22px 'Manrope',sans-serif;letter-spacing:-.5px}
.story-svg .track{fill:#fff;fill-opacity:.2}
.story-svg .fill{fill:#fff}
.story-svg .fill-tab{fill:#bbd9ff}
.story-svg .dot-tab{fill:#bbd9ff}
.story-svg .dot-iv{fill:#fff}
.story-pill{position:absolute;left:0;top:0;width:44px;height:60px;border-radius:50%;pointer-events:none;opacity:0;will-change:transform,opacity;
  background:radial-gradient(ellipse at 28% 26%,#e6f5ff,#8fc0fb 26%,#2a6ce9 62%,#1d4fba 92%);
  box-shadow:inset 3px 5px 10px #e7f8ff80,8px 14px 22px #073ca8aa;transition:border-radius .8s ease,background .8s ease,width .8s ease,height .8s ease}
.story-pill.is-drop{width:46px;height:46px;border-radius:0 50% 50% 50%;background:radial-gradient(ellipse at 38% 34%,#fff,#dcefff 34%,#9ac8ff 72%,#6aa3f7)}
.ritual-visual.pulse .ripple{animation:ripple-pulse 1.6s ease-out}
@keyframes ripple-pulse{0%{border-color:#ffffff26;transform:scaleY(.75)}30%{border-color:#ffffff80;transform:scaleY(.75) scale(1.035)}100%{border-color:#ffffff26;transform:scaleY(.75)}}
.story-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ritual-visual .visual-caption{bottom:28px;max-width:86%;text-align:center;line-height:1.7}
@media(max-width:900px){
  .ritual-visual{min-height:600px;padding:36px 0 70px}
  .ritual-visual .story{width:min(380px,88%)}
  .story-line{font-size:19px}
}
@media(prefers-reduced-motion:reduce){.story-pill{display:none}}