@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500&display=swap");.demo-section{padding:50px 5%;background-color:#f9f9f9;text-align:center;font-family:Poppins}.demo-header h2{font-size:2.5rem;margin-bottom:10px;color:#333;font-weight:600}.demo-header h2 span{color:red}.demo-header p{color:#666;margin-bottom:40px}.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:25px;gap:25px;max-width:1200px;margin:0 auto}.video-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,.1);transition:transform .3s ease}.card-media{position:relative;padding-bottom:56.25%;height:0}.card-media iframe{position:absolute;top:0;left:0;width:100%;height:100%}.card-body{padding:20px;text-align:left}.lang-tag{background:#004d5a;color:#fff;padding:4px 10px;font-size:.8rem;border-radius:4px;text-transform:uppercase}.card-body h3{font-size:1.2rem}.watch-btn{width:100%;padding:10px;background-color:transparent;border:2px solid #e00505;color:#e00505;font-weight:700;border-radius:5px;cursor:pointer;transition:.3s;font-family:Poppins;font-weight:500;display:flex;justify-content:center;align-items:center}.watch-btn:hover{background-color:#e00505;color:#fff}.card-body h3{margin:15px 0;font-size:1.1rem;color:#333;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;height:2.8em}.search-container-wrapper{position:relative;max-width:600px;margin:30px auto;z-index:100}.search-box{background:#fff;border:2px solid #004d5a;border-radius:50px;padding:5px 20px;box-shadow:0 4px 15px rgba(0,0,0,.1)}.search-box,.search-icon{display:flex;align-items:center}.search-icon{justify-content:center}.main-search-input{width:100%;border:none;padding:12px 0;font-size:1rem;outline:none;background:transparent}.main-search-input::placeholder{font-family:Poppins,sans-serif;font-weight:400;color:#888;opacity:1}.main-search-input::-webkit-input-placeholder{font-family:Poppins,sans-serif}.main-search-input::-moz-placeholder{font-family:Poppins,sans-serif}.main-search-input:-ms-input-placeholder{font-family:Poppins,sans-serif}.main-search-input::-ms-input-placeholder{font-family:Poppins,sans-serif}.suggestion-list{position:absolute;top:110%;left:0;right:0;background:#fff;border-radius:12px;box-shadow:0 10px 25px rgba(0,0,0,.2);list-style:none;padding:10px 0;margin:0;max-height:250px;overflow-y:auto;text-align:left;border:1px solid #eee}.suggestion-list li{padding:12px 20px;cursor:pointer;font-size:.95rem;color:#333;transition:.2s;border-bottom:1px solid #f9f9f9}.suggestion-list li:last-child{border-bottom:none}.suggestion-list li:hover{background-color:#f1f1f1;color:red}.no-results-state{flex-direction:column;padding:40px 20px;margin:20px auto;max-width:500px;width:90%;border-radius:8px;text-align:center}.no-results-state,.no-results-state h3{display:flex;justify-content:center;align-items:center}.no-results-state h3{font-weight:400;font-size:1.2rem;margin-bottom:20px}.clear-search-btn,.no-results-state h3{color:red;font-family:Poppins,sans-serif}.clear-search-btn{border:1px solid red;background:transparent;padding:10px 25px;cursor:pointer;border-radius:50px;transition:all .3s ease;font-size:.9rem}.clear-search-btn:hover{background:red;color:#fff}@media (max-width:480px){.no-results-state h3{font-size:1rem}.no-results-state{padding:30px 15px}}.suggestion-list::-webkit-scrollbar{width:6px}.suggestion-list::-webkit-scrollbar-thumb{background:#ccc;border-radius:10px}@media (max-width:600px){.video-grid{grid-template-columns:1fr}}.no-results{width:100%;min-height:40vh;justify-content:center;padding:16px;text-align:center}.loader-wrap,.no-results{display:flex;align-items:center}.loader-wrap{flex-direction:column;gap:12px}.loader{width:48px;height:48px;border:4px solid #e0e0e0;border-top-color:#ff2c2c;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.loader-wrap p{font-size:14px;color:#555;font-weight:500}.not-found{display:flex;flex-direction:column;align-items:center;gap:10px;color:#666}.not-found i{font-size:40px;color:#999}.not-found p{font-size:15px;font-weight:500}@media (max-width:768px){.loader{width:36px;height:36px;border-width:3px}.not-found i{font-size:32px}.not-found p{font-size:14px}}