.tutorials-section{position:relative;background:#000;padding:3rem 1rem;overflow:hidden}.tutorials-container{max-width:1100px;margin:0 auto;position:relative;z-index:1}.tutorials-header{text-align:center;margin-bottom:2rem;display:flex;flex-direction:column;align-items:center;gap:.75rem}.tutorials-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#64c8ff14;border:1px solid rgba(100,200,255,.22);border-radius:50px;color:#64c8fff2;font-size:.8rem;font-weight:600;font-family:var(--noqte-font);letter-spacing:.05em;direction:rtl}.tutorials-badge-dot{width:6px;height:6px;border-radius:50%;background:#64c8fff2;animation:tutorialsBadgePulse 2s ease-in-out infinite}@keyframes tutorialsBadgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.6)}}.tutorials-title{font-size:clamp(1.5rem,4vw,2rem);font-weight:700;color:#fffffff2;line-height:1.3;margin:0;font-family:var(--noqte-font);direction:rtl;text-align:center}.tutorials-title-accent{background:linear-gradient(135deg,#64c8fff2,#007eff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tutorials-subtitle{font-size:.95rem;color:#ffffff8c;max-width:540px;margin:0;line-height:1.7;font-family:var(--noqte-font);direction:rtl;text-align:center}.tutorials-hero{margin:0 auto 2rem;max-width:880px}.tutorials-hero-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;direction:rtl}.tutorials-hero-title{font-size:1.05rem;font-weight:600;color:#ffffffeb;margin:0;font-family:var(--noqte-font);line-height:1.5;flex:1}.tutorials-hero-duration{flex-shrink:0;font-size:.85rem;color:#ffffff8c;font-family:var(--noqte-font);background:#ffffff0f;border:1px solid rgba(255,255,255,.08);padding:.3rem .7rem;border-radius:999px}.tutorials-poster,.tutorials-frame{position:relative;display:block;width:100%;padding:0;border:0;background:#0a0a0a;border-radius:18px;overflow:hidden;aspect-ratio:16 / 9;cursor:pointer;box-shadow:0 10px 40px #00000073}.tutorials-frame{cursor:default}.tutorials-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.tutorials-poster:hover img{transform:scale(1.04)}.tutorials-poster-overlay{position:absolute;inset:0;background:linear-gradient(180deg,#00000026,#0000008c);pointer-events:none}.tutorials-play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:72px;height:72px;border-radius:50%;background:#fffffff2;color:#0a0a0a;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 28px #64c8ff59,0 2px 8px #0006;transition:transform .2s ease,background .2s ease}.tutorials-play-button svg{width:38px;height:38px}.tutorials-poster:hover .tutorials-play-button,.tutorials-poster:focus-visible .tutorials-play-button{transform:translate(-50%,-50%) scale(1.08);background:#fff}.tutorials-poster:focus-visible{outline:2px solid rgba(100,200,255,.85);outline-offset:3px}.tutorials-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.tutorials-grid{display:grid;grid-template-columns:1fr;gap:1.25rem;margin-bottom:1.75rem}.tutorials-card{display:flex;flex-direction:column;gap:.75rem}.tutorials-card .tutorials-play-button{width:56px;height:56px}.tutorials-card .tutorials-play-button svg{width:28px;height:28px}.tutorials-card-body{display:flex;align-items:center;justify-content:space-between;gap:.75rem;direction:rtl;padding:0 .25rem}.tutorials-card-title{font-size:.92rem;font-weight:500;color:#ffffffd9;margin:0;font-family:var(--noqte-font);line-height:1.5;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tutorials-card-duration{flex-shrink:0;font-size:.75rem;color:#ffffff80;font-family:var(--noqte-font)}.tutorials-footer{display:flex;justify-content:center}.tutorials-cta-link{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:999px;color:#ffffffe6;font-size:.95rem;font-weight:600;font-family:var(--noqte-font);text-decoration:none;transition:background .2s ease,border-color .2s ease,transform .2s ease;direction:rtl}.tutorials-cta-link:hover{background:#64c8ff1a;border-color:#64c8ff4d;transform:translateY(-1px)}.tutorials-cta-icon{font-size:1.1rem!important;transform:scaleX(-1)}@media (min-width: 768px){.tutorials-section{padding:4rem 2rem}.tutorials-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem}.tutorials-play-button{width:84px;height:84px}.tutorials-play-button svg{width:44px;height:44px}.tutorials-hero-title{font-size:1.15rem}.tutorials-card-title{font-size:.95rem}}@media (min-width: 1024px){.tutorials-section{padding:4.5rem 2rem}}@media (prefers-reduced-motion: reduce){.tutorials-badge-dot,.tutorials-poster img,.tutorials-play-button,.tutorials-cta-link{animation:none;transition:none}}
