.app-tour{background:#eef1ed;border-block:1px solid #dde3df;scroll-margin-top:90px}
.tour-layout{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.tour-intro{max-width:490px}.tour-intro h2{margin-bottom:24px}
.tour-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:30px 0}
.tour-choices button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #cbd3ce;border-radius:14px;padding:14px;background:transparent;color:var(--ink);font:inherit;cursor:pointer;min-height:52px;line-height:1.35}
.tour-choices button span{font-size:.72rem;color:#596f65;font-weight:600}
.tour-choices button:hover{background:#e3e9e3}.tour-choices button[aria-pressed=true]{background:#344e48;border-color:#344e48;color:#fff}.tour-choices button[aria-pressed=true] span{color:#d2e1d5}
.tour-disclosure{font-size:.8rem;line-height:1.7;color:#54645e;max-width:390px}
.tour-view{text-align:center;min-width:0}.tour-slide{margin:0}.tour-phone{width:min(252px,100%);margin:0 auto;border:7px solid #344e48;border-radius:36px;overflow:hidden;box-shadow:0 24px 48px -24px #18352960;background:#f6f5f0;padding:0}
.tour-phone img{display:block;width:100%;height:auto;aspect-ratio:9/20;object-fit:contain;border-radius:0}
.tour-slide figcaption{max-width:440px;margin:26px auto 0;min-height:172px;font-size:1rem;color:var(--ink);line-height:1.65}
.tour-slide figcaption h3{font-size:1.35rem;letter-spacing:-.025em;margin:0 0 10px}.tour-slide figcaption p{font-size:.95rem;margin:0 0 12px}.tour-slide .text-link{font-size:.88rem}
.tour-controls{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px}
.tour-controls button{height:44px;min-width:44px;border:1px solid #c0ccc4;border-radius:50%;background:#fff8;color:var(--ink);font:inherit;cursor:pointer}
.tour-controls button:hover{background:white}.tour-controls span{font-size:.8rem;min-width:42px;font-variant-numeric:tabular-nums}
.tour-controls .tour-play{border-radius:24px;font-size:.78rem;padding:0 16px;margin-left:8px}.tour-controls button:disabled{cursor:default;color:#59695f}
.app-tour button:focus-visible{outline:3px solid #62799a;outline-offset:4px}.app-tour [hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.feature-screenshot .tour-phone{width:270px}.feature-screenshot figcaption{max-width:290px;margin:22px auto 0}
@media(min-width:901px){.tour-intro{align-self:center}}
@media(max-width:900px){.tour-layout{gap:32px}.tour-choices{grid-template-columns:1fr}.tour-slide figcaption{min-height:215px}.tour-phone{width:236px}}
@media(max-width:620px){.tour-layout{grid-template-columns:1fr;gap:30px}.tour-intro{max-width:none}.tour-choices{grid-template-columns:1fr 1fr;gap:8px;margin:24px 0 18px}.tour-choices button{padding:12px 10px;font-size:.84rem;gap:8px}.tour-disclosure{font-size:.75rem}.tour-slide figcaption{min-height:170px;margin-top:24px}.tour-phone{width:252px}.feature-screenshot .tour-phone{width:252px}}
@media(prefers-reduced-motion:reduce){.app-tour *{scroll-behavior:auto}}

/* On small screens keep the phone, description and controls together before the optional feature shortcuts. */
@media(max-width:620px){.tour-layout{display:flex;flex-direction:column;gap:0}.tour-intro{display:contents}.tour-intro>.eyebrow,.tour-intro>h2,.tour-intro>.section-lede{align-self:stretch}.tour-view{order:1;width:100%;margin-top:24px}.tour-choices{order:2;align-self:stretch;margin:28px 0 18px}.tour-disclosure{order:3;align-self:stretch}}
