@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@600;700;800&display=swap');.courses-hero{position:relative;padding:7rem 0 5rem;background:linear-gradient(135deg,#36454f 0%,#1a5faa 50%,#157eee 100%);overflow:hidden;margin-top:60px;isolation:isolate;text-align:center;color:#fff}.courses-hero-bg{position:absolute;inset:0;background-image:radial-gradient(ellipse 80% 50% at 20% 80%,rgba(21,126,238,.3) 0%,transparent 60%),radial-gradient(ellipse 60% 80% at 85% 15%,rgba(94,96,206,.25) 0%,transparent 55%),radial-gradient(ellipse 70% 60% at 50% 50%,rgba(21,126,238,.1) 0%,transparent 70%);pointer-events:none;z-index:1}.courses-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:60px 60px;z-index:2;pointer-events:none;mask-image:radial-gradient(ellipse at center,black 30%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse at center,black 30%,transparent 80%)}.courses-hero::after{content:'';position:absolute;top:-30%;right:-8%;width:500px;height:500px;background:radial-gradient(circle,rgba(21,126,238,.2) 0%,rgba(94,96,206,.08) 40%,transparent 70%);border-radius:50%;animation:coursesOrbFloat 8s ease-in-out infinite;z-index:1}.courses-hero-particles{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}.courses-hero-particles span{position:absolute;background:rgba(255,255,255,.4);border-radius:50%;animation:coursesParticleDrift linear infinite;box-shadow:0 0 6px rgba(255,255,255,.2)}.courses-hero-particles span:nth-child(1){left:5%;top:12%;width:6px;height:6px;animation-duration:9s;animation-delay:0s}.courses-hero-particles span:nth-child(2){left:18%;top:50%;width:9px;height:9px;animation-duration:12s;animation-delay:1s}.courses-hero-particles span:nth-child(3){left:38%;top:22%;width:5px;height:5px;animation-duration:8s;animation-delay:2.5s}.courses-hero-particles span:nth-child(4){left:68%;top:60%;width:10px;height:10px;animation-duration:11s;animation-delay:.5s}.courses-hero-particles span:nth-child(5){left:85%;top:30%;width:7px;height:7px;animation-duration:10s;animation-delay:1.5s}.courses-hero-particles span:nth-child(6){left:30%;top:78%;width:8px;height:8px;animation-duration:13s;animation-delay:3s}.courses-hero-particles span:nth-child(7){left:55%;top:8%;width:5px;height:5px;animation-duration:14s;animation-delay:2s}.courses-hero-particles span:nth-child(8){left:12%;top:82%;width:7px;height:7px;animation-duration:9s;animation-delay:.8s}.courses-hero-particles span:nth-child(9){left:78%;top:18%;width:6px;height:6px;animation-duration:11s;animation-delay:3.5s}.courses-hero-particles span:nth-child(10){left:48%;top:45%;width:8px;height:8px;animation-duration:10s;animation-delay:0s}.courses-hero-particles span:nth-child(11){left:92%;top:70%;width:5px;height:5px;animation-duration:12s;animation-delay:4s}.courses-hero-particles span:nth-child(12){left:60%;top:88%;width:7px;height:7px;animation-duration:8s;animation-delay:1.2s}@keyframes coursesParticleDrift{0%{transform:translateY(0) translateX(0) scale(1);opacity:0}10%{opacity:.9}50%{opacity:1}85%{opacity:.7}100%{transform:translateY(-180px) translateX(60px) scale(.2);opacity:0}}@keyframes coursesOrbFloat{0%,100%{transform:translate(0,0) scale(1);opacity:.6}25%{transform:translate(-25px,20px) scale(1.08);opacity:.9}50%{transform:translate(15px,-15px) scale(1.15);opacity:.7}75%{transform:translate(-15px,-25px) scale(1.05);opacity:1}}.courses-hero-container{position:relative;z-index:5}.courses-hero-badge{display:inline-flex;align-items:center;gap:.6rem;padding:.55rem 1.4rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:50px;color:#fff;font-size:.85rem;font-weight:600;margin-bottom:2rem;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:coursesFadeUp .7s cubic-bezier(.22,1,.36,1) backwards;letter-spacing:.02em}.courses-hero-badge i{font-size:.9rem;opacity:.85}.courses-hero-title{font-family:'Cairo','Inter','Segoe UI',system-ui,sans-serif;font-size:clamp(2.2rem,5.5vw,3.75rem);font-weight:800;color:#fff;margin-bottom:1.25rem;text-shadow:0 4px 30px rgba(0,0,0,.25);animation:coursesFadeUp .7s cubic-bezier(.22,1,.36,1) .1s backwards;line-height:1.15;letter-spacing:-.02em}.courses-hero-subtitle{font-size:1.15rem;color:rgba(255,255,255,.75);max-width:620px;margin:0 auto 3rem;line-height:1.8;animation:coursesFadeUp .7s cubic-bezier(.22,1,.36,1) .2s backwards}@keyframes coursesFadeUp{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}.courses-hero-title span{position:relative;color:#fff}.courses-hero-title span::after{content:'';position:absolute;bottom:2px;left:0;right:0;height:4px;background:rgba(255,255,255,.3);border-radius:2px;transform:scaleX(0);transform-origin:left;animation:coursesUnderlineReveal .6s cubic-bezier(.22,1,.36,1) .8s forwards}@keyframes coursesUnderlineReveal{to{transform:scaleX(1)}}.courses-stats{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.stat-item{text-align:center;padding:.75rem 1.5rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:100px;backdrop-filter:blur(10px);transition:all .3s ease;display:flex;align-items:center;gap:.5rem}.stat-item:hover{background:rgba(255,255,255,.15);transform:translateY(-3px)}.stat-value{display:inline;font-size:1.4rem;font-weight:800;color:#fff}.stat-label{font-size:.8rem;color:rgba(255,255,255,.8);font-weight:500}.courses-filters-section{background:#fff;padding:1.5rem 0;border-bottom:1px solid #e5e7eb;position:sticky;top:60px;z-index:100;box-shadow:0 4px 15px rgba(0,0,0,.05)}.filters-form{width:100%}.filters-bar{display:flex;align-items:flex-end;gap:1rem;flex-wrap:wrap}.filter-group{flex:1;min-width:150px}.filter-group.filter-search{flex:2;min-width:250px}.filter-group.filter-actions{flex:0 0 auto;display:flex;gap:.5rem}.filter-label{display:block;font-size:.8rem;font-weight:600;color:#6b7280;margin-bottom:.5rem}.search-input-wrapper{position:relative}.search-icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:#9ca3af;font-size:.9rem}.filter-input{width:100%;padding:.75rem 2.75rem .75rem 1rem;border:2px solid #e5e7eb;border-radius:10px;font-size:.9rem;transition:all .3s;background:#f9fafb}.filter-input:focus{outline:0;border-color:#157eee;background:#fff;box-shadow:0 0 0 3px rgba(21,126,238,.1)}.filter-input::placeholder{color:#9ca3af}.filter-select-wrapper{position:relative}.filter-select{width:100%;padding:.75rem 2.5rem .75rem 1rem;border:2px solid #e5e7eb;border-radius:10px;font-size:.9rem;transition:all .3s;background:#f9fafb;appearance:none;cursor:pointer}.filter-select:focus{outline:0;border-color:#157eee;background:#fff;box-shadow:0 0 0 3px rgba(21,126,238,.1)}.select-arrow{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#9ca3af;font-size:.75rem;pointer-events:none}.filter-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:linear-gradient(135deg,#22c55e 0%,#16a34a 100%);color:#fff;border:0;border-radius:10px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s;white-space:nowrap}.filter-btn:hover{background:linear-gradient(135deg,#16a34a 0%,#15803d 100%);transform:translateY(-2px);box-shadow:0 4px 12px rgba(34,197,94,.3)}.filter-reset-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#f3f4f6;color:#6b7280;border:0;border-radius:10px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s;text-decoration:none}.filter-reset-btn:hover{background:#e5e7eb;color:#374151}.courses-content-section{padding:2rem 0 4rem;background:#f9fafb;min-height:60vh}.courses-results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.results-info{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.results-count{font-size:1.125rem;font-weight:700;color:#1f2937}.active-filter{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:rgba(21,126,238,.1);color:#157eee;border-radius:20px;font-size:.8rem;font-weight:500}.active-filter .remove-filter{margin-right:.25rem;color:#6b7280;transition:color .2s}.active-filter .remove-filter:hover{color:#ef4444}.view-options{display:flex;gap:.5rem}.view-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e5e7eb;border-radius:8px;color:#6b7280;cursor:pointer;transition:all .2s}.view-btn:hover,.view-btn.active{background:#157eee;border-color:#157eee;color:#fff}.courses-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.courses-grid.list-view{grid-template-columns:1fr}.courses-grid.list-view .course-card{display:grid;grid-template-columns:280px 1fr auto;gap:0}.courses-grid.list-view .course-card-image{border-radius:16px 0 0 16px}.courses-grid.list-view .course-card-body{display:flex;flex-direction:column;justify-content:center}.courses-grid.list-view .course-card-footer{flex-direction:column;justify-content:center;border-top:0;padding:1.5rem;gap:1rem}.course-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.08);transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.course-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,.15)}.course-card-image{position:relative;height:200px;overflow:hidden}.course-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.course-card:hover .course-card-image img{transform:scale(1.1)}.course-badges{position:absolute;top:1rem;right:1rem;display:flex;flex-direction:column;gap:.5rem}.badge{padding:.4rem .75rem;border-radius:20px;font-size:.75rem;font-weight:600}.badge-featured{background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%);color:#fff}.badge-discount{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);color:#fff}.course-overlay{position:absolute;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.course-card:hover .course-overlay{opacity:1}.overlay-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#fff;color:#1f2937;border-radius:30px;font-weight:600;font-size:.875rem;text-decoration:none;transform:translateY(20px);transition:all .3s}.course-card:hover .overlay-btn{transform:translateY(0)}.overlay-btn:hover{background:#157eee;color:#fff}.course-level{position:absolute;bottom:1rem;left:1rem}.level-badge{padding:.35rem .75rem;border-radius:6px;font-size:.7rem;font-weight:600;text-transform:uppercase}.level-beginner{background:rgba(34,197,94,.9);color:#fff}.level-intermediate{background:rgba(21,126,238,.9);color:#fff}.level-advanced{background:rgba(139,92,246,.9);color:#fff}.course-card-body{padding:1.25rem}.course-category-tag{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .75rem;background:rgba(21,126,238,.1);color:#157eee;border-radius:20px;font-size:.75rem;font-weight:500;margin-bottom:.75rem}.course-title{font-size:1.1rem;font-weight:700;color:#1f2937;margin-bottom:.5rem;line-height:1.4}.course-title a{color:inherit;text-decoration:none;transition:color .2s}.course-title a:hover{color:#157eee}.course-excerpt{font-size:.875rem;color:#6b7280;line-height:1.6;margin-bottom:1rem;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.course-meta-info{display:flex;flex-wrap:wrap;gap:1rem}.meta-item{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:#6b7280}.meta-item i{color:#9ca3af}.meta-item.rating i{color:#f59e0b}.rating-count{color:#9ca3af;font-size:.75rem}.course-card-footer{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-top:1px solid #f3f4f6;background:#fafafa}.instructor-info{display:flex;align-items:center;gap:.6rem}.instructor-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid #e5e7eb}.instructor-name{font-size:.85rem;font-weight:500;color:#374151}.course-price-tag{display:flex;align-items:center;gap:.5rem}.old-price{font-size:.85rem;color:#9ca3af;text-decoration:line-through}.current-price{font-size:1.1rem;font-weight:700;color:#157eee}.free-price{padding:.35rem .75rem;background:linear-gradient(135deg,#22c55e 0%,#16a34a 100%);color:#fff;border-radius:20px;font-size:.85rem;font-weight:600}.request-price{display:none}.course-price-tag:empty{display:none}.course-card-footer:has(.course-price-tag:empty){justify-content:center}.course-details-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1.5rem;background:linear-gradient(135deg,#157eee 0%,#0d5bb8 100%);color:#fff;border-radius:10px;font-size:.88rem;font-weight:600;text-decoration:none;letter-spacing:.2px;box-shadow:0 3px 12px rgba(21,126,238,.25);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.course-details-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,transparent 50%);opacity:0;transition:opacity .3s ease}.course-details-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(21,126,238,.35);color:#fff}.course-details-btn:hover::before{opacity:1}.course-details-btn i{font-size:.8rem;transition:transform .3s ease}.course-details-btn:hover i{transform:translateX(-4px)}.pagination-wrapper{margin-top:3rem;display:flex;justify-content:center}.pagination{display:flex;align-items:center;gap:.5rem;list-style:none;padding:0;margin:0}.page-link{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 .75rem;background:#fff;color:#374151;border:1px solid #e5e7eb;border-radius:10px;font-size:.9rem;font-weight:500;text-decoration:none;transition:all .2s}.page-link:hover{background:#f3f4f6;border-color:#d1d5db}.page-link.active{background:linear-gradient(135deg,#157eee 0%,#0d5bb8 100%);color:#fff;border-color:transparent}.page-link.prev,.page-link.next{gap:.4rem}.empty-state-card{text-align:center;padding:4rem 2rem;background:#fff;border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,.05)}.empty-icon{width:80px;height:80px;margin:0 auto 1.5rem;background:#f3f4f6;border-radius:50%;display:flex;align-items:center;justify-content:center}.empty-icon i{font-size:2rem;color:#9ca3af}.empty-state-card h3{font-size:1.5rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}.empty-state-card p{color:#6b7280;margin-bottom:1.5rem}.btn-reset-search{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.5rem;background:linear-gradient(135deg,#157eee 0%,#0d5bb8 100%);color:#fff;border-radius:10px;font-weight:600;text-decoration:none;transition:all .3s}.btn-reset-search:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(21,126,238,.3)}@media(max-width:1024px){.courses-grid{grid-template-columns:repeat(2,1fr)}.filters-bar{flex-wrap:wrap}.filter-group{flex:1 1 calc(50% - .5rem);min-width:150px}.filter-group.filter-search{flex:1 1 100%;order:-1}.filter-group.filter-actions{flex:1 1 100%;justify-content:center;margin-top:.5rem}}@media(max-width:768px){.courses-hero{padding:5rem 0 3rem}.courses-hero-title{font-size:1.75rem}.courses-stats{gap:2rem}.stat-value{font-size:1.5rem}.courses-filters-section{position:relative;top:0}.filter-group{flex:1 1 calc(50% - .5rem)}.courses-grid{grid-template-columns:1fr}.courses-grid.list-view .course-card{grid-template-columns:1fr}.courses-grid.list-view .course-card-image{border-radius:16px 16px 0 0}.courses-results-header{flex-direction:column;align-items:flex-start}.view-options{display:none}}@media(max-width:480px){.courses-hero{padding:4rem 0 2rem}.courses-hero-title{font-size:1.5rem}.courses-hero-subtitle{font-size:.9rem}.courses-stats{flex-direction:row;justify-content:center;gap:.5rem}.stat-item{flex:1;padding:.75rem .5rem;min-width:0}.stat-value{font-size:1.25rem}.stat-label{font-size:.7rem}.courses-filters-section{padding:1rem 0}.filter-group{flex:1 1 100%}.filter-btn{width:100%;justify-content:center}.filter-reset-btn{flex:1;justify-content:center}.course-card-image{height:180px}.course-card-footer{flex-direction:column;gap:1rem;align-items:stretch}.course-details-btn{width:100%;justify-content:center;padding:.85rem 1.5rem;border-radius:12px;font-size:.95rem;font-weight:700}.pagination{flex-wrap:wrap;justify-content:center}.page-link{min-width:36px;height:36px;font-size:.8rem}.page-link.prev span,.page-link.next span{display:none}}