.demo-container{display:flex;flex-direction:column;gap:1.5rem}.demo-title{font-size:.875rem;font-weight:600;color:rgb(55,65,81)}.demo-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}@media (min-width:768px){.demo-grid{grid-template-columns:1fr 1fr}}.demo-section{display:flex;flex-direction:column;gap:.75rem;height:100%}.demo-frame{flex:1;display:flex;align-items:center;justify-content:center}.section-title{font-weight:500;color:rgb(31,41,55);text-align:center}.demo-frame{border:2px dashed;border-radius:.5rem;padding:1rem}.before-frame{border-color:rgb(209,213,219);background-color:rgb(249,250,251)}.after-frame{border-color:rgb(147,197,253);background-color:rgb(239,246,255)}.demo-caption{font-size:.75rem;color:rgb(107,114,128);text-align:center}.demo-note{border-radius:.375rem;border-left:4px solid rgb(59,130,246);background-color:rgb(239,246,255);padding:.75rem;font-size:.875rem;color:rgb(75,85,99)}.container-before{background:white;padding:1rem;border-radius:.375rem;width:100%;box-sizing:border-box}.title-before{font-size:2em;font-weight:700;margin:.67em 0}.description-before,.img-before{margin:1em 0}.img-before{width:80px;height:80px;display:block}.title{font-size:2.5rem;font-weight:800;margin:0 0 1rem;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.description{font-size:1.1rem;font-weight:300;margin:0 0 1.5rem;opacity:.9;line-height:1.6}.container{max-width:280px;margin:0 auto;padding:1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.1);text-align:center;color:white;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.container img{max-width:80px;height:auto;border-radius:15px;transition:transform .3s ease,box-shadow .3s ease;animation:rotate 8s linear infinite;display:block;margin:0 auto}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}