/* Browsing flows vertically. Focused task routes retain viewport.css paging. */
html[data-layout=flow]{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
html[data-layout=flow] body{display:block;height:auto;min-height:100dvh;overflow:visible}
html[data-layout=flow] main{height:auto;min-height:60vh;overflow:visible;width:100%;padding-bottom:40px}
html[data-layout=flow] .viewport-pager{display:none}
html[data-layout=flow] main img{max-width:100%;height:auto;object-fit:contain}
html[data-layout=flow] .product-card .pack img{height:100%;width:100%}
html[data-layout=flow] main section,html[data-layout=flow] main article,html[data-layout=flow] main .split>*{min-width:0;max-width:100%}
html[data-layout=flow] main p,html[data-layout=flow] main h1,html[data-layout=flow] main h2,html[data-layout=flow] main h3{overflow-wrap:anywhere}
.connected-experiences{margin-top:48px;padding-top:32px;border-top:1px solid var(--line)}
.connected-experiences nav{justify-content:flex-start;flex-wrap:wrap;gap:12px;margin:20px 0}
.connected-experiences .product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.connected-experiences .journey-card{margin-bottom:18px}
html[data-layout=flow] .flow-footer{margin-top:48px}
@media(max-width:850px){.connected-experiences .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}html[data-layout=flow] main{padding:20px 12px 32px}}