/* /for-sites: page-only rules. The demo, steps, mocks and platform table come from the shared CSS. */
.fs-group{display:contents}

/* The phone's clock is decoration inside an aria-hidden mock. As generated content it is not read as page text, so a contrast checker does not score it against whatever scene is on screen mid-animation. */
.wgd .wg-clock::before{content:"9:41"}

/* The demo's scene progress fills the whole button behind its label, not a thin bar along the bottom edge. */
.wgd-scene::after{height:100%;background:rgba(255,255,255,.2)}
.wgd--dark .wgd-scene::after{background:rgba(10,13,20,.14)}

.fs-hosted h3{font:500 clamp(1.55rem,2.5vw,2.1rem)/1.12 var(--font-head);letter-spacing:-.035em}
.fs-img{display:block;width:100%;max-width:440px;height:auto;margin-inline:auto;border-radius:20px}

.fs-people{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 48px;margin-top:clamp(40px,6vw,72px)}
.fs-people-copy{flex:1 1 420px;max-width:62ch}
.fs-people h3{font:500 clamp(1.3rem,2vw,1.6rem)/1.15 var(--font-head);letter-spacing:-.03em}
.fs-people-copy p{margin-top:10px;color:var(--muted);line-height:1.6}

.fs-plans{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 48px}
.fs-plans-copy{flex:1 1 420px}
.fs-plans .btn-row{margin-top:0}
