.demo-preview {margin:2rem 0;position:relative;border-radius:20px;overflow:hidden;background:#071b22;border:1px solid #29474e;} .demo-preview img {display:block;width:100%;height:auto;} .demo-preview .demo-play {position:absolute;bottom:6%;left:50%;transform:translateX(-50%);padding:.8rem 1.3rem;background:#d4f568;color:#163239;border-radius:999px;font:inherit;font-weight:700;border:0;white-space:nowrap;} .demo-transcript {max-width:75ch;} @media(max-width:700px){.demo-preview .demo-play{font-size:.82rem;padding:.65rem 1rem;bottom:4%;}}

.demo-play {text-decoration:none;} .demo-play:focus-visible {outline:3px solid #fff;outline-offset:4px;} .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;}

.demo-language-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;margin-top:2rem}.demo-language-card{min-width:0}.demo-language-card h3{display:flex;justify-content:space-between;align-items:center;margin:0;font-size:1.2rem}.demo-language-card h3 span{font-size:.85rem;font-weight:400;color:#55726f}.demo-language-card .demo-preview{margin:.8rem 0 1rem}.demo-language-card .demo-play{font-size:1rem;padding:.7rem 1rem}.demo-language-note{max-width:80ch;font-size:.9rem}.demo-transcript{margin-top:1rem}.demo-transcript summary{cursor:pointer;font-weight:600}.demo-transcript p{line-height:1.65}@media(max-width:850px){.demo-language-grid{grid-template-columns:1fr;gap:1.75rem}.demo-language-card .demo-play{font-size:.9rem}}