:root{--purple-primary:#6b46c1;--purple-dark:#553c9a;--purple-light:#e9d8fd;--purple-50:#faf5ff;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--white:#fff;--star-gold:#f59e0b}.demo-hero{text-align:center;max-width:900px;margin:0 auto;padding:64px 24px 48px}.demo-eyebrow{background:var(--purple-50);color:var(--purple-primary);letter-spacing:.5px;text-transform:uppercase;border-radius:100px;margin-bottom:20px;padding:6px 16px;font-size:13px;font-weight:600;display:inline-block}.demo-hero h1{color:var(--gray-900);letter-spacing:-1px;margin-bottom:16px;font-size:48px;font-weight:800;line-height:1.15}.demo-hero p{color:var(--gray-600);max-width:600px;margin:0 auto 32px;font-size:20px;line-height:1.5}.demo-hero-ctas{flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:48px;display:flex}.demo-btn-primary{background:var(--purple-primary);color:var(--white);border-radius:10px;align-items:center;gap:8px;padding:14px 32px;font-size:16px;font-weight:600;text-decoration:none;transition:background .2s,transform .15s;display:inline-flex}.demo-btn-primary:hover{background:var(--purple-dark);transform:translateY(-1px)}.demo-btn-secondary{background:var(--white);color:var(--gray-700);border:2px solid var(--gray-200);border-radius:10px;align-items:center;gap:8px;padding:14px 32px;font-size:16px;font-weight:600;text-decoration:none;transition:border-color .2s,transform .15s;display:inline-flex}.demo-btn-secondary:hover{border-color:var(--purple-primary);color:var(--purple-primary);transform:translateY(-1px)}.demo-video-chapters-layout{align-items:flex-start;gap:24px;max-width:1280px;margin:0 auto;padding:0 24px;display:flex}.demo-video-column{flex:1;min-width:0}.demo-video-wrapper{background:var(--gray-900);border-radius:16px;width:100%;position:relative;overflow:hidden;box-shadow:0 25px 60px #6b46c126,0 4px 20px #00000014}.demo-video-wrapper video{aspect-ratio:16/9;background:#000;width:100%;display:block}.demo-video-meta{text-align:center;color:var(--gray-500);justify-content:center;align-items:center;gap:8px;margin-top:16px;font-size:14px;display:flex}.demo-video-meta span{align-items:center;gap:4px;display:flex}.demo-meta-dot{background:var(--gray-300);border-radius:50%;width:4px;height:4px}.demo-chapters-sidebar{border:1px solid var(--gray-200);background:var(--white);border-radius:14px;flex-shrink:0;width:320px;max-height:580px;overflow-y:auto}.demo-chapters-sidebar::-webkit-scrollbar{width:6px}.demo-chapters-sidebar::-webkit-scrollbar-track{background:0 0}.demo-chapters-sidebar::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}.demo-chapters-sidebar-header{border-bottom:1px solid var(--gray-200);background:var(--white);z-index:2;border-radius:14px 14px 0 0;padding:16px 20px;position:sticky;top:0}.demo-chapters-sidebar-header h2{color:var(--gray-900);font-size:15px;font-weight:700}.demo-chapters-sidebar-header p{color:var(--gray-500);margin-top:2px;font-size:12px}.demo-chapter-group{border-bottom:1px solid var(--gray-100)}.demo-chapter-group:last-child{border-bottom:none}.demo-chapter-group.highlighted{background:linear-gradient(135deg,#fffbeb 0%,var(--white)100%)}.demo-chapter-group-header{align-items:center;gap:8px;padding:12px 20px 8px;display:flex}.demo-chapter-group-icon{background:var(--purple-50);border-radius:6px;justify-content:center;align-items:center;width:24px;height:24px;font-size:13px;display:flex}.demo-chapter-group.highlighted .demo-chapter-group-icon{background:#fef3c7}.demo-chapter-group-header h3{text-transform:uppercase;letter-spacing:.8px;color:var(--gray-500);font-size:11px;font-weight:700}.demo-chapter-group.highlighted .demo-chapter-group-header h3{color:#92400e}.demo-chapter-list{padding:0 8px 8px;list-style:none}.demo-chapter-item{cursor:pointer;color:inherit;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;padding:7px 10px;font-family:inherit;text-decoration:none;transition:background .15s;display:flex}.demo-chapter-item:hover{background:var(--gray-50)}.demo-chapter-item.active{background:var(--purple-50)}.demo-chapter-time{color:var(--purple-primary);background:var(--purple-50);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:center;border-radius:5px;min-width:42px;padding:2px 7px;font-size:11px;font-weight:600}.demo-chapter-group.highlighted .demo-chapter-time{color:#92400e;background:#fef3c7}.demo-chapter-item.active .demo-chapter-time{background:var(--purple-primary);color:var(--white)}.demo-chapter-label{color:var(--gray-700);font-size:13px;font-weight:500}.demo-qa-section{background:var(--gray-50);padding:80px 24px}.demo-qa-container{max-width:800px;margin:0 auto}.demo-section-header{text-align:center;margin-bottom:48px}.demo-section-header h2{color:var(--gray-900);letter-spacing:-.5px;margin-bottom:8px;font-size:32px;font-weight:700}.demo-section-header p{color:var(--gray-500);font-size:16px}.demo-qa-cards{flex-direction:column;gap:20px;display:flex}.demo-qa-card{background:var(--white);border:1px solid var(--gray-200);border-radius:14px;padding:28px 32px;transition:box-shadow .2s,transform .15s;position:relative}.demo-qa-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000000f}.demo-qa-question{color:var(--gray-900);align-items:flex-start;gap:12px;margin-bottom:12px;font-size:18px;font-weight:700;display:flex}.demo-qa-badge{background:var(--purple-primary);min-width:28px;height:28px;color:var(--white);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;margin-top:2px;font-size:13px;font-weight:700;display:flex}.demo-qa-answer{color:var(--gray-600);margin-bottom:16px;padding-left:40px;font-size:16px;line-height:1.6}.demo-qa-watch-link{color:var(--purple-primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding-left:40px;font-family:inherit;font-size:14px;font-weight:600;text-decoration:none;transition:gap .2s;display:inline-flex}.demo-qa-watch-link:hover{gap:10px}.demo-qa-watch-link svg{width:16px;height:16px}.demo-final-cta{text-align:center;background:linear-gradient(135deg,var(--purple-50)0%,#ede9fe 50%,var(--purple-50)100%);padding:96px 24px}.demo-final-cta h2{color:var(--gray-900);letter-spacing:-.5px;margin-bottom:16px;font-size:40px;font-weight:800}.demo-final-cta p{color:var(--gray-600);margin-bottom:8px;font-size:18px}.demo-final-cta .demo-cta-buttons{flex-wrap:wrap;justify-content:center;gap:16px;margin-top:36px;display:flex}.demo-btn-large{border-radius:12px;padding:16px 40px;font-size:17px}.demo-mobile-chapters-toggle,.demo-mobile-chapters-overlay,.demo-mobile-chapters-drawer{display:none}@media (max-width:1024px) and (min-width:769px){.demo-video-chapters-layout{flex-direction:column}.demo-chapters-sidebar{grid-template-columns:repeat(2,1fr);width:100%;max-height:none;display:grid;overflow:visible}.demo-chapters-sidebar-header{grid-column:1/-1;position:static}.demo-chapter-group{border-bottom:none;border-right:1px solid var(--gray-100)}.demo-chapter-group:nth-child(odd){border-right:1px solid var(--gray-100)}.demo-chapter-group:nth-child(2n){border-right:none}}@media (max-width:900px){.demo-hero h1{font-size:36px}.demo-final-cta h2{font-size:32px}}@media (max-width:768px){.demo-hero{padding:40px 20px 32px}.demo-hero h1{font-size:28px}.demo-hero p{font-size:17px}.demo-chapters-sidebar{display:none!important}.demo-video-chapters-layout{flex-direction:column}.demo-page-wrapper{padding-bottom:72px}.demo-mobile-chapters-toggle{z-index:200;background:var(--white);border-top:1px solid var(--gray-200);cursor:pointer;-webkit-tap-highlight-color:transparent;justify-content:space-between;align-items:center;padding:14px 20px;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 20px #00000014}.demo-mobile-toggle-left{align-items:center;gap:12px;display:flex}.demo-mobile-toggle-icon{background:var(--purple-50);border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.demo-mobile-toggle-icon svg{color:var(--purple-primary)}.demo-mobile-toggle-text{color:var(--gray-900);font-size:15px;font-weight:600}.demo-mobile-toggle-sub{color:var(--gray-500);font-size:12px;font-weight:400}.demo-mobile-toggle-chevron{color:var(--gray-400);transition:transform .3s}.demo-mobile-chapters-toggle.open .demo-mobile-toggle-chevron{transform:rotate(180deg)}.demo-mobile-chapters-overlay{z-index:199;opacity:0;pointer-events:none;background:#0006;transition:opacity .3s;display:block;position:fixed;inset:0}.demo-mobile-chapters-overlay.visible{opacity:1;pointer-events:auto}.demo-mobile-chapters-drawer{z-index:201;background:var(--white);border-radius:20px 20px 0 0;flex-direction:column;max-height:70vh;transition:transform .35s cubic-bezier(.32,.72,0,1);display:flex;position:fixed;bottom:0;left:0;right:0;overflow:hidden;transform:translateY(100%);box-shadow:0 -8px 40px #00000026}.demo-mobile-chapters-drawer.open{transform:translateY(0)}.demo-mobile-drawer-handle{flex-shrink:0;justify-content:center;padding:12px 0 4px;display:flex}.demo-mobile-drawer-handle span{background:var(--gray-300);border-radius:2px;width:36px;height:4px;display:block}.demo-mobile-drawer-header{border-bottom:1px solid var(--gray-200);flex-shrink:0;justify-content:space-between;align-items:center;padding:8px 20px 12px;display:flex}.demo-mobile-drawer-header h2{color:var(--gray-900);font-size:17px;font-weight:700}.demo-mobile-drawer-close{background:var(--gray-100);width:32px;height:32px;color:var(--gray-600);cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;font-size:18px;display:flex}.demo-mobile-drawer-body{-webkit-overflow-scrolling:touch;flex:1;padding-bottom:20px;overflow-y:auto}.demo-qa-card{padding:20px}.demo-qa-question{font-size:16px}.demo-qa-answer{margin-top:8px;padding-left:0}.demo-qa-watch-link{padding-left:0}.demo-final-cta{padding:64px 20px}.demo-final-cta h2{font-size:26px}.demo-btn-primary,.demo-btn-secondary{justify-content:center;width:100%;padding:12px 24px;font-size:15px}.demo-btn-large{padding:14px 32px}}