.guardrails-architecture{margin:28px 0 0}.guardrails-architecture-canvas{overflow-x:auto}.guardrails-architecture img{display:block;width:100%;min-width:960px;height:auto}.guardrails-architecture figcaption{font-size:12px;line-height:1.7;color:#a2b2c3;margin-top:14px}#how-it-works,#guardrails{scroll-margin-top:80px}.guardrails-architecture-canvas:focus-visible{outline:2px solid #3fc7d4;outline-offset:4px}
.mobile-swipe-hint{display:none}
@media(max-width:760px){
.guardrails-page .mobile-swipe-hint{display:block;color:#3fc7d4;font-size:12px;margin-top:18px;line-height:1.5}
.guardrails-page #why-guardrails .x-points,.guardrails-page #guardrails .x-points{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:4px 0 16px;margin-top:16px;scrollbar-width:thin}
.guardrails-page #why-guardrails .x-point,.guardrails-page #guardrails .x-point{flex:0 0 88%;min-width:0;scroll-snap-align:start}
.guardrails-page #why-guardrails .x-point p,.guardrails-page #guardrails .x-point p{font-size:14px;line-height:1.5}
.guardrails-page [data-mobile-scroll] .x-showcase-stage{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;height:260px;scrollbar-width:thin}
.guardrails-page [data-mobile-scroll] .x-showcase-slide{position:relative;inset:auto;flex:0 0 100%;min-width:0;opacity:1;transition:none;scroll-snap-align:start}
.guardrails-page [data-mobile-scroll] .x-showcase-tabs{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start}
.guardrails-page [data-mobile-scroll] .x-showcase-tabs button{flex:0 0 auto}
.guardrails-page [tabindex="0"]:focus-visible{outline:2px solid #3fc7d4;outline-offset:3px}
}
@media(max-width:760px){.guardrails-page [data-mobile-scroll] .x-showcase-tabs{max-width:100%;width:100%;min-width:0;box-sizing:border-box}}
@media(max-width:360px){.guardrails-page #why-guardrails .x-point,.guardrails-page #guardrails .x-point{flex-basis:100%}}