/* Adapt the retained, localized product walkthrough to the current brand. */
.workflow-section{background:var(--paper);padding:85px 0;border-top:0}.workflow-player{border-radius:12px;border-color:var(--line);background:var(--card);box-shadow:0 16px 60px #18283d08}.workflow-story{background:var(--soft)}.workflow-step[aria-pressed=true]{background:#d7e0eb}.workflow-app-bar,.workflow-caption{background:var(--card)}.workflow-screen{background:var(--soft)}.workflow-caption p{font-size:12px}.workflow-disclaimer{font-size:10px}.workflow-label{font-size:8px}.workflow-step{font-size:12px}.workflow-controls button{min-width:40px;min-height:40px}.workflow-heading h2{font-size:clamp(32px,3.5vw,47px)}
[data-theme=dark]{--ink:#dfe5ed;--green:#97b1d3;--muted:#9da8b7;--line:#303a48;--paper:#10161d;--card:#1b2430;--soft:#161e29;color-scheme:dark}[data-theme=dark] .hero,[data-theme=dark] .closing{background:#0a1526}[data-theme=dark] .hero-art{background:#c5cfdc}[data-theme=dark] .workflow-app-brand{color:var(--ink)}[data-theme=dark] .workflow-step{color:#a8b1be}[data-theme=dark] .workflow-step[aria-pressed=true]{background:#303d4d;color:#d9e0e9}[data-theme=dark] .workflow-role,[data-theme=dark] .workflow-caption p,[data-theme=dark] .workflow-label,[data-theme=dark] .workflow-counter,[data-theme=dark] .workflow-disclaimer{color:#9ea9b8}[data-theme=dark] .workflow-controls button{background:#212b39;color:#dfe5ed;border-color:var(--line)}[data-theme=dark] .wf-scene{color:#243346}[data-theme=dark] .wf-scene .wf-mini-label{color:#afbed2}[data-theme=dark] .workflow-screen{background:#252e39}[data-theme=dark] .wf-scene>h4{color:#d7e0eb}[data-theme=dark] .workflow-avatar{color:#243346}[data-theme=dark] .tabs button[aria-selected=true]{color:#121923}[data-theme=dark] .workflow-step[aria-pressed=true]>span:first-child{color:#172435}[data-theme=dark] .workflow-step:hover{background:#303d4d}
@media(max-width:760px){.workflow-section{padding:60px 0}.workflow-heading h2{font-size:34px}.workflow-intro{font-size:12px}.workflow-step{font-size:10px}.workflow-disclaimer{text-align:left}.workflow-caption p{font-size:11px}}
[data-theme=dark] .wf-event{color:#adbfd7}
@media(max-width:760px){h1{font-size:clamp(48px,14vw,62px);letter-spacing:-2.7px}}

/* SVG geometry avoids font/emoji substitution and unstable text bounds on Safari. */
.star-mark{display:block;width:1em;height:1em;flex:none;overflow:visible}
.asterisk{display:inline-flex;align-items:center;justify-content:center}
.hotspot .star-mark{width:15px;height:15px}
.story-icon .star-mark{width:22px;height:22px}
.closing-seal>span{width:115px;height:115px;display:flex;align-items:center;justify-content:center;line-height:1;transform-origin:50% 50%;margin-inline:auto;animation:none}
.closing-seal .star-mark{width:100%;height:100%;transform-box:fill-box;transform-origin:center;animation:seal-turn 40s linear infinite}
@media(max-width:760px){.closing-seal{flex:0 0 100px}.closing-seal>span{width:65px;height:65px}}
@media(prefers-reduced-motion:reduce){.closing-seal .star-mark{animation:none}}
@media(max-width:760px){.closing-inner{flex-direction:column;align-items:flex-start;gap:32px}.closing-seal{display:flex;align-items:center;gap:16px;flex:none;text-align:left}.closing-seal>span{margin:0;width:56px;height:56px}.closing-seal p{max-width:none;margin:0!important;font-size:8px!important;line-height:1.8}}

/* Draw diagonal arrows as vectors so iOS cannot substitute emoji glyphs. */
.arrow-icon{display:inline-block;width:1em;height:1em;flex:0 0 auto;vertical-align:middle;color:inherit}
.arrow-up-left{transform:rotate(-90deg)}
.button>.arrow-icon,.button>span[aria-hidden]>.arrow-icon{width:18px;height:18px}
.button>span[aria-hidden]{display:inline-flex;align-items:center}
.story-next{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 auto}
.hotspot>.arrow-icon{width:15px;height:15px}
.story-icon>.arrow-icon{width:22px;height:22px}
