.mobile-menu-toggle,.mobile-nav{display:none}
@media(max-width:820px){
nav,nav.light,nav.dark{height:72px;padding:0 16px;gap:8px}
nav .wordmark{font-size:24px;flex-shrink:0}nav .links{margin-left:auto;gap:0}
nav .pill{font-size:12px;min-height:40px;padding:10px 12px;white-space:nowrap}
nav .links a:not(.pill){display:none}
nav .mobile-menu-toggle{display:grid;place-content:center;gap:5px;width:40px;height:44px;flex-shrink:0;border:0;background:transparent;color:inherit;cursor:pointer}
.mobile-menu-toggle span{display:block;width:19px;height:2px;background:currentColor}
nav .mobile-nav:not([hidden]){display:grid;position:absolute;top:100%;left:16px;right:16px;padding:10px 18px;background:#fff;color:#131313;border:1px solid #eee;border-radius:16px;box-shadow:0 14px 36px #0002}
nav .mobile-nav a{display:flex;align-items:center;min-height:48px;font-size:17px;border-bottom:1px solid #eee}
nav .mobile-nav a:last-child{border-bottom:0}
#stevo.stevo-cards-section{padding-block:40px}
#stevo.stevo-cards-section .wrap{padding-inline:16px}
#stevo.stevo-cards-section .sec-head{margin-bottom:22px}
#stevo .scards-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#stevo .scards-grid:not([data-open]) .scard,#stevo .scards-grid:not([data-open]) .scard:nth-child(-n+2){grid-column:span 1;aspect-ratio:auto;min-height:0;height:176px;border-radius:16px}
#stevo .scards-grid:not([data-open]) .scard:last-child{grid-column:1/-1;height:146px}
#stevo .scards-grid:not([data-open]) .scard-head{padding:14px 12px 0;min-height:54px}
#stevo .scards-grid:not([data-open]) .scard-head h3{font-size:15px;line-height:1.18;letter-spacing:-.02em;padding-right:0}
#stevo .scards-grid:not([data-open]) .scard-body{padding:8px 10px 12px}
#stevo .scards-grid:not([data-open]) .scard-demo{overflow:hidden;border-radius:9px}
#stevo .scards-grid:not([data-open]) .demo-window{border-radius:9px}
#stevo .scards-grid:not([data-open]) .demo-toolbar{height:18px;padding-inline:6px;gap:3px}
#stevo .scards-grid:not([data-open]) .demo-toolbar span,#stevo .scards-grid:not([data-open]) .demo-preview-note{display:none}
#stevo .scards-grid:not([data-open]) .demo-toolbar i{width:3px;height:3px}
#stevo .scards-grid:not([data-open]) .demo-content{padding:7px;gap:5px;align-content:center}
#stevo .scards-grid:not([data-open]) .demo-message{font-size:9px;line-height:1.3;padding:6px;margin-left:0;border-radius:6px}
#stevo .scards-grid:not([data-open]) .demo-keys{gap:3px}
#stevo .scards-grid:not([data-open]) .demo-key{font-size:8px;padding:7px 1px;border-radius:5px;border-bottom-width:2px}
#stevo .scards-grid:not([data-open]) .demo-apps{gap:4px;font-size:9px}
#stevo .scards-grid:not([data-open]) .demo-apps span{padding:4px 7px}
#stevo .scards-grid:not([data-open]) .demo-wave{height:10px;gap:3px}
#stevo .scards-grid:not([data-open]) .demo-response{padding:6px;gap:4px}
#stevo .scards-grid:not([data-open]) .demo-line{height:4px}
#stevo .scards-grid:not([data-open]) .demo-selection{padding:9px;gap:6px}
#stevo .scards-grid:not([data-open]) .demo-cursor-ring{width:16px;height:16px;right:9px;bottom:2px}
#stevo .scards-grid:not([data-open]) .scard-sign{width:25px;height:25px;font-size:19px;bottom:7px;right:7px}
#stevo .scards-grid:not([data-open]) .scard:last-child .scard-head{min-height:0}
#stevo .scards-grid:not([data-open]) .scard:last-child .demo-content{grid-template-columns:1fr 1.6fr;align-items:center}
#stevo .scards-grid:not([data-open]) .scard:last-child .demo-response{display:none}
#stevo .scards-grid:not([data-open]) .demo-record{font-size:10px}
#stevo .scards-grid:not([data-open]) .demo-steps{font-size:9px;gap:4px}
#stevo .scards-grid:not([data-open]) .demo-steps span{padding:9px 4px}
#stevo .scards-grid[data-open] .scard:not(.is-open){grid-column:span 1;height:100px;border-radius:16px}
#stevo .scards-grid[data-open] .scard:not(.is-open) .scard-head{padding:14px 12px}
#stevo .scards-grid[data-open] .scard:not(.is-open) .scard-head h3{font-size:14px}
#stevo .scards-grid[data-open] .scard:not(.is-open) .scard-demo{display:none}
#stevo .scards-grid[data-open] .scard.is-open{grid-column:1/-1;min-height:0}
#stevo .scards-grid[data-open] .scard.is-open .scard-demo{height:260px;aspect-ratio:auto}
}

@media(max-width:820px){#stevo.stevo-cards-section{scroll-margin-top:0}#stevo.stevo-cards-section .wrap{width:100%;box-sizing:border-box}#stevo.stevo-cards-section .sec-h2{font-size:28px;line-height:1.12}#stevo.stevo-cards-section .sec-lead{font-size:14px;line-height:1.45;margin-top:12px}#stevo.stevo-cards-section .sec-head{margin-bottom:18px}}