@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;800;900&display=swap');
.cde-sv-demo{--ink:#1E2B33;--muted:#66756C;--line:#E2E8E0;--heart:#E5484D;--shadow-soft:0 10px 30px rgba(20,38,28,.08);--shadow-lift:0 20px 45px rgba(20,38,28,.16);font-family:'Cairo',sans-serif;background:var(--bg);color:var(--ink);line-height:1.6;overflow:hidden;min-height:100vh;transition:background .4s ease,color .4s ease}.cde-sv-demo *{box-sizing:border-box}.cde-sv-demo a,.cde-sv-demo button{cursor:pointer}.cde-sv-demo a{text-decoration:none}.cde-sv-demo h1,.cde-sv-demo h2,.cde-sv-demo h3{color:var(--ink);font-weight:900;text-wrap:balance}.cde-sv-demo.dark{--bg:#121212;--surface:#1B1F1C;--surface-2:#20261F;--ink:#F2F4F0;--muted:#A7B3A9;--line:#2A332C;--card-green:#1D2A22;--sage-100:#17211B;--sage-200:#CFE3D2;--shadow-soft:0 10px 30px rgba(0,0,0,.45);--shadow-lift:0 20px 45px rgba(0,0,0,.6);--wave-1:#161D18;--wave-2:#1E2C24;--wave-3:#173527}.cde-sv-demo .navbar{position:sticky;top:0;width:100%;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:1000;padding:16px 0;border-bottom:1px solid var(--line);transition:all .3s ease}.cde-sv-demo .nav-container{max-width:1400px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;gap:20px}.cde-sv-demo .logo{background:#23282E;color:var(--gold);font-size:20px;font-weight:900;padding:10px 20px;border-radius:10px;display:inline-flex;align-items:center;gap:10px;box-shadow:0 3px 0 #0B0D0F;transition:all .3s ease;min-width:0}.cde-sv-demo .logo img{width:34px;height:34px;object-fit:cover;border-radius:8px;background:#fff}.cde-sv-demo .logo i{color:var(--gold);font-size:22px}.cde-sv-demo .logo:hover{transform:translateY(-3px)}.cde-sv-demo .nav-links{display:flex;gap:28px;list-style:none;align-items:center;margin:0;padding:0}.cde-sv-demo .nav-links a{color:var(--ink);font-weight:800;font-size:16px;position:relative;padding:8px 0;transition:all .3s ease}.cde-sv-demo .nav-links a:after{content:'';position:absolute;bottom:-6px;right:0;width:0;height:3px;border-radius:3px;background:var(--green-600);transition:width .3s ease}.cde-sv-demo .nav-links a:hover{color:var(--green-600)}.cde-sv-demo .nav-links a:hover:after{width:100%}.cde-sv-demo .theme-toggle{background:var(--sage-200);color:var(--green-800);border:0;width:58px;height:32px;border-radius:40px;position:relative;flex-shrink:0;transition:all .3s ease;box-shadow:inset 0 2px 4px rgba(20,38,28,.15)}.cde-sv-demo .theme-toggle i{position:absolute;top:50%;transform:translateY(-50%);right:5px;width:24px;height:24px;background:var(--surface);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--green-700);transition:all .3s ease}.cde-sv-demo.dark .theme-toggle i{right:calc(100% - 29px);color:var(--gold)}
/* First-load device montage */.cde-sv-demo .cde-device-intro{position:fixed;inset:0;background:var(--green-900);z-index:5000;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#fff;;pointer-events:none}.cde-sv-demo.intro-done .cde-device-intro{display:none}.device-scene{position:relative;width:min(820px,90vw);height:330px;display:flex;align-items:flex-end;justify-content:center;gap:26px;transform:translateY(12px);}.device{position:relative;background:#111;border:3px solid #303936;box-shadow:0 25px 70px rgba(0,0,0,.35);overflow:hidden}.device-screen{background:linear-gradient(145deg,#f8faf6,#dfece2);color:#173326;position:absolute;inset:7px;overflow:hidden;padding:15px}.device-screen b{display:block;font-size:13px;font-weight:900}.device-screen span{display:block;font-size:8px;opacity:.7;margin-top:2px}.device-screen em{display:block;height:30px;border-radius:8px;background:#2f6b4f;margin-top:12px}.device-screen em+em{height:14px;background:#dcebdd;margin-top:7px}.device-phone{width:116px;height:236px;border-radius:24px;}.device-phone .device-screen{border-radius:17px}.device-phone i{position:absolute;top:7px;left:50%;transform:translateX(-50%);font-size:8px;color:#d9a441}.device-tablet{width:260px;height:195px;border-radius:17px;}.device-tablet .device-screen{border-radius:10px}.mini-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.mini-cards i{height:50px;border-radius:7px;background:#fff;border:1px solid #d4dfd6}.device-laptop{width:410px;height:250px;border-radius:13px 13px 4px 4px;}.device-laptop .device-screen{border-radius:7px}.mini-nav{height:10px;background:#23282e;border-radius:3px;margin-bottom:10px}.mini-hero{height:85px;border-radius:10px;background:linear-gradient(135deg,#173b2b,#3e7a5a)}.mini-course{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:9px}.mini-course i{height:44px;background:#fff;border:1px solid #dfe7e0;border-radius:7px}.laptop-base{position:absolute;left:-22px;right:-22px;bottom:-17px;height:17px;background:#3a423f;border-radius:0 0 12px 12px}.device-message{text-align:center;margin-top:28px;}.device-message small{letter-spacing:3px;color:#d9a441;font-weight:900;font-size:10px}.device-message h2{color:#fff;font-size:clamp(24px,4vw,42px);margin:5px 0}.device-message p{color:#c7d5ce;margin:0;font-weight:700}.cde-sv-demo .intro-done .cde-device-intro{display:none}/* Landing structure is intentionally based on the supplied SV.html */.cde-sv-demo .hero{min-height:105vh;background:var(--bg);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:150px 20px 220px;transition:background .4s ease}.cde-sv-demo .hero:before{content:'';position:absolute;top:-180px;left:-180px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--sage-200) 55%,transparent),transparent 70%);pointer-events:none}.cde-sv-demo .hero-inner{display:flex;align-items:center;justify-content:center;gap:56px;flex-wrap:wrap;max-width:1300px;margin:0 auto;position:relative;z-index:2}.cde-sv-demo .hero-content{text-align:center;flex:1 1 460px;animation:fadeInUp .9s ease both}.cde-sv-demo .hero-badge{display:inline-flex;align-items:center;gap:10px;background:var(--sage-200);color:var(--green-800);padding:10px 32px;border-radius:60px;font-weight:800;font-size:17px;margin-bottom:30px;box-shadow:0 3px 0 var(--sage-300)}.cde-sv-demo.dark .hero-badge{box-shadow:0 3px 0 var(--green-700)}.cde-sv-demo .hero h1{font-size:clamp(40px,6vw,66px);line-height:1.25;margin:0 0 24px}.cde-sv-demo .hero h1 span{color:var(--gold);display:inline-block}.cde-sv-demo .hero p{font-size:clamp(17px,2.4vw,21px);color:var(--muted);margin-bottom:40px;line-height:2}.cde-sv-demo .hero-btn{display:inline-flex;align-items:center;gap:12px;background:var(--sage-200);color:var(--green-900);padding:16px 46px;border-radius:14px;font-size:20px;font-weight:900;box-shadow:0 4px 0 var(--green-800);transition:all .3s ease}.cde-sv-demo .hero-btn:hover{transform:translateY(-5px);box-shadow:0 7px 0 var(--green-800),var(--shadow-lift)}.cde-sv-demo .hero-poster{flex:1 1 420px;max-width:580px;position:relative;animation:fadeInUp .9s .15s ease both}.cde-sv-demo .hero-poster:before{content:'';position:absolute;inset:-8% -6%;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--gold) 16%,transparent),transparent 68%);border-radius:50%;pointer-events:none}.hero-poster-frame{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-soft);background:var(--surface);min-height:330px;display:flex;align-items:center;justify-content:center}.hero-poster img{position:relative;width:100%;height:100%;max-height:520px;object-fit:contain;display:block}.hero-css{width:100%;height:380px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 22% 18%,color-mix(in srgb,var(--gold) 20%,transparent),transparent 46%),linear-gradient(135deg,var(--green-700),var(--green-900));color:var(--gold);position:relative}.hero-css i{font-size:72px}.hero-css b{font-size:28px;margin-top:12px}.hero-css small{color:#d8e5dd;margin-top:3px}.cde-sv-demo .hero-wave{position:absolute;bottom:-2px;right:0;left:0;width:100%;height:190px;display:block;pointer-events:none}.cde-sv-demo .hero-wave .w1{fill:var(--wave-1)}.cde-sv-demo .hero-wave .w2{fill:var(--wave-2)}.cde-sv-demo .hero-wave .w3{fill:var(--wave-3)}@keyframes fadeInUp{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}
/* Stats / sections */.cde-sv-demo .stats{background:var(--surface);padding:90px 20px}.cde-sv-demo .stats-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:28px}.cde-sv-demo .stat-item{text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:38px 22px;box-shadow:var(--shadow-soft);transition:all .3s ease}.cde-sv-demo .stat-item:hover{transform:translateY(-10px);box-shadow:var(--shadow-lift);border-color:var(--sage-300)}.cde-sv-demo .stat-number{display:block;font-size:clamp(44px,5vw,58px);font-weight:900;color:var(--green-700);line-height:1.1}.cde-sv-demo.dark .stat-number{color:var(--sage-300)}.cde-sv-demo .stat-item:after{content:'';display:block;width:56px;height:4px;border-radius:4px;background:var(--gold);margin:14px auto 12px}.cde-sv-demo .stat-label{font-size:18px;font-weight:800;color:var(--muted)}.cde-sv-demo .section-header{text-align:center;margin-bottom:70px}.cde-sv-demo .section-header h2{font-size:clamp(32px,5vw,46px);margin:0}.cde-sv-demo .section-header h2 span{color:var(--green-600)}.cde-sv-demo.dark .section-header h2 span{color:var(--sage-300)}.cde-sv-demo .section-header .line{width:110px;height:5px;border-radius:5px;background:var(--green-600);margin:20px auto 18px;position:relative}.cde-sv-demo .section-header .line:after{content:'';position:absolute;top:0;right:-22px;width:12px;height:5px;border-radius:5px;background:var(--gold)}.cde-sv-demo .section-header p{font-size:19px;color:var(--muted);max-width:680px;margin:0 auto}
/* Exact course-card geometry from SV.txt, with dynamic theme variables */.cde-sv-demo .courses{padding:110px 20px;max-width:1400px;margin:0 auto}.cde-sv-demo .courses-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:42px}.cde-sv-demo .course-card{background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-soft);position:relative;display:flex;flex-direction:column;transition:all .3s ease;overflow:visible}.cde-sv-demo .course-card:hover{transform:translateY(-12px);box-shadow:var(--shadow-lift);border-color:var(--sage-300)}.cde-sv-demo .course-image-wrapper{position:relative;overflow:hidden;height:260px;border-radius:24px 24px 0 0;background:var(--sage-100)}.cde-sv-demo .course-image{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;display:block}.cde-sv-demo .course-card:hover .course-image{transform:scale(1.08)}.cde-sv-demo .course-badge{position:absolute;top:14px;right:14px;z-index:2;background:#23282E;color:var(--gold);padding:6px 16px;border-radius:10px;font-size:12px;font-weight:800;display:inline-flex;align-items:center;gap:7px;box-shadow:0 3px 0 #0B0D0F}.cde-sv-demo .course-content{padding:0 24px 26px;display:flex;flex-direction:column;flex:1}.cde-sv-demo .course-title{order:1;background:var(--surface);margin:-48px auto 0;width:92%;position:relative;z-index:3;border-radius:14px;box-shadow:0 12px 28px rgba(20,38,28,.14);border:1px solid var(--line);padding:16px 18px 14px;text-align:center;font-size:24px;font-weight:900;color:var(--ink)}.cde-sv-demo .course-title:after{content:'';display:block;width:62%;height:3px;border-radius:3px;background:var(--green-600);margin:12px auto 0}.cde-sv-demo .course-category{order:2;align-self:center;margin-top:18px;background:var(--sage-100);color:var(--green-800);border:1px solid var(--sage-300);padding:6px 22px;border-radius:30px;font-size:14px;font-weight:800}.cde-sv-demo.dark .course-category{color:var(--sage-300)}.cde-sv-demo .course-desc{order:3;margin-top:16px;color:var(--muted);font-size:15.5px;line-height:1.9;text-align:center;min-height:88px}.cde-sv-demo .course-footer{order:4;margin-top:auto;padding-top:20px;border-top:2px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}.cde-sv-demo .course-teacher{display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px}.cde-sv-demo .teacher-avatar{width:46px;height:46px;border-radius:50%;background:var(--green-700);color:#fff;display:flex;align-items:center;justify-content:center;font-size:19px;box-shadow:0 3px 0 var(--green-900);overflow:hidden}.cde-sv-demo .teacher-avatar img{width:100%;height:100%;object-fit:cover}.cde-sv-demo .course-btn{background:var(--green-700);color:#fff;padding:12px 28px;border-radius:12px;font-weight:800;font-size:15px;display:inline-flex;align-items:center;gap:9px;box-shadow:0 4px 0 var(--green-800);transition:all .3s ease}.cde-sv-demo .course-btn:hover{transform:translateY(-4px);box-shadow:0 7px 0 var(--green-900),var(--shadow-lift)}.subject-course-visual{background:radial-gradient(circle at 22% 18%,color-mix(in srgb,var(--gold) 20%,transparent),transparent 46%),linear-gradient(135deg,var(--green-700),var(--green-900))}.subject-fallback{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--gold);position:relative}.subject-fallback:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 16px)}.subject-fallback i{font-size:48px;position:relative;z-index:1}.subject-fallback b{font-size:22px;position:relative;z-index:1;margin-top:10px}.subject-fallback small{font-size:13px;color:#d9e6df;position:relative;z-index:1;margin-top:2px}
/* Student interface visual — not a student simulator */.cde-sv-demo .student-preview{padding:110px 20px;background:var(--bg)}.cde-sv-demo .student-preview-inner{max-width:1200px;margin:0 auto}.student-browser{border:1px solid var(--line);background:var(--surface);border-radius:28px;box-shadow:var(--shadow-lift);overflow:hidden;max-width:1120px;margin:auto}.student-browser-top{height:48px;background:var(--surface-2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:7px;padding:0 16px;color:var(--muted)}.student-browser-top>span{width:8px;height:8px;border-radius:50%;background:var(--sage-300)}.student-browser-top b{margin:auto;font-size:11px}.student-browser-top em{font-size:8px;color:var(--green-600);font-style:normal;font-weight:900}.student-browser-body{display:grid;grid-template-columns:190px 1fr;min-height:430px;background:var(--surface-2)}.student-browser-body aside{background:var(--green-900);color:#d8e5dd;padding:24px 16px;display:flex;flex-direction:column;gap:9px}.student-browser-body aside strong{color:#fff;font-size:14px;margin-bottom:16px}.student-browser-body aside a{font-size:10px;color:#aebfb6;padding:9px 10px;border-radius:8px}.student-browser-body aside a.active{background:var(--green-700);color:#fff}.student-avatar{margin-top:auto;width:42px;height:42px;border-radius:50%;overflow:hidden;background:var(--green-700);display:grid;place-items:center;color:#fff}.student-avatar img{width:100%;height:100%;object-fit:cover}.student-main{padding:32px}.student-welcome{display:flex;justify-content:space-between;align-items:center}.student-welcome small{color:var(--muted);font-size:10px}.student-welcome h3{margin:3px 0;font-size:22px}.student-welcome>span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--sage-100);color:var(--green-700);font-size:11px;font-weight:900}.student-hero{margin-top:20px;padding:25px;border-radius:18px;background:linear-gradient(135deg,var(--green-900),var(--green-700));color:#fff;display:flex;justify-content:space-between;align-items:center;box-shadow:0 18px 35px rgba(20,38,28,.14)}.student-hero small{color:var(--sage-300);font-size:9px}.student-hero h4{margin:5px 0;font-size:19px;color:#fff}.student-hero p{margin:0;color:#d3e2da;font-size:9px}.student-hero button{margin-top:13px;border:0;border-radius:8px;background:var(--gold);color:var(--green-900);padding:8px 12px;font-size:9px;font-weight:900}.student-play{width:88px;height:88px;border-radius:20px;background:rgba(255,255,255,.1);display:grid;place-items:center;color:var(--gold);font-size:30px}.student-course-mini{display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;margin-top:14px}.student-course-mini>div{height:42px;border-radius:9px;background:linear-gradient(135deg,var(--gold),var(--green-700));display:grid;place-items:center;color:#fff}.student-course-mini b,.student-course-mini small{display:block}.student-course-mini b{font-size:11px}.student-course-mini small{font-size:8px;color:var(--muted);margin-top:3px}.student-course-mini>span{color:var(--green-600)}.student-note{text-align:center;color:var(--muted);font-size:13px;margin:18px auto 0;max-width:800px}
/* Features / teacher value / CTA / footer follow the supplied structure */.cde-sv-demo .features{padding:110px 20px;background:var(--bg)}.cde-sv-demo .features-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:30px}.cde-sv-demo .feature-item{background:var(--card-green);border:2px solid var(--green-600);border-radius:16px;padding:42px 26px;text-align:center;transition:all .3s ease}.cde-sv-demo .feature-item:hover{transform:translateY(-9px);box-shadow:var(--shadow-lift)}.cde-sv-demo .feature-icon{width:92px;height:92px;margin:0 auto 24px;background:var(--surface);border:2px dashed var(--green-700);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:34px;color:var(--green-700);transition:all .3s ease}.cde-sv-demo.dark .feature-icon{color:var(--sage-300);border-color:var(--sage-300)}.cde-sv-demo .feature-item:hover .feature-icon{transform:rotate(10deg) scale(1.08)}.cde-sv-demo .feature-item h3{font-size:22px;margin:0 0 12px}.cde-sv-demo .feature-item p{font-size:15px;color:var(--muted);line-height:1.9}.cde-sv-demo .teacher-value{padding:110px 20px;background:var(--surface)}.teacher-value-inner{max-width:1200px;margin:auto}.teacher-value-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.teacher-value-grid article{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px 20px;box-shadow:var(--shadow-soft);text-align:center}.teacher-value-grid i{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:0 auto 16px;background:var(--sage-100);color:var(--green-700);font-size:22px}.teacher-value-grid h3{font-size:19px;margin:0 0 9px}.teacher-value-grid p{font-size:13px;color:var(--muted);line-height:1.9;margin:0}.cde-sv-demo .cta{padding:60px 20px 120px;background:var(--bg)}.cde-sv-demo .cta-content{max-width:960px;margin:0 auto;background:var(--sage-200);border-radius:22px;padding:70px 34px;text-align:center;box-shadow:0 5px 0 var(--sage-300),var(--shadow-soft);position:relative;overflow:hidden}.cde-sv-demo.dark .cta-content{box-shadow:0 5px 0 var(--green-700),var(--shadow-soft)}.cde-sv-demo .cta-content:before{content:'\f004';font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;top:26px;right:30px;color:var(--heart);font-size:22px}.cde-sv-demo .cta h2{font-size:clamp(30px,4.5vw,44px);color:var(--green-900);margin:0 0 20px}.cde-sv-demo.dark .cta h2{color:#EAF4EC}.cde-sv-demo .cta p{font-size:clamp(16px,2.2vw,20px);color:var(--green-800);margin-bottom:42px;line-height:2}.cde-sv-demo.dark .cta p{color:var(--sage-300)}.cde-sv-demo .cta-btn{display:inline-flex;align-items:center;gap:12px;background:var(--gold);color:#23282E;padding:17px 52px;border-radius:14px;font-size:19px;font-weight:900;box-shadow:0 4px 0 var(--gold-600);transition:all .3s ease}.cde-sv-demo .cta-btn:hover{transform:translateY(-5px);box-shadow:0 7px 0 var(--gold-600),var(--shadow-lift)}.teacher-socials{margin-top:32px}.teacher-socials strong{display:block;color:var(--green-900);margin-bottom:12px}.teacher-socials>div{display:flex;justify-content:center;gap:12px}.teacher-socials a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#23282E;color:var(--gold);box-shadow:0 3px 0 #0B0D0F}.cde-sv-demo .footer{background:var(--green-900);border-radius:48px 48px 0 0;color:#fff;padding:70px 20px 45px;text-align:center}.cde-sv-demo .footer-card{background:var(--surface);color:var(--ink);max-width:640px;margin:0 auto 34px;border-radius:16px;padding:26px 30px;box-shadow:0 14px 34px rgba(0,0,0,.35);font-size:17px;font-weight:800}.cde-sv-demo.dark .footer-card{color:#EAF4EC}.cde-sv-demo .footer-card a{color:var(--green-700)}.cde-sv-demo.dark .footer-card a{color:var(--gold)}.cde-sv-demo .footer-love{color:#EAF4EC;font-size:16px;font-weight:700;margin-bottom:14px}.cde-sv-demo .footer-love i{color:var(--heart);margin:0 6px}.cde-sv-demo .footer-credit{color:var(--gold);font-weight:800;font-size:14px}
@media(max-width:1024px){.cde-sv-demo .hero{min-height:95vh;padding:140px 20px 200px}.cde-sv-demo .hero-inner{gap:36px}.cde-sv-demo .courses-grid{gap:32px}.teacher-value-grid{grid-template-columns:repeat(2,1fr)}.device-laptop{width:350px}.device-tablet{width:220px}}@media(max-width:768px){.cde-sv-demo .nav-links{display:none}.cde-sv-demo .nav-container{padding:0 15px}.cde-sv-demo .logo{font-size:16px;padding:8px 14px}.cde-sv-demo .hero{min-height:88vh;padding:130px 15px 180px}.cde-sv-demo .hero-poster{max-width:440px}.cde-sv-demo .stats{padding:60px 15px}.cde-sv-demo .courses,.cde-sv-demo .features,.cde-sv-demo .student-preview,.cde-sv-demo .teacher-value{padding:80px 15px}.cde-sv-demo .courses-grid{grid-template-columns:1fr}.cde-sv-demo .student-browser-body{grid-template-columns:1fr}.cde-sv-demo .student-browser-body aside{display:none}.cde-sv-demo .student-main{padding:20px}.cde-sv-demo .student-hero{flex-direction:row}.teacher-value-grid{grid-template-columns:1fr}.cde-sv-demo .cta{padding:40px 15px 90px}.cde-sv-demo .cta-content{padding:55px 22px}.cde-sv-demo .footer{border-radius:32px 32px 0 0}.device-scene{height:230px;gap:8px}.device-phone{width:78px;height:160px}.device-tablet{width:160px;height:120px}.device-laptop{width:230px;height:140px}.mini-hero{height:48px}.mini-course i{height:26px}.device-message{margin-top:18px}.device-message h2{font-size:24px}.device-message p{font-size:12px}.cde-sv-demo .hero h1{font-size:40px}}@media(max-width:480px){.cde-sv-demo .course-image-wrapper{height:230px}.cde-sv-demo .course-title{font-size:20px}.device-scene{transform:scale(.86) translateY(12px)}.device-phone{display:none}.device-tablet{width:150px}.device-laptop{width:220px}.cde-sv-demo .hero-badge{font-size:14px;padding:8px 22px}}@media(prefers-reduced-motion:reduce){.cde-sv-demo *,.cde-sv-demo *:before,.cde-sv-demo *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.cde-sv-demo .cde-device-intro{display:none!important}}

/* v7.3 — theme-safe dark modes + cinematic device intro */
.cde-sv-demo.dark[data-template="emerald"]{
 --bg:#121212;--surface:#1b1f1c;--surface-2:#20261f;--ink:#f2f4f0;--muted:#a7b3a9;--line:#2a332c;
 --card-green:#1d2a22;--sage-100:#17211b;--sage-200:#cfe3d2;--sage-300:#a9c7b1;--green-600:#3e7a5a;--wave-1:#161d18;--wave-2:#1e2c24;--wave-3:#173527;
}
.cde-sv-demo.dark[data-template="midnight"]{
 --bg:#0b1120;--surface:#121a2a;--surface-2:#182235;--ink:#f3f8ff;--muted:#a9b8ca;--line:#283750;
 --card-green:#172a38;--sage-100:#142735;--sage-200:#c7e6e2;--sage-300:#75bdb4;--green-600:#3fae9a;--wave-1:#0e1728;--wave-2:#14243a;--wave-3:#163c3c;
}
.cde-sv-demo.dark[data-template="royal"]{
 --bg:#100e24;--surface:#181532;--surface-2:#201c40;--ink:#f6f4ff;--muted:#b9b4d0;--line:#332d5a;
 --card-green:#211d42;--sage-100:#211d42;--sage-200:#ded9ff;--sage-300:#b8aef0;--green-600:#7767d8;--wave-1:#14112e;--wave-2:#1e1940;--wave-3:#282052;
}
.cde-sv-demo.dark[data-template="sunset"]{
 --bg:#1b1114;--surface:#26181b;--surface-2:#302024;--ink:#fff5f2;--muted:#c8aaa5;--line:#493035;
 --card-green:#342326;--sage-100:#2b1e21;--sage-200:#f0d1c7;--sage-300:#d99b86;--green-600:#bd5d65;--wave-1:#211417;--wave-2:#2e1b1f;--wave-3:#4b2027;
}
.cde-sv-demo.dark .navbar{background:color-mix(in srgb,var(--surface) 88%,transparent);border-color:var(--line)}
.cde-sv-demo.dark .stats,.cde-sv-demo.dark .stat-item,.cde-sv-demo.dark .student-browser,.cde-sv-demo.dark .teacher-value-grid article,.cde-sv-demo.dark .footer-card{background:var(--surface);border-color:var(--line)}
.cde-sv-demo.dark .features,.cde-sv-demo.dark .student-preview,.cde-sv-demo.dark .cta{background:var(--bg)}
.cde-sv-demo.dark .teacher-value{background:var(--surface-2)}
.cde-sv-demo.dark .feature-item{background:var(--card-green);border-color:var(--green-600)}
.cde-sv-demo.dark .course-content,.cde-sv-demo.dark .course-title{background:var(--surface)}
.cde-sv-demo.dark .course-category{background:var(--sage-100);color:var(--sage-300);border-color:var(--green-600)}
.cde-sv-demo.dark .course-footer{border-color:var(--line)}
.cde-sv-demo.dark .teacher-avatar{background:var(--green-600);box-shadow:0 3px 0 var(--green-900)}
.cde-sv-demo.dark .student-browser-top{background:var(--surface-2);border-color:var(--line)}
.cde-sv-demo.dark .student-browser-body{background:var(--surface-2)}
.cde-sv-demo.dark .student-course-mini{background:var(--surface);border-color:var(--line)}
.cde-sv-demo.dark .student-welcome>span{background:var(--sage-100);color:var(--sage-300)}
.cde-sv-demo.dark .cta-content{background:var(--sage-200)}
.cde-sv-demo.dark .cta h2{color:var(--green-900)}
.cde-sv-demo.dark .cta p,.cde-sv-demo.dark .teacher-socials strong{color:var(--green-800)}
.cde-sv-demo.dark .footer-card a{color:var(--gold)}

/* Intro is deliberately a sequence: laptop → tablet → phone → phone scroll → handoff. */
.cde-sv-demo .cde-device-intro{background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--green-700) 38%,transparent),transparent 48%),var(--green-900);}
.device-intro-kicker{position:absolute;top:10%;font-size:10px;letter-spacing:3px;color:var(--gold);font-weight:900;opacity:0;}
.device-scene{height:360px;width:min(1120px,94vw);gap:34px;align-items:flex-end}
.device{will-change:transform,opacity}
.device-laptop{width:500px;height:305px;order:1;}
.device-tablet{width:300px;height:220px;order:2;}
.device-phone{width:145px;height:286px;border-radius:28px;order:3;}
.device-screen{inset:8px;padding:12px}
.device-laptop .device-screen{padding:12px}
.mini-site{width:100%;height:100%;overflow:hidden;border-radius:6px;background:#f8faf8}
.mini-nav{height:24px;background:#23282e;color:#d9a441;display:flex;align-items:center;justify-content:space-between;padding:0 8px;font-size:7px}
.mini-nav span{color:#d7dfda;font-size:5px}
.mini-hero{height:92px;margin:7px;border-radius:9px;background:linear-gradient(135deg,var(--green-900),var(--green-700));color:#fff;padding:13px;display:flex;flex-direction:column;justify-content:center}
.mini-hero small{font-size:6px;color:var(--sage-300)}
.mini-hero b{font-size:14px;margin-top:4px}
.mini-course{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:8px}
.mini-course i{height:70px;border-radius:7px;background:#fff;border:1px solid #dfe7e0;box-shadow:0 4px 10px rgba(20,38,28,.07)}
.mini-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px}
.mini-cards i{height:62px;border-radius:7px;background:#fff;border:1px solid #dfe7e0}
.phone-notch{position:absolute;z-index:3;top:8px;left:50%;transform:translateX(-50%);width:55px;height:11px;border-radius:0 0 10px 10px;background:#111}
.phone-screen{border-radius:20px!important;padding:0!important;overflow:hidden!important;background:#f8faf8!important}
.phone-scroll{min-height:560px;padding:18px 9px 12px;animation:phoneScroll 1.9s 2.45s cubic-bezier(.4,0,.2,1) both}
.phone-nav{display:flex;justify-content:space-between;align-items:center;color:#173326;font-size:7px;margin-bottom:8px}.phone-nav b{font-size:8px}.phone-hero{height:86px;border-radius:11px;background:linear-gradient(145deg,var(--green-900),var(--green-700));color:#fff;padding:13px 10px;display:flex;flex-direction:column;justify-content:center}.phone-hero small{font-size:6px;color:var(--sage-300)}.phone-hero b{font-size:11px;margin-top:4px}.phone-stat{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid #e0e7e1;border-radius:9px;padding:8px;margin-top:8px;font-size:7px}.phone-stat span{font-weight:900;color:var(--green-700);font-size:12px}.phone-course{height:70px;margin-top:8px;border-radius:9px;background:linear-gradient(135deg,var(--gold),var(--green-700));box-shadow:0 7px 14px rgba(20,38,28,.1)}.phone-feature{height:46px;margin-top:8px;border-radius:8px;background:#fff;border:1px solid #e0e7e1}.phone-cta{margin-top:9px;border-radius:8px;background:var(--gold);color:var(--green-900);padding:8px;text-align:center;font-size:7px;font-weight:900}.phone-footer{padding:13px 3px;text-align:center;font-size:7px;color:#718078}
.device-message{margin-top:24px;opacity:0;}.device-message h2{font-size:clamp(25px,4vw,44px)}
@keyframes phoneScroll{0%{transform:translateY(0)}20%{transform:translateY(-35px)}55%{transform:translateY(-165px)}78%{transform:translateY(-260px)}100%{transform:translateY(-330px)}}
@media(max-width:1024px){.device-scene{gap:20px}.device-laptop{width:410px;height:255px}.device-tablet{width:250px;height:185px}.device-phone{width:125px;height:250px}}
@media(max-width:768px){.device-intro-kicker{top:7%;font-size:8px}.device-scene{height:275px;gap:10px}.device-laptop{width:290px;height:185px}.device-tablet{width:190px;height:140px}.device-phone{width:105px;height:210px}.mini-hero{height:55px}.mini-hero b{font-size:9px}.mini-course i{height:35px}.mini-cards i{height:32px}.phone-scroll{animation-duration:1.7s}.device-message{margin-top:10px}.device-message h2{font-size:23px}.device-message p{font-size:11px}}
@media(max-width:480px){.device-scene{height:225px;gap:5px;transform:scale(.92)}.device-laptop{width:215px;height:138px}.device-tablet{width:135px;height:100px}.device-phone{width:78px;height:160px;border-radius:18px}.phone-notch{top:5px;width:31px;height:7px}.phone-screen{border-radius:13px!important}.phone-scroll{padding:13px 6px;min-height:360px}.phone-hero{height:53px}.phone-hero b{font-size:7px}.phone-stat{padding:5px}.phone-course{height:42px}.phone-feature{height:27px}.device-message h2{font-size:19px}.device-message small{font-size:7px}.device-message p{font-size:9px}}

/* v7.4 — strict theme contracts: every surface/color is derived from the selected palette. */
.cde-sv-demo{--surface:#fff;--surface-2:#eef1ec;--ink:#1e2b33;--muted:#66756c;--line:#e2e8e0;--card-green:#dcebdd;--sage-100:#e3f0e5;--sage-200:#cfe3d2;--sage-300:#a9c7b1;--on-accent:#fff;--dark-panel:var(--green-900);--soft-shadow:0 10px 30px rgba(20,38,28,.08);background:var(--bg);color:var(--ink);width:100%;margin:0;}
.cde-sv-demo[data-template="emerald"]{--bg:#f6f7f3;--surface:#fff;--surface-2:#eef1ec;--ink:#1e2b33;--muted:#66756c;--line:#e2e8e0;--card-green:#dcebdd;--sage-100:#e3f0e5;--sage-200:#cfe3d2;--sage-300:#a9c7b1;--green-600:#3e7a5a;}
.cde-sv-demo[data-template="midnight"]{--bg:#f5f8ff;--surface:#fff;--surface-2:#edf2fa;--ink:#18253a;--muted:#66758b;--line:#dce5f2;--card-green:#dff0ef;--sage-100:#e7f5f3;--sage-200:#c7e6e2;--sage-300:#79bdb5;--green-600:#3fae9a;}
.cde-sv-demo[data-template="royal"]{--bg:#f8f6ff;--surface:#fff;--surface-2:#efecfb;--ink:#27233d;--muted:#77718e;--line:#e2def3;--card-green:#e9e4fb;--sage-100:#f0edff;--sage-200:#ded9ff;--sage-300:#b8aef0;--green-600:#7767d8;}
.cde-sv-demo[data-template="sunset"]{--bg:#fff8f1;--surface:#fff;--surface-2:#f7ece8;--ink:#39272a;--muted:#806b6b;--line:#eadbd6;--card-green:#f6ddd7;--sage-100:#fff0eb;--sage-200:#f0d1c7;--sage-300:#d99b86;--green-600:#bd5d65;}
.cde-sv-demo .navbar,.cde-sv-demo .stats,.cde-sv-demo .features,.cde-sv-demo .student-preview,.cde-sv-demo .teacher-value,.cde-sv-demo .cta{background:var(--bg);}
.cde-sv-demo .stats{background:var(--surface)}
.cde-sv-demo .stat-item,.cde-sv-demo .course-content,.cde-sv-demo .course-title,.cde-sv-demo .student-browser,.cde-sv-demo .teacher-value-grid article,.cde-sv-demo .footer-card{background:var(--surface);border-color:var(--line);color:var(--ink)}
.cde-sv-demo .feature-item{background:var(--card-green);border-color:var(--green-600)}
.cde-sv-demo .course-category{background:var(--sage-100);color:var(--green-800);border-color:var(--sage-300)}
.cde-sv-demo .course-footer{border-color:var(--line)}
.cde-sv-demo .student-browser-top,.cde-sv-demo .student-browser-body{background:var(--surface-2);border-color:var(--line)}
.cde-sv-demo .student-course-mini{background:var(--surface);border-color:var(--line)}
.cde-sv-demo .student-welcome>span{background:var(--sage-100);color:var(--green-700)}
.cde-sv-demo .cta-content{background:var(--sage-200);box-shadow:0 5px 0 var(--sage-300),var(--shadow-soft)}
.cde-sv-demo .cta h2{color:var(--green-900)}
.cde-sv-demo .cta p{color:var(--green-800)}
.cde-sv-demo .teacher-socials a{background:var(--surface);color:var(--green-700);border-color:var(--line)}
.cde-sv-demo .footer{background:var(--green-900)}
.cde-sv-demo .footer-card a{color:var(--green-700)}

/* Dark mode: explicit palette for every theme; no inherited Emerald values. */
.cde-sv-demo.dark[data-template="emerald"]{--bg:#101713;--surface:#18201b;--surface-2:#202a23;--ink:#f2f6f2;--muted:#a9b6ad;--line:#2c3930;--card-green:#1d2b22;--sage-100:#1b2920;--sage-200:#294337;--sage-300:#72a789;--green-600:#4d936d;--green-700:#65a77f;--green-800:#9fc4ac;--green-900:#0b1811;--gold:#f0b429;--gold-600:#c98f0a;--wave-1:#111b15;--wave-2:#17251d;--wave-3:#1b3025}
.cde-sv-demo.dark[data-template="midnight"]{--bg:#090f1c;--surface:#111a2a;--surface-2:#182338;--ink:#f3f7ff;--muted:#a8b7cc;--line:#2a3a54;--card-green:#152b3b;--sage-100:#14283a;--sage-200:#203c52;--sage-300:#69bdb4;--green-600:#3fae9a;--green-700:#55c3b0;--green-800:#a5dcd5;--green-900:#07101e;--gold:#63e6d5;--gold-600:#2eaaa0;--wave-1:#0c1525;--wave-2:#122239;--wave-3:#163748}
.cde-sv-demo.dark[data-template="royal"]{--bg:#0e0b20;--surface:#17132f;--surface-2:#211c40;--ink:#f8f5ff;--muted:#b9b2d1;--line:#352d5b;--card-green:#241e45;--sage-100:#221d43;--sage-200:#31295c;--sage-300:#9d91e6;--green-600:#7868d9;--green-700:#8d7be8;--green-800:#c8c0f4;--green-900:#0a0718;--gold:#f0b84a;--gold-600:#bd8b25;--wave-1:#120e29;--wave-2:#1b1640;--wave-3:#292052}
.cde-sv-demo.dark[data-template="sunset"]{--bg:#170d10;--surface:#25171b;--surface-2:#302025;--ink:#fff6f3;--muted:#c7aaa7;--line:#493136;--card-green:#362327;--sage-100:#2b1d21;--sage-200:#493039;--sage-300:#d18f7f;--green-600:#bd5d65;--green-700:#d36c73;--green-800:#e9b2a5;--green-900:#11080b;--gold:#f2b45a;--gold-600:#c98b3c;--wave-1:#1c0f13;--wave-2:#2b171d;--wave-3:#461f27}
.cde-sv-demo.dark .navbar{background:color-mix(in srgb,var(--surface) 92%,transparent);border-color:var(--line)}
.cde-sv-demo.dark .stats,.cde-sv-demo.dark .stat-item,.cde-sv-demo.dark .course-content,.cde-sv-demo.dark .course-title,.cde-sv-demo.dark .student-browser,.cde-sv-demo.dark .teacher-value-grid article,.cde-sv-demo.dark .footer-card{background:var(--surface);border-color:var(--line);color:var(--ink)}
.cde-sv-demo.dark .features,.cde-sv-demo.dark .student-preview,.cde-sv-demo.dark .teacher-value,.cde-sv-demo.dark .cta{background:var(--bg)}
.cde-sv-demo.dark .feature-item{background:var(--card-green);border-color:var(--green-600)}
.cde-sv-demo.dark .course-category{background:var(--sage-100);color:var(--sage-300);border-color:var(--green-600)}
.cde-sv-demo.dark .course-footer{border-color:var(--line)}
.cde-sv-demo.dark .student-browser-top,.cde-sv-demo.dark .student-browser-body{background:var(--surface-2);border-color:var(--line)}
.cde-sv-demo.dark .student-course-mini{background:var(--surface);border-color:var(--line)}
.cde-sv-demo.dark .student-welcome>span{background:var(--sage-100);color:var(--green-700)}
.cde-sv-demo.dark .cta-content{background:var(--surface-2);box-shadow:0 5px 0 var(--green-600),var(--shadow-soft);border:1px solid var(--line)}
.cde-sv-demo.dark .cta h2,.cde-sv-demo.dark .cta p{color:var(--ink)}
.cde-sv-demo.dark .cta-btn{background:var(--gold);color:var(--green-900)}
.cde-sv-demo.dark .teacher-socials a{background:var(--surface);color:var(--green-700);border-color:var(--line)}
.cde-sv-demo.dark .footer{background:var(--green-900)}
.cde-sv-demo.dark .footer-card a{color:var(--gold)}
.cde-sv-demo.dark .hero-btn{background:var(--sage-200);color:var(--ink);box-shadow:0 4px 0 var(--green-600)}
.cde-sv-demo.dark .course-btn{background:var(--green-600);color:#fff;box-shadow:0 4px 0 var(--green-900)}
.cde-sv-demo.dark .feature-icon{background:var(--surface);border-color:var(--green-600);color:var(--green-700)}
.cde-sv-demo.dark .course-image-wrapper{background:var(--surface-2)}
.cde-sv-demo.dark .teacher-avatar{background:var(--green-600);box-shadow:0 3px 0 var(--green-900)}

/* Responsive, edge-to-edge page shell. */
.cde-fullscreen-page{margin:0!important;padding:0!important;background:transparent!important}
.cde-fullscreen-page #page,.cde-fullscreen-page .site,.cde-fullscreen-page .site-content,.cde-fullscreen-page .content-area,.cde-fullscreen-page main{max-width:none!important;width:100%!important;margin:0!important;padding:0!important}
.cde-fullscreen-page .cde-sv-demo{min-width:0}

.cde-sv-demo .device-laptop{width:265px;height:162px}.cde-sv-demo .device-tablet{width:180px;height:130px}.cde-sv-demo .device-phone{width:88px;height:175px}.cde-sv-demo .device-message h2{font-size:20px}.cde-sv-demo .device-message p{font-size:9px}}

/* CDE 7.5 — reference-SV dark mode contract. The supplied SV.html applies dark mode by replacing
   page-level variables; this block follows that model for every surface in the demo. */
.cde-sv-demo,
.cde-sv-demo[data-template="emerald"]{--page-text:#1e2b33;--page-muted:#66756c;--page-line:#e2e8e0;--page-surface:#fff;--page-surface-2:#eef1ec;--page-soft:#dcebdd;--page-soft-2:#e3f0e5;--page-soft-3:#cfe3d2;--page-accent-text:#1e3a2a;--page-button:#3e7a5a;--page-button-shadow:#14261c;--page-nav:#23282e;--page-nav-shadow:#0b0d0f;--page-white:#fff;--page-bg:var(--bg)}
.cde-sv-demo[data-template="midnight"]{--page-text:#18253a;--page-muted:#66758b;--page-line:#dce5f2;--page-surface:#fff;--page-surface-2:#edf2fa;--page-soft:#dff0ef;--page-soft-2:#e7f5f3;--page-soft-3:#c7e6e2;--page-accent-text:#17233d;--page-button:#3fae9a;--page-button-shadow:#17233d;--page-nav:#111b30;--page-nav-shadow:#070d18;--page-white:#fff;--page-bg:var(--bg)}
.cde-sv-demo[data-template="royal"]{--page-text:#27233d;--page-muted:#77718e;--page-line:#e2def3;--page-surface:#fff;--page-surface-2:#efecfb;--page-soft:#e9e4fb;--page-soft-2:#f0edff;--page-soft-3:#ded9ff;--page-accent-text:#28205b;--page-button:#6756c6;--page-button-shadow:#28205b;--page-nav:#24203f;--page-nav-shadow:#100d24;--page-white:#fff;--page-bg:var(--bg)}
.cde-sv-demo[data-template="sunset"]{--page-text:#39272a;--page-muted:#806b6b;--page-line:#eadbd6;--page-surface:#fff;--page-surface-2:#f7ece8;--page-soft:#f6ddd7;--page-soft-2:#fff0eb;--page-soft-3:#f0d1c7;--page-accent-text:#4b2027;--page-button:#b4525a;--page-button-shadow:#4b2027;--page-nav:#2f2024;--page-nav-shadow:#170b0e;--page-white:#fff;--page-bg:var(--bg)}
.cde-sv-demo.dark[data-template="emerald"]{--bg:#121712;--surface:#1b221d;--surface-2:#232d26;--ink:#f1f5f1;--muted:#aab7ae;--line:#303b33;--card-green:#202f25;--sage-100:#1b2a21;--sage-200:#2b4436;--sage-300:#75a98a;--green-600:#4e946d;--green-700:#65a77f;--green-800:#a5c7b0;--green-900:#0b1710;--gold:#f0b429;--gold-600:#c98f0a;--wave-1:#151e18;--wave-2:#1c2b22;--wave-3:#21382a;--page-text:#f1f5f1;--page-muted:#aab7ae;--page-line:#303b33;--page-surface:#1b221d;--page-surface-2:#232d26;--page-soft:#202f25;--page-soft-2:#1b2a21;--page-soft-3:#2b4436;--page-accent-text:#f1f5f1;--page-button:#4e946d;--page-button-shadow:#0b1710;--page-nav:#202722;--page-nav-shadow:#080d0a;--page-white:#fff}
.cde-sv-demo.dark[data-template="midnight"]{--bg:#0a101c;--surface:#111a2a;--surface-2:#1b263b;--ink:#f3f7ff;--muted:#a9b8ce;--line:#2b3b55;--card-green:#152b3b;--sage-100:#14283a;--sage-200:#203f54;--sage-300:#6fc5bb;--green-600:#42b6a2;--green-700:#55c8b4;--green-800:#a7ddd6;--green-900:#070e19;--gold:#63e6d5;--gold-600:#2eaaa0;--wave-1:#0d1626;--wave-2:#13243a;--wave-3:#173b4c;--page-text:#f3f7ff;--page-muted:#a9b8ce;--page-line:#2b3b55;--page-surface:#111a2a;--page-surface-2:#1b263b;--page-soft:#152b3b;--page-soft-2:#14283a;--page-soft-3:#203f54;--page-accent-text:#f3f7ff;--page-button:#42b6a2;--page-button-shadow:#070e19;--page-nav:#111827;--page-nav-shadow:#050912;--page-white:#fff}
.cde-sv-demo.dark[data-template="royal"]{--bg:#100d22;--surface:#191431;--surface-2:#251f45;--ink:#f8f5ff;--muted:#bbb4d2;--line:#382f5d;--card-green:#282148;--sage-100:#241e45;--sage-200:#332c60;--sage-300:#a093e9;--green-600:#7b6bdf;--green-700:#907de8;--green-800:#cac2f4;--green-900:#090715;--gold:#f0b84a;--gold-600:#bd8b25;--wave-1:#130f2b;--wave-2:#1d1741;--wave-3:#2a2151;--page-text:#f8f5ff;--page-muted:#bbb4d2;--page-line:#382f5d;--page-surface:#191431;--page-surface-2:#251f45;--page-soft:#282148;--page-soft-2:#241e45;--page-soft-3:#332c60;--page-accent-text:#f8f5ff;--page-button:#7b6bdf;--page-button-shadow:#090715;--page-nav:#211c3c;--page-nav-shadow:#0a0718;--page-white:#fff}
.cde-sv-demo.dark[data-template="sunset"]{--bg:#190d11;--surface:#28181d;--surface-2:#332127;--ink:#fff6f3;--muted:#c9aca9;--line:#4b3238;--card-green:#39262a;--sage-100:#2e1f24;--sage-200:#4b313a;--sage-300:#d49280;--green-600:#c35f67;--green-700:#d57077;--green-800:#ebb4a7;--green-900:#11080b;--gold:#f2b45a;--gold-600:#c98b3c;--wave-1:#1e1014;--wave-2:#2d181e;--wave-3:#472028;--page-text:#fff6f3;--page-muted:#c9aca9;--page-line:#4b3238;--page-surface:#28181d;--page-surface-2:#332127;--page-soft:#39262a;--page-soft-2:#2e1f24;--page-soft-3:#4b313a;--page-accent-text:#fff6f3;--page-button:#c35f67;--page-button-shadow:#11080b;--page-nav:#302126;--page-nav-shadow:#12080b;--page-white:#fff}

/* Root/page background follows the same variable contract as SV.html's body.dark. */
.cde-sv-demo{background:var(--bg);color:var(--ink)}
.cde-fullscreen-page{background:var(--bg)!important}
.cde-fullscreen-page:has(.cde-sv-demo[data-template="emerald"]){background:#f6f7f3!important}
.cde-fullscreen-page:has(.cde-sv-demo[data-template="midnight"]){background:#f5f8ff!important}
.cde-fullscreen-page:has(.cde-sv-demo[data-template="royal"]){background:#f8f6ff!important}
.cde-fullscreen-page:has(.cde-sv-demo[data-template="sunset"]){background:#fff8f1!important}
.cde-fullscreen-page:has(.cde-sv-demo.dark[data-template="emerald"]){background:#121712!important}
.cde-fullscreen-page:has(.cde-sv-demo.dark[data-template="midnight"]){background:#0a101c!important}
.cde-fullscreen-page:has(.cde-sv-demo.dark[data-template="royal"]){background:#100d22!important}
.cde-fullscreen-page:has(.cde-sv-demo.dark[data-template="sunset"]){background:#190d11!important}

/* Remove remaining hard-coded light surfaces from the demo so dark mode cannot leak white blocks. */
.cde-sv-demo .logo{background:var(--page-nav);color:var(--gold);box-shadow:0 3px 0 var(--page-nav-shadow)}
.cde-sv-demo .logo img{background:var(--page-surface)}
.cde-sv-demo .theme-toggle{background:var(--sage-200);color:var(--green-800);box-shadow:inset 0 2px 4px rgba(0,0,0,.16)}
.cde-sv-demo .theme-toggle i{background:var(--surface);color:var(--green-700)}
.cde-sv-demo .course-badge{background:var(--page-nav);color:var(--gold);box-shadow:0 3px 0 var(--page-nav-shadow)}
.cde-sv-demo .teacher-avatar{background:var(--green-700);box-shadow:0 3px 0 var(--green-900)}
.cde-sv-demo .course-btn{background:var(--green-700);color:#fff;box-shadow:0 4px 0 var(--green-900)}
.cde-sv-demo .hero-css{background:radial-gradient(circle at 22% 18%,color-mix(in srgb,var(--gold) 20%,transparent),transparent 46%),linear-gradient(135deg,var(--green-700),var(--green-900));color:var(--gold)}
.cde-sv-demo .hero-css small{color:var(--muted)}
.cde-sv-demo .student-play{background:var(--green-700)!important;color:#fff!important}
.cde-sv-demo .teacher-socials a{background:var(--surface);color:var(--green-700);border-color:var(--line)}
.cde-sv-demo .footer{background:var(--green-900);color:#fff}
.cde-sv-demo .footer-card{background:var(--surface);color:var(--ink);border-color:var(--line)}
.cde-sv-demo .footer-card a{color:var(--gold)}

/* The intro montage also consumes the selected theme; its mini site never falls back to Emerald. */
.cde-sv-demo .cde-device-intro{background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--green-600) 32%,transparent),transparent 44%),var(--green-900);color:#fff}
.cde-sv-demo .device{background:var(--page-nav-shadow);border-color:var(--line);box-shadow:0 25px 70px rgba(0,0,0,.35)}
.cde-sv-demo .device-screen{background:linear-gradient(145deg,var(--surface),var(--surface-2));color:var(--ink)}
.cde-sv-demo .mini-nav{background:var(--page-nav)}
.cde-sv-demo .mini-hero{background:linear-gradient(135deg,var(--green-900),var(--green-700))}
.cde-sv-demo .mini-cards i,.cde-sv-demo .mini-course i{background:var(--surface);border-color:var(--line)}
.cde-sv-demo .laptop-base{background:var(--page-nav)}
.cde-sv-demo .device-message small{color:var(--gold)}
.cde-sv-demo .device-message p{color:var(--muted)}

/* Exact-SV behavior: body.dark changes the page variables; all sections consume those variables. */
.cde-sv-demo.dark .hero,
.cde-sv-demo.dark .features,
.cde-sv-demo.dark .student-preview,
.cde-sv-demo.dark .teacher-value,
.cde-sv-demo.dark .cta{background:var(--bg)}
.cde-sv-demo.dark .stats{background:var(--surface)}
.cde-sv-demo.dark .course-image-wrapper{background:var(--surface-2)}
.cde-sv-demo.dark .course-content,
.cde-sv-demo.dark .course-title,
.cde-sv-demo.dark .stat-item,
.cde-sv-demo.dark .teacher-value-grid article,
.cde-sv-demo.dark .student-browser,
.cde-sv-demo.dark .footer-card{background:var(--surface);color:var(--ink);border-color:var(--line)}
.cde-sv-demo.dark .feature-item{background:var(--card-green);border-color:var(--green-600);color:var(--ink)}
.cde-sv-demo.dark .feature-item h3,.cde-sv-demo.dark .feature-item p{color:var(--ink)}
.cde-sv-demo.dark .course-category{background:var(--sage-100);color:var(--sage-300);border-color:var(--green-600)}
.cde-sv-demo.dark .course-desc,.cde-sv-demo.dark .course-teacher,.cde-sv-demo.dark .stat-label{color:var(--muted)}
.cde-sv-demo.dark .section-header h2,.cde-sv-demo.dark .course-title,.cde-sv-demo.dark .teacher-value-grid h3{color:var(--ink)}
.cde-sv-demo.dark .section-header p{color:var(--muted)}
.cde-sv-demo.dark .student-browser-top,.cde-sv-demo.dark .student-browser-body{background:var(--surface-2);border-color:var(--line)}
.cde-sv-demo.dark .student-course-mini{background:var(--surface);border-color:var(--line);color:var(--ink)}
.cde-sv-demo.dark .student-welcome>span{background:var(--sage-100);color:var(--green-700)}
.cde-sv-demo.dark .cta-content{background:var(--surface-2);border-color:var(--line);box-shadow:0 5px 0 var(--green-600),var(--shadow-soft)}
.cde-sv-demo.dark .cta h2,.cde-sv-demo.dark .cta p{color:var(--ink)}
.cde-sv-demo.dark .hero-btn{background:var(--sage-200);color:var(--ink);box-shadow:0 4px 0 var(--green-600)}
.cde-sv-demo.dark .feature-icon{background:var(--surface);border-color:var(--green-600);color:var(--green-700)}
.cde-sv-demo.dark .teacher-socials a{background:var(--surface);border-color:var(--line);color:var(--green-700)}

@media(prefers-reduced-motion:reduce){.cde-sv-demo .device-laptop,.cde-sv-demo .device-tablet,.cde-sv-demo .device-phone,.cde-sv-demo .phone-scroll{}}

/* CDE 7.6 — final theme isolation + premium campaign visual system. */
.cde-sv-demo{isolation:isolate;--page-bg:var(--bg);--page-surface:var(--surface);--page-surface-2:var(--surface-2);--page-text:var(--ink);--page-muted:var(--muted);--page-line:var(--line)}
.cde-sv-demo,.cde-sv-demo .hero,.cde-sv-demo .stats,.cde-sv-demo .courses,.cde-sv-demo .features,.cde-sv-demo .student-preview,.cde-sv-demo .teacher-value,.cde-sv-demo .cta{background-color:var(--bg)!important;color:var(--ink)!important}
.cde-sv-demo .navbar{background:color-mix(in srgb,var(--surface) 94%,transparent)!important;border-color:var(--line)!important}
.cde-sv-demo .nav-links a,.cde-sv-demo .course-title,.cde-sv-demo .feature-item h3,.cde-sv-demo .section-header h2,.cde-sv-demo .teacher-value-grid h3,.cde-sv-demo .course-desc,.cde-sv-demo .course-teacher,.cde-sv-demo .stat-label{color:var(--ink)!important}
.cde-sv-demo .hero p,.cde-sv-demo .section-header p,.cde-sv-demo .course-desc,.cde-sv-demo .stat-label,.cde-sv-demo .teacher-value-grid p{color:var(--muted)!important}
.cde-sv-demo .stats{background:var(--surface)!important}.cde-sv-demo .stat-item,.cde-sv-demo .course-content,.cde-sv-demo .course-title,.cde-sv-demo .teacher-value-grid article,.cde-sv-demo .student-browser,.cde-sv-demo .footer-card{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
.cde-sv-demo .course-image-wrapper{background:var(--surface-2)!important}.cde-sv-demo .course-category{background:var(--sage-100)!important;color:var(--sage-300)!important;border-color:var(--green-600)!important}.cde-sv-demo .feature-item{background:var(--card-green)!important;border-color:var(--green-600)!important}.cde-sv-demo .feature-item p{color:var(--muted)!important}.cde-sv-demo .feature-icon{background:var(--surface)!important;border-color:var(--green-600)!important;color:var(--green-700)!important}
.cde-sv-demo .hero-btn{background:var(--sage-200)!important;color:var(--ink)!important;box-shadow:0 4px 0 var(--green-600)!important}.cde-sv-demo .course-btn{background:var(--green-700)!important;color:#fff!important;box-shadow:0 4px 0 var(--green-900)!important}.cde-sv-demo .teacher-avatar{background:var(--green-700)!important;box-shadow:0 3px 0 var(--green-900)!important}.cde-sv-demo .cta-content{background:var(--surface-2)!important;border:1px solid var(--line)!important}.cde-sv-demo .cta h2,.cde-sv-demo .cta p{color:var(--ink)!important}.cde-sv-demo .cta-btn{background:var(--gold)!important;color:var(--green-900)!important}.cde-sv-demo .teacher-socials a{background:var(--surface)!important;border-color:var(--line)!important;color:var(--green-700)!important}
.cde-sv-demo.dark .hero,.cde-sv-demo.dark .features,.cde-sv-demo.dark .student-preview,.cde-sv-demo.dark .teacher-value,.cde-sv-demo.dark .cta{background:var(--bg)!important}.cde-sv-demo.dark .stats{background:var(--surface)!important}.cde-sv-demo.dark .stat-item,.cde-sv-demo.dark .course-content,.cde-sv-demo.dark .course-title,.cde-sv-demo.dark .teacher-value-grid article,.cde-sv-demo.dark .student-browser,.cde-sv-demo.dark .footer-card{background:var(--surface)!important}.cde-sv-demo.dark .feature-item{background:var(--card-green)!important}.cde-sv-demo.dark .course-category{background:var(--sage-100)!important;color:var(--sage-300)!important}.cde-sv-demo.dark .course-desc,.cde-sv-demo.dark .course-teacher,.cde-sv-demo.dark .stat-label,.cde-sv-demo.dark .section-header p{color:var(--muted)!important}
.cde-sv-demo.dark .hero-poster-frame,.cde-sv-demo.dark .student-browser-top,.cde-sv-demo.dark .student-browser-body,.cde-sv-demo.dark .student-course-mini{background:var(--surface-2)!important;border-color:var(--line)!important}.cde-sv-demo.dark .student-welcome>span{background:var(--sage-100)!important;color:var(--green-700)!important}.cde-sv-demo.dark .teacher-socials a{background:var(--surface)!important;border-color:var(--line)!important}.cde-sv-demo.dark .footer{background:var(--green-900)!important}.cde-sv-demo.dark .footer-card a{color:var(--gold)!important}
.cde-fullscreen-page{background:#0b1020!important}.cde-fullscreen-page .cde-sv-demo{width:100%;max-width:none}

/* Campaign: clean, premium edtech/AI direction. */
.cde-campaign{--camp-bg:#070b16;--camp-surface:#0e1424;--camp-surface-2:#131b2e;--camp-text:#f6f8ff;--camp-muted:#aab4c8;--camp-line:rgba(255,255,255,.10);--camp-primary:#7c5cff;--camp-cyan:#39d7ff;--camp-shadow:0 30px 100px rgba(0,0,0,.30);background:var(--camp-bg)!important;color:var(--camp-text)!important}
.cde-campaign-wrap{padding-inline:clamp(18px,4vw,72px)!important}.cde-campaign-hero{background:radial-gradient(circle at 78% 25%,rgba(57,215,255,.13),transparent 25%),radial-gradient(circle at 18% 20%,rgba(124,92,255,.20),transparent 30%),linear-gradient(180deg,#090e1c,#070b16)!important;padding-block:clamp(72px,9vw,130px)!important}.cde-campaign-hero:after{background:var(--camp-bg)!important}.cde-live-badge{background:rgba(124,92,255,.12)!important;color:#c9c0ff!important;border:1px solid rgba(124,92,255,.25)}.cde-live-badge span{background:var(--camp-cyan)!important;box-shadow:0 0 0 5px rgba(57,215,255,.10)!important}.cde-campaign-copy h1{color:var(--camp-text)!important}.cde-campaign-copy h1 strong{background:linear-gradient(90deg,var(--camp-primary),var(--camp-cyan));-webkit-background-clip:text;background-clip:text;color:transparent!important}.cde-campaign-copy>p{color:var(--camp-muted)!important}.cde-campaign-copy>p b{color:#fff!important}.cde-big-cta,.cde-nav-action{background:linear-gradient(135deg,var(--camp-primary),#5c7cff)!important;color:#fff!important;box-shadow:0 5px 0 #3b3291!important}.cde-big-cta:hover,.cde-nav-action:hover{box-shadow:0 8px 0 #3b3291,0 25px 60px rgba(92,124,255,.22)!important}.cde-trust-mini{color:#8592a9!important}.cde-browser{background:var(--camp-surface)!important;border-color:var(--camp-line)!important;box-shadow:0 40px 100px rgba(0,0,0,.40)!important}.cde-browser-top,.cde-platform-browser-top{background:#111827!important;border-color:var(--camp-line)!important;color:#8996ad!important}.cde-browser-top em,.cde-platform-browser-top em{color:var(--camp-cyan)!important}.cde-browser-body{background:#0b1220!important}.cde-browser-body aside{background:#090e1a!important}.cde-browser-body aside a{color:#9ba8bd!important}.cde-browser-body aside a.active{background:linear-gradient(90deg,#6d55e8,#4f83ff)!important}.mini-profile span{background:var(--camp-cyan)!important;color:#07101a!important}.cde-ui-content{background:#0b1220!important}.ui-welcome small,.ui-cards small,.ui-course-row small{color:#8c99ae!important}.ui-welcome h3,.ui-cards b,.ui-course-row b{color:#f2f5ff!important}.ui-welcome>span{background:rgba(57,215,255,.12)!important;color:var(--camp-cyan)!important}.ui-hero-card{background:linear-gradient(135deg,#151c39,#30236b)!important}.ui-hero-card button{background:var(--camp-cyan)!important;color:#07101a!important}.ui-cards div,.ui-course-row{background:#111a2b!important;border-color:var(--camp-line)!important}.cde-social-proof-strip{background:#0b1020!important;border-color:var(--camp-line)!important}.cde-social-proof-strip>div{color:#8d9ab0!important}.cde-social-proof-strip b{color:var(--camp-cyan)!important}.cde-pain{background:#090e19!important}.cde-section-tag{color:var(--camp-cyan)!important}.cde-pain h2,.cde-solution h2,.cde-experience h2,.cde-form-intro h2,.cde-final-cta h2{color:#f6f8ff!important}.cde-pain h2 strong,.cde-solution h2 strong,.cde-experience h2 strong,.cde-form-intro h2 strong{color:#a99aff!important}.cde-section-lead,.cde-solution p{color:#9aa7bb!important}.cde-pain-grid article{background:#0f1626!important;border-color:var(--camp-line)!important}.cde-pain-grid span{color:#637087!important}.cde-pain-grid b{color:#f1f5ff!important}.cde-pain-grid p{color:#8794a9!important}.cde-solution{background:#0c1321!important}.cde-checks span{background:#111a2a!important;border-color:var(--camp-line)!important;color:#bfc9da!important}.cde-transformation{background:#0f1626!important;border-color:var(--camp-line)!important}.cde-old{background:#151b28!important}.cde-old b,.cde-new b{color:#f4f7ff!important}.cde-old span{color:#8b98ac!important}.cde-new{background:linear-gradient(135deg,#17134a,#22285c)!important}.cde-new span{color:#b4c0d4!important}.cde-experience{background:#090f1b!important}.cde-exp-stage{background:linear-gradient(135deg,#0a1020,#171b48)!important}.cde-form-section{background:#080d17!important}.cde-form-intro p{color:#98a5ba!important}.cde-form-shell{background:#0e1525!important;border-color:var(--camp-line)!important;box-shadow:var(--camp-shadow)!important}.cde-form-steps-visual{background:linear-gradient(160deg,#11172b,#211d52)!important}.cde-form-steps-visual h3{color:#fff!important}.cde-form-steps-visual>p{color:#b0bbcd!important}.side-benefits span{background:rgba(255,255,255,.05)!important;border-color:var(--camp-line)!important}.cde-form{background:#0c1321!important;color:#eef2fa!important}.cde-form-head{background:transparent!important}.cde-form-head>div:first-child b,.cde-form-head>div:first-child span{color:#fff!important}.cde-step h3,.cde-field-title,.cde-step legend{color:#f5f7fc!important}.cde-step>p{color:#98a5b9!important}.cde-step label{color:#dce3ef!important}.cde-step label em{color:#7f8ba0!important}.cde-choice-hint,.cde-step legend small{background:#141d30!important;border-color:var(--camp-line)!important;color:#aeb9cb!important}.cde-step input:not([type=radio]):not([type=checkbox]){background:#111a2b!important;border-color:#293650!important;color:#f3f6fc!important}.cde-option-grid label span,.cde-budget-grid label span{background:#111a2b!important;border-color:#293650!important;color:#dbe3ef!important}.cde-option-grid label:hover span,.cde-budget-grid label:hover span{background:#152039!important;border-color:#53698f!important}.cde-option-grid label input:checked+span,.cde-budget-grid label input:checked+span{background:rgba(124,92,255,.18)!important;border-color:#7c5cff!important;color:#fff!important;box-shadow:0 0 0 2px rgba(124,92,255,.10)!important}.cde-option-grid input:checked+span:after,.cde-budget-grid input:checked+span:after{background:var(--camp-cyan)!important;color:#07101a!important}.cde-template-card{background:#111a2b!important;border-color:#293650!important}.cde-template-card b{color:#f1f4fb!important}.cde-template-card small{color:#93a0b5!important}.cde-template-card input:checked~b:before{color:var(--camp-cyan)!important}.cde-image-slot,.cde-contact-fields{background:#0f1728!important;border-color:#31405a!important}.cde-image-slot b,.cde-contact-fields-head b{color:#eef2f9!important}.cde-image-slot small,.cde-contact-fields-head small,.cde-contact-grid label span{color:#8d9ab0!important}.cde-contact-grid input{background:#111a2b!important;border-color:#293650!important;color:#fff!important}.cde-next,.cde-submit{background:linear-gradient(135deg,#7c5cff,#526dff)!important;box-shadow:0 4px 0 #3b3291!important}.cde-back{background:#111a2b!important;border-color:#2b3952!important;color:#cbd5e4!important}.cde-submit-promise{background:#111a2b!important;border-color:#2d3b54!important}.cde-submit-promise b{color:#eef2f8!important}.cde-submit-promise small,.cde-form-note{color:#8996aa!important}.cde-final-cta{background:linear-gradient(180deg,#0c1220,#070b16)!important}.cde-final-cta h2 strong{color:var(--camp-cyan)!important}.cde-campaign-footer{background:#060a12!important;border-color:var(--camp-line)!important;color:#7f8ba0!important}
@media(max-width:680px){.cde-campaign-wrap{padding-inline:14px!important}.cde-campaign-copy h1{letter-spacing:-1.5px}.cde-pain,.cde-solution,.cde-experience,.cde-demo-offer,.cde-form-section,.cde-final-cta{padding-block:68px!important}.cde-form-shell{border-radius:18px!important}.cde-option-grid.two-grid,.cde-budget-grid{grid-template-columns:1fr 1fr!important}}

/* DESIGNER 7.7 — deterministic theme system.  No inline palette may override dark mode. */
.cde-sv-demo[data-template="emerald"]{--green-900:#14261c;--green-800:#1e3a2a;--green-700:#2e5b44;--green-600:#3e7a5a;--sage-300:#a9c7b1;--sage-200:#cfe3d2;--sage-100:#e3f0e5;--gold:#f0b429;--gold-600:#c98f0a;--wave-1:#edf3ee;--wave-2:#e3eee6;--wave-3:#d7e8dc}
.cde-sv-demo[data-template="midnight"]{--green-900:#10233a;--green-800:#173b59;--green-700:#245a72;--green-600:#2f8f83;--sage-300:#79bdb5;--sage-200:#c7e6e2;--sage-100:#e7f5f3;--gold:#49cfc0;--gold-600:#2eaaa0;--wave-1:#eaf4f4;--wave-2:#deeeee;--wave-3:#d1e8e7}
.cde-sv-demo[data-template="royal"]{--green-900:#20164a;--green-800:#34256b;--green-700:#51419a;--green-600:#7767d8;--sage-300:#b8aef0;--sage-200:#ded9ff;--sage-100:#f0edff;--gold:#f0b84a;--gold-600:#bd8b25;--wave-1:#f0edff;--wave-2:#e8e3fc;--wave-3:#ded7f8}
.cde-sv-demo[data-template="sunset"]{--green-900:#421b24;--green-800:#67303a;--green-700:#934851;--green-600:#bd5d65;--sage-300:#d99b86;--sage-200:#f0d1c7;--sage-100:#fff0eb;--gold:#f2b45a;--gold-600:#c98b3c;--wave-1:#fff0eb;--wave-2:#f9e5df;--wave-3:#f2d8d1}

/* Dark palettes mirror the supplied SV.txt variable architecture: surfaces, ink, lines and waves all switch together. */
.cde-sv-demo.dark[data-template="emerald"]{--bg:#121212;--surface:#1b1f1c;--surface-2:#20261f;--ink:#f2f4f0;--muted:#a7b3a9;--line:#2a332c;--card-green:#1d2a22;--sage-100:#17211b;--sage-200:#cfe3d2;--sage-300:#a9c7b1;--green-900:#0e2b22;--green-800:#1e3a2a;--green-700:#2f6b4f;--green-600:#3e7a5a;--gold:#d9a441;--gold-600:#c98f0a;--wave-1:#161d18;--wave-2:#1e2c24;--wave-3:#173527;--shadow-soft:0 10px 30px rgba(0,0,0,.45);--shadow-lift:0 20px 45px rgba(0,0,0,.6)}
.cde-sv-demo.dark[data-template="midnight"]{--bg:#0b1018;--surface:#121b29;--surface-2:#192536;--ink:#f3f7ff;--muted:#a8b7cc;--line:#2a3a54;--card-green:#152b3b;--sage-100:#14283a;--sage-200:#203c52;--sage-300:#69bdb4;--green-900:#07101e;--green-800:#173b59;--green-700:#245a72;--green-600:#3fae9a;--gold:#63e6d5;--gold-600:#2eaaa0;--wave-1:#0c1525;--wave-2:#122239;--wave-3:#163748;--shadow-soft:0 10px 30px rgba(0,0,0,.48);--shadow-lift:0 20px 45px rgba(0,0,0,.62)}
.cde-sv-demo.dark[data-template="royal"]{--bg:#100c20;--surface:#191430;--surface-2:#241e40;--ink:#f8f5ff;--muted:#b9b2d1;--line:#352d5b;--card-green:#241e45;--sage-100:#221d43;--sage-200:#31295c;--sage-300:#9d91e6;--green-900:#0a0718;--green-800:#34256b;--green-700:#51419a;--green-600:#7868d9;--gold:#f0b84a;--gold-600:#bd8b25;--wave-1:#120e29;--wave-2:#1b1640;--wave-3:#292052;--shadow-soft:0 10px 30px rgba(0,0,0,.5);--shadow-lift:0 20px 45px rgba(0,0,0,.65)}
.cde-sv-demo.dark[data-template="sunset"]{--bg:#180d11;--surface:#26181c;--surface-2:#332126;--ink:#fff6f3;--muted:#c7aaa7;--line:#493136;--card-green:#362327;--sage-100:#2b1d21;--sage-200:#493039;--sage-300:#d18f7f;--green-900:#11080b;--green-800:#67303a;--green-700:#934851;--green-600:#bd5d65;--gold:#f2b45a;--gold-600:#c98b3c;--wave-1:#1c0f13;--wave-2:#2b171d;--wave-3:#461f27;--shadow-soft:0 10px 30px rgba(0,0,0,.5);--shadow-lift:0 20px 45px rgba(0,0,0,.65)}
.cde-sv-demo.dark,.cde-sv-demo.dark .hero,.cde-sv-demo.dark .features,.cde-sv-demo.dark .student-preview,.cde-sv-demo.dark .teacher-value,.cde-sv-demo.dark .cta{background-color:var(--bg)}
.cde-sv-demo.dark .navbar{background:color-mix(in srgb,var(--surface) 94%,transparent);border-color:var(--line)}
.cde-sv-demo.dark .stats,.cde-sv-demo.dark .stat-item,.cde-sv-demo.dark .course-content,.cde-sv-demo.dark .course-title,.cde-sv-demo.dark .student-browser,.cde-sv-demo.dark .teacher-value-grid article,.cde-sv-demo.dark .footer-card{background-color:var(--surface);border-color:var(--line);color:var(--ink)}
.cde-sv-demo.dark .feature-item{background-color:var(--card-green);border-color:var(--green-600)}
.cde-sv-demo.dark .course-category,.cde-sv-demo.dark .student-welcome>span{background-color:var(--sage-100);color:var(--sage-300);border-color:var(--green-600)}
.cde-sv-demo.dark .student-browser-top,.cde-sv-demo.dark .student-browser-body{background-color:var(--surface-2);border-color:var(--line)}
.cde-sv-demo.dark .student-course-mini{background-color:var(--surface);border-color:var(--line)}
.cde-sv-demo.dark .cta-content{background-color:var(--surface-2);border:1px solid var(--line);box-shadow:0 5px 0 var(--green-600),var(--shadow-soft)}
.cde-sv-demo.dark .cta h2,.cde-sv-demo.dark .cta p{color:var(--ink)}
.cde-sv-demo.dark .cta-btn{background:var(--gold);color:var(--green-900)}
.cde-sv-demo.dark .hero-btn{background:var(--sage-200);color:var(--green-900);box-shadow:0 4px 0 var(--green-600)}
.cde-sv-demo.dark .course-btn{background:var(--green-600);color:#fff;box-shadow:0 4px 0 var(--green-900)}
.cde-sv-demo.dark .feature-icon{background:var(--surface);border-color:var(--green-600);color:var(--sage-300)}
.cde-sv-demo.dark .teacher-socials a{background:var(--surface);border-color:var(--line);color:var(--sage-300)}
.cde-sv-demo.dark .footer{background:var(--green-900)}
.cde-sv-demo.dark .footer-card a{color:var(--gold)}

/* DESIGNER campaign — premium AI/education conversion page. Markup + form mechanics remain unchanged. */
.cde-campaign{--d-bg:#070a12;--d-panel:#0d1220;--d-panel2:#11182a;--d-line:rgba(255,255,255,.09);--d-text:#f7f8fc;--d-muted:#9ba7bb;--d-violet:#806cff;--d-cyan:#39d9ff;--d-lime:#b8f36b;--d-gold:#ffd166;background:var(--d-bg);color:var(--d-text);font-family:"Cairo",system-ui,sans-serif;overflow:hidden}
.cde-campaign-wrap{padding-inline:clamp(18px,5vw,90px)}
.cde-campaign-hero{position:relative;padding:clamp(72px,9vw,132px) 0 110px;background:radial-gradient(700px 500px at 85% 18%,rgba(128,108,255,.20),transparent 65%),radial-gradient(600px 440px at 8% 20%,rgba(57,217,255,.10),transparent 65%),linear-gradient(180deg,#080b15 0%,#070a12 100%)}
.cde-campaign-hero:after{content:"";position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(128,108,255,.55),transparent)}
.cde-campaign-hero-grid{max-width:1500px;grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);align-items:center;gap:clamp(40px,7vw,100px)}
.cde-campaign-copy{text-align:right;position:relative;z-index:2}.cde-live-badge{display:inline-flex!important;align-items:center;gap:9px;padding:8px 13px!important;border:1px solid rgba(128,108,255,.35)!important;background:rgba(128,108,255,.08)!important;color:#bcb4ff!important;border-radius:999px!important;font-size:11px!important;font-weight:900!important;box-shadow:0 8px 30px rgba(0,0,0,.16)}.cde-live-badge span{width:7px!important;height:7px!important;background:var(--d-cyan)!important;box-shadow:0 0 14px var(--d-cyan)}
.cde-campaign-copy h1{font-size:clamp(40px,5.4vw,76px);line-height:1.12;letter-spacing:-2.8px;color:var(--d-text);margin:24px 0 22px}.cde-campaign-copy h1 strong{background:linear-gradient(90deg,#fff 10%,#bcb4ff 48%,#63ddff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.cde-campaign-copy>p{color:var(--d-muted);line-height:2;font-size:clamp(15px,1.45vw,19px);max-width:720px}.cde-campaign-copy>p b{color:#e9ecf5}
.cde-campaign-actions{margin-top:30px}.cde-big-cta{display:inline-flex!important;align-items:center;justify-content:center;gap:14px;border:1px solid rgba(255,255,255,.12)!important;background:linear-gradient(135deg,var(--d-violet),#5b4ee8)!important;color:#fff!important;padding:15px 24px!important;border-radius:14px!important;box-shadow:0 14px 45px rgba(96,76,230,.28)!important;font-weight:900!important;transition:.25s ease}.cde-big-cta:hover{transform:translateY(-3px);box-shadow:0 20px 55px rgba(96,76,230,.38)!important}.cde-trust-mini{gap:8px}.cde-trust-mini span{color:#aeb8ca!important;background:rgba(255,255,255,.035)!important;border:1px solid var(--d-line)!important;padding:6px 9px!important;border-radius:8px!important;font-size:9px!important}
.cde-campaign-visual{min-height:clamp(410px,43vw,620px);display:flex;align-items:center}.cde-browser{width:100%;border:1px solid rgba(255,255,255,.13)!important;background:#0b101b!important;border-radius:24px!important;box-shadow:0 40px 100px rgba(0,0,0,.48)!important;transform:perspective(1300px) rotateY(-4deg) rotateX(1deg)!important}.cde-browser-top{background:#101726!important;border-color:var(--d-line)!important}.cde-browser-body{background:#080d16!important}.cde-browser-body aside{background:#0c1320!important;border-color:var(--d-line)!important}.cde-ui-content{background:#080d16!important}.ui-welcome,.ui-course-row{background:#101827!important;border-color:var(--d-line)!important}.ui-welcome h3,.ui-course-row b{color:#f3f6fc!important}.ui-welcome small,.ui-course-row small{color:#8997ae!important}.ui-welcome>span{background:rgba(128,108,255,.15)!important;color:#bcb4ff!important}.ui-hero-card{background:linear-gradient(135deg,#171c35,#11192c)!important;border:1px solid rgba(128,108,255,.28)!important}.ui-hero-card h4{color:#fff!important}.ui-hero-card p{color:#a9b4c8!important}.ui-hero-card button{background:var(--d-violet)!important}.ui-play{background:rgba(57,217,255,.13)!important;color:var(--d-cyan)!important}.ui-cards>div{background:#101827!important;border-color:var(--d-line)!important}.ui-cards b{color:#fff!important}.ui-cards small{color:#8491a6!important}
.cde-social-proof-strip{background:#090d17!important;border-block:1px solid var(--d-line)!important;padding:22px clamp(18px,5vw,90px)!important}.cde-social-proof-strip div span{color:#a8b2c4!important}.cde-social-proof-strip div b{color:#bcb4ff!important}.cde-social-proof-strip i{background:#2b3548!important}
.cde-pain,.cde-experience,.cde-form-section{background:#080c15!important}.cde-solution,.cde-demo-offer,.cde-final-cta{background:#0b101a!important}.cde-section-tag{color:#8fe7ff!important;letter-spacing:1.4px;font-weight:900}.cde-pain h2,.cde-solution h2,.cde-experience h2,.cde-demo-offer h2,.cde-final-cta h2{color:#f5f7fc!important}.cde-pain h2 strong,.cde-solution h2 strong,.cde-experience h2 strong,.cde-demo-offer h2 strong,.cde-final-cta h2 strong{color:#bcb4ff!important}.cde-section-lead,.cde-solution p,.cde-experience p,.cde-demo-offer p,.cde-final-cta p{color:#97a4b9!important}
.cde-pain-grid article,.cde-transformation,.cde-exp-stage,.cde-exp-copy>div,.cde-offer-card{background:linear-gradient(145deg,#0e1421,#0a0f19)!important;border:1px solid var(--d-line)!important;box-shadow:0 20px 55px rgba(0,0,0,.18)!important}.cde-pain-grid article:hover,.cde-exp-copy>div:hover{border-color:rgba(128,108,255,.45)!important;transform:translateY(-5px)}.cde-pain-grid article span,.cde-exp-copy b{background:rgba(128,108,255,.12)!important;color:#bcb4ff!important}.cde-pain-grid article b,.cde-exp-copy h3{color:#f3f6fb!important}.cde-pain-grid article p,.cde-exp-copy p{color:#8795aa!important}.cde-old{background:#14111a!important;border-color:rgba(255,255,255,.07)!important}.cde-new{background:rgba(128,108,255,.10)!important;border-color:rgba(128,108,255,.28)!important}.cde-old b,.cde-new b{color:#f4f6fb!important}.cde-arrow{color:var(--d-cyan)!important}
.cde-exp-screen,.exp-window{background:#0a0f18!important;border-color:var(--d-line)!important}.cde-exp-stage:after{background:radial-gradient(circle,rgba(128,108,255,.22),transparent 68%)!important}
.cde-offer-card{padding:clamp(28px,5vw,58px)!important}.cde-offer-art{background:radial-gradient(circle at 50% 45%,rgba(57,217,255,.16),transparent 55%),linear-gradient(145deg,#11162a,#0b101b)!important;border:1px solid rgba(128,108,255,.25)!important}.art-screen{background:linear-gradient(145deg,#161b35,#0d1425)!important;border-color:rgba(255,255,255,.10)!important}.art-screen b{color:#fff!important}.cde-offer-points span{color:#b6c1d2!important;background:rgba(255,255,255,.035)!important;border-color:var(--d-line)!important}
.cde-form-section{padding-top:clamp(70px,8vw,110px)!important;padding-bottom:clamp(70px,8vw,110px)!important}.cde-form-intro h2{color:#f6f8fc!important}.cde-form-intro h2 strong{color:#bcb4ff!important}.cde-form-intro p{color:#8e9aae!important}.cde-form-shell{background:#0d1320!important;border:1px solid var(--d-line)!important;border-radius:24px!important;box-shadow:0 35px 100px rgba(0,0,0,.36)!important}.cde-form-steps-visual{background:radial-gradient(circle at 20% 10%,rgba(57,217,255,.12),transparent 35%),linear-gradient(160deg,#101936,#0b1020)!important}.cde-form-steps-visual h3,.cde-form-steps-visual p{color:#f3f6fb!important}.side-benefits span{background:rgba(255,255,255,.045)!important;border:1px solid var(--d-line)!important;color:#c4cddd!important}.side-quote{border-color:rgba(128,108,255,.3)!important;background:rgba(128,108,255,.07)!important;color:#c9c3ff!important}.cde-form{background:#0b111d!important}.cde-form-head{background:transparent!important;border-color:var(--d-line)!important}.cde-form-head>div:first-child{color:#8e9aae!important}.cde-form-head>div:first-child b{color:#fff!important}.cde-progress i{background:#202b3d!important}.cde-progress i:first-child{background:linear-gradient(90deg,var(--d-violet),var(--d-cyan))!important}.cde-step h3,.cde-step label,.cde-field-title{color:#f1f4fa!important}.cde-step>p,.cde-step label em{color:#8996aa!important}.cde-choice-hint{background:rgba(255,255,255,.045)!important;border-color:var(--d-line)!important;color:#9aa8bd!important}.cde-step input:not([type=radio]):not([type=checkbox]){background:#0f1724!important;border-color:#263246!important;color:#f5f7fb!important}.cde-step input:not([type=radio]):not([type=checkbox]):focus{border-color:var(--d-violet)!important;box-shadow:0 0 0 3px rgba(128,108,255,.14)!important}.cde-option-grid label span,.cde-budget-grid label span{background:#0e1623!important;border-color:#253146!important;color:#cbd3df!important}.cde-option-grid input:checked+span,.cde-budget-grid input:checked+span{background:rgba(128,108,255,.11)!important;border-color:var(--d-violet)!important;color:#fff!important;box-shadow:0 0 0 2px rgba(128,108,255,.12)!important}.cde-option-grid input:checked+span:after,.cde-budget-grid input:checked+span:after{background:var(--d-violet)!important}.cde-template-card{background:#0e1623!important;border-color:#253146!important;color:#fff!important}.cde-template-card small{color:#8795aa!important}.cde-template-card input:checked~b:before{color:var(--d-cyan)!important}.cde-image-slot{background:#0e1623!important;border-color:#344158!important;color:#f2f5fa!important}.cde-image-slot small{color:#7f8da3!important}.cde-contact-fields-head b{color:#f2f5fa!important}.cde-contact-fields-head small{color:#7f8da3!important}.cde-submit-promise{background:#0f1825!important;border-color:#263246!important}.cde-submit-promise b{color:#f0f4f9!important}.cde-submit-promise small,.cde-form-note{color:#7f8da3!important}.cde-submit{background:linear-gradient(135deg,var(--d-violet),#5c4de5)!important;box-shadow:0 10px 30px rgba(96,76,230,.22)!important}.cde-back,.cde-next{background:#111a28!important;border-color:#2b374b!important;color:#dce3ee!important}
.cde-final-cta{padding-top:110px!important;padding-bottom:120px!important;text-align:center;border-top:1px solid var(--d-line)}.cde-final-cta>div>span{color:var(--d-cyan)!important;font-size:10px;letter-spacing:3px;font-weight:900}.cde-campaign-footer{background:#060910!important;border-top:1px solid var(--d-line)!important;color:#7f8da3!important}.cde-campaign-footer b{color:#dfe5ef!important;letter-spacing:2px}
@media(max-width:900px){.cde-campaign-hero-grid{grid-template-columns:1fr}.cde-campaign-copy{text-align:center}.cde-campaign-visual{min-height:380px}.cde-browser{transform:none!important}}
@media(max-width:640px){.cde-campaign-hero{padding-top:58px}.cde-campaign-copy h1{font-size:39px;letter-spacing:-1.8px}.cde-campaign-actions{justify-content:center}.cde-big-cta{width:100%!important}.cde-trust-mini{justify-content:center}.cde-campaign-visual{min-height:300px}.cde-form-shell{border-radius:18px!important}.cde-form-steps-visual,.cde-form{padding:20px 15px!important}.cde-offer-card{padding:22px!important}}


/* CDE 7.8 — calmer landing page rhythm without changing its structure or interactions. */
.cde-sv-demo .hero{min-height:92vh;padding-top:120px;padding-bottom:170px}
.cde-sv-demo .hero-inner{gap:42px;max-width:1180px}
.cde-sv-demo .hero p{margin-bottom:30px;line-height:1.85}
.cde-sv-demo .stats{padding:62px 20px}
.cde-sv-demo .stats-grid{max-width:1100px;gap:20px}
.cde-sv-demo .stat-item{padding:28px 18px;border-radius:20px}
.cde-sv-demo .courses,.cde-sv-demo .features,.cde-sv-demo .student-preview,.cde-sv-demo .teacher-value{padding-top:68px;padding-bottom:68px}
.cde-sv-demo .section-header{margin-bottom:34px}
.cde-sv-demo .courses-grid{gap:22px;max-width:1160px;margin-left:auto;margin-right:auto}
.cde-sv-demo .course-content{padding:22px}
.cde-sv-demo .course-desc{line-height:1.75}
.cde-sv-demo .features-grid,.cde-sv-demo .teacher-value-grid{gap:18px;max-width:1120px;margin-left:auto;margin-right:auto}
.cde-sv-demo .feature-item,.cde-sv-demo .teacher-value-grid article{padding:24px}
.cde-sv-demo .student-preview-inner{max-width:1180px;margin:auto}
.cde-sv-demo .cta{padding-top:70px;padding-bottom:82px}

.cde-sv-demo .device-phone{width:154px;height:300px;border-radius:28px}
  .cde-sv-demo .device-message h2{font-size:19px}
}


/* CDE 7.7.6 — final scoped design fixes.  Keep Designer UI isolated from the live teacher demo. */
.cde-sv-demo:not(.dark) .cde-step input:not([type=radio]):not([type=checkbox]),
.cde-sv-demo:not(.dark) .cde-contact-grid input,
.cde-sv-demo:not(.dark) .cde-step textarea,
.cde-sv-demo:not(.dark) .cde-step select,
.cde-sv-demo:not(.dark) .cde-other-input{
  color:#18231d!important;
  -webkit-text-fill-color:#18231d!important;
  background:#fff!important;
  border-color:#cfd9d1!important;
  caret-color:#3e7a5a!important;
}
.cde-sv-demo:not(.dark) .cde-step input::placeholder,
.cde-sv-demo:not(.dark) .cde-contact-grid input::placeholder,
.cde-sv-demo:not(.dark) .cde-step textarea::placeholder{color:#7b897f!important;-webkit-text-fill-color:#7b897f!important;opacity:1}
.cde-sv-demo:not(.dark) .cde-step input:focus,
.cde-sv-demo:not(.dark) .cde-contact-grid input:focus,
.cde-sv-demo:not(.dark) .cde-step textarea:focus,
.cde-sv-demo:not(.dark) .cde-step select:focus{border-color:var(--page-button)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--page-button) 15%,transparent)!important;outline:0}
.cde-sv-demo:not(.dark) .cde-next,
.cde-sv-demo:not(.dark) .cde-submit{
  background:linear-gradient(135deg,var(--page-button),var(--page-accent-text))!important;
  color:#fff!important;
  border:1px solid color-mix(in srgb,var(--page-button) 80%,#000)!important;
  box-shadow:0 5px 0 var(--page-button-shadow),0 12px 28px color-mix(in srgb,var(--page-button) 18%,transparent)!important;
}
.cde-sv-demo:not(.dark) .cde-next:hover,
.cde-sv-demo:not(.dark) .cde-submit:hover{transform:translateY(-2px);filter:saturate(1.06)}
.cde-sv-demo:not(.dark) .cde-back{background:var(--page-surface)!important;color:var(--page-accent-text)!important;border:1px solid var(--page-line)!important;box-shadow:0 3px 0 var(--page-soft)!important}
.cde-sv-demo:not(.dark) .cde-back:hover{background:var(--page-surface-2)!important}
.cde-sv-demo:not(.dark) .cde-option-grid label span,
.cde-sv-demo:not(.dark) .cde-budget-grid label span,
.cde-sv-demo:not(.dark) .cde-template-card{background:var(--page-surface)!important;color:var(--page-text)!important;border-color:var(--page-line)!important}
.cde-sv-demo:not(.dark) .cde-option-grid input:checked+span,
.cde-sv-demo:not(.dark) .cde-budget-grid input:checked+span{background:var(--page-soft-2)!important;color:var(--page-accent-text)!important;border-color:var(--page-button)!important}
.cde-sv-demo:not(.dark) .cde-option-grid input:checked+span:after,
.cde-sv-demo:not(.dark) .cde-budget-grid input:checked+span:after{background:var(--page-button)!important;color:#fff!important}


/* CDE 7.8.8 — isolated cinematic intro. This is the ONLY animation layer for the intro. */
.cde-sv-demo .cde-device-intro{
  position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;
  z-index:99999!important;display:block!important;overflow:hidden!important;isolation:isolate!important;
  margin:0!important;padding:0!important;pointer-events:auto!important;opacity:1!important;visibility:visible!important;
  background:radial-gradient(circle at 50% 36%,rgba(91,77,229,.26),transparent 40%),linear-gradient(145deg,#070b14 0%,#101a2d 52%,#070b14 100%)!important;
  color:#fff!important;filter:none!important;transform:none!important;animation:none!important;
}
.cde-sv-demo.intro-done .cde-device-intro{display:none!important;pointer-events:none!important}
.cde-sv-demo .cde-device-intro .device-intro-kicker{
  position:absolute!important;left:50%!important;top:8%!important;transform:translateX(-50%)!important;
  z-index:60!important;opacity:1!important;visibility:visible!important;animation:none!important;
  color:#63e6d5!important;letter-spacing:.22em!important;font-size:10px!important;font-weight:900!important;white-space:nowrap!important;
  text-shadow:0 0 22px rgba(99,230,213,.22)!important;
}
.cde-sv-demo .cde-device-intro .device-scene{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  margin:0!important;padding:0!important;display:block!important;overflow:hidden!important;transform:none!important;animation:none!important;
}
.cde-sv-demo .cde-device-intro .device-scene .device{
  position:absolute!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;
  margin:0!important;display:block!important;opacity:0!important;visibility:visible!important;z-index:1!important;
  transform-origin:50% 50%!important;will-change:transform,opacity,filter,box-shadow!important;
  pointer-events:none!important;backface-visibility:hidden!important;-webkit-backface-visibility:hidden!important;
  animation:none!important;filter:none!important;
}
/* Every device is parked below the viewport until JS explicitly activates exactly one. */
.cde-sv-demo .cde-device-intro .device-scene .device,
.cde-sv-demo .cde-device-intro .device-scene .device *{box-sizing:border-box!important}
.cde-sv-demo .cde-device-intro .device-phone{width:min(24vw,170px)!important;height:min(48vh,330px)!important;border-radius:28px!important}
.cde-sv-demo .cde-device-intro .device-tablet{width:min(52vw,360px)!important;height:min(38vh,260px)!important;border-radius:17px!important}
.cde-sv-demo .cde-device-intro .device-laptop{width:min(82vw,1120px)!important;height:min(62vh,620px)!important;border-radius:13px 13px 4px 4px!important}
.cde-sv-demo .cde-device-intro .device-screen{position:absolute!important;inset:8px!important;overflow:hidden!important;background:var(--surface)!important;color:var(--ink)!important}
.cde-sv-demo .cde-device-intro .device-phone .device-screen{border-radius:22px!important}
.cde-sv-demo .cde-device-intro .device-tablet .device-screen{border-radius:10px!important}
.cde-sv-demo .cde-device-intro .device-laptop .device-screen{border-radius:7px!important}

@keyframes cdeIntroRise888{
  0%{opacity:0;transform:translate3d(-50%,calc(-50% + 115vh),0) scale(.18);filter:blur(2px) saturate(.78)}
  18%{opacity:1;transform:translate3d(-50%,calc(-50% + 68vh),0) scale(.34);filter:blur(.65px) saturate(.86)}
  43%{opacity:1;transform:translate3d(-50%,calc(-50% + 30vh),0) scale(.62);filter:blur(.15px) saturate(.95)}
  67%{opacity:1;transform:translate3d(-50%,calc(-50% + 4vh),0) scale(.90);filter:none;box-shadow:0 0 0 8px rgba(99,230,213,.05),0 28px 88px rgba(0,0,0,.30)}
  88%{opacity:1;transform:translate3d(-50%,-50%,0) scale(1);filter:none;box-shadow:0 0 0 13px rgba(99,230,213,.08),0 34px 105px rgba(0,0,0,.38)}
  100%{opacity:0;transform:translate3d(-50%,calc(-50% - 105vh),0) scale(1.035);filter:blur(1px)}
}
@keyframes cdeIntroHold888{
  0%{opacity:0;transform:translate3d(-50%,calc(-50% + 115vh),0) scale(.18);filter:blur(2px) saturate(.78)}
  18%{opacity:1;transform:translate3d(-50%,calc(-50% + 68vh),0) scale(.34);filter:blur(.65px) saturate(.86)}
  43%{opacity:1;transform:translate3d(-50%,calc(-50% + 30vh),0) scale(.62);filter:blur(.15px) saturate(.95)}
  67%{opacity:1;transform:translate3d(-50%,calc(-50% + 4vh),0) scale(.90);filter:none;box-shadow:0 0 0 8px rgba(99,230,213,.05),0 28px 88px rgba(0,0,0,.30)}
  78%,100%{opacity:1;transform:translate3d(-50%,-50%,0) scale(1);filter:none;box-shadow:0 0 0 13px rgba(99,230,213,.08),0 34px 105px rgba(0,0,0,.38)}
}
.cde-sv-demo.intro-active-phone .cde-device-intro .device-phone,
.cde-sv-demo.intro-active-tablet .cde-device-intro .device-tablet,
.cde-sv-demo.intro-active-laptop .cde-device-intro .device-laptop{opacity:1!important;z-index:5!important;animation:cdeIntroRise888 1.90s cubic-bezier(.16,.82,.24,1) both!important}
.cde-sv-demo.intro-final-phone .cde-device-intro .device-phone,
.cde-sv-demo.intro-final-tablet .cde-device-intro .device-tablet,
.cde-sv-demo.intro-final-laptop .cde-device-intro .device-laptop{opacity:1!important;z-index:6!important;animation:cdeIntroHold888 1.90s cubic-bezier(.16,.82,.24,1) both!important}

/* The final camera move is confined to the final device only. */
@keyframes cdeIntroEnter888{
  0%{opacity:1;transform:translate3d(-50%,-50%,0) scale(1);filter:none}
  32%{opacity:1;transform:translate3d(-50%,-50%,0) scale(1.08);filter:saturate(1.02) brightness(1.01)}
  100%{opacity:1;transform:translate3d(-50%,-50%,0) scale(var(--cde-entry-scale,1.62));filter:saturate(1.04) brightness(1.03)}
}
.cde-sv-demo.intro-enter .cde-device-intro .device-scene .device{opacity:0!important;animation:none!important}
@media(min-width:1101px){.cde-sv-demo.intro-enter.intro-final-laptop .device-laptop{opacity:1!important;z-index:10!important;--cde-entry-scale:1.68;animation:cdeIntroEnter888 1.25s cubic-bezier(.18,.78,.16,1) both!important}}
@media(min-width:769px) and (max-width:1100px){.cde-sv-demo.intro-enter.intro-final-tablet .device-tablet{opacity:1!important;z-index:10!important;--cde-entry-scale:1.68;animation:cdeIntroEnter888 1.25s cubic-bezier(.18,.78,.16,1) both!important}}
@media(max-width:768px){.cde-sv-demo.intro-enter.intro-final-phone .device-phone{opacity:1!important;z-index:10!important;--cde-entry-scale:1.58;animation:cdeIntroEnter888 1.25s cubic-bezier(.18,.78,.16,1) both!important}}

/* One short day/night beat on the final device only. */
.cde-sv-demo .cde-device-intro .device-theme-orbit{opacity:0!important;pointer-events:none!important;transform-origin:50% 50%!important}
.cde-sv-demo.intro-night .cde-device-intro .device-theme-orbit{opacity:1!important;transform:scale(1.06) rotate(360deg)!important;transition:transform .72s cubic-bezier(.2,.8,.2,1),opacity .2s ease!important;z-index:31!important}
.cde-sv-demo.intro-night .cde-device-intro .device-theme-orbit i{transform:rotate(-360deg)!important;transition:transform .72s ease!important}
.cde-sv-demo.intro-night .cde-device-intro .device-theme-orbit b{transform:rotate(-360deg)!important;transition:transform .72s ease!important}
.cde-sv-demo.intro-night .cde-device-intro{background:radial-gradient(circle at 50% 35%,rgba(91,77,229,.24),transparent 42%),#0d1320!important;transition:background .55s ease!important}
.cde-sv-demo .cde-device-intro .device-screen::after{content:""!important;position:absolute!important;top:0!important;bottom:0!important;left:-35%!important;width:24%!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent)!important;transform:skewX(-18deg) translateX(-180%)!important;opacity:0!important;pointer-events:none!important;z-index:30!important}
.cde-sv-demo.intro-night .cde-device-intro .device-screen::after{opacity:1!important;transform:skewX(-18deg) translateX(520%)!important;transition:transform .72s cubic-bezier(.2,.8,.2,1),opacity .1s ease!important}

/* Intro copy and CTA — always readable before and during the animation. */
.cde-sv-demo .cde-device-intro .device-message{
  position:absolute!important;left:50%!important;bottom:clamp(24px,5vh,58px)!important;width:min(92vw,900px)!important;
  margin:0!important;z-index:40!important;text-align:center!important;opacity:1!important;visibility:visible!important;
  transform:translateX(-50%)!important;animation:none!important;filter:none!important;color:#fff!important;
}
.cde-sv-demo .cde-device-intro .device-message small{display:block!important;color:#63e6d5!important;opacity:1!important;letter-spacing:.22em!important;font-size:10px!important;font-weight:900!important}
.cde-sv-demo .cde-device-intro .device-message h2{color:#fff!important;font-size:clamp(25px,4vw,44px)!important;line-height:1.25!important;margin:6px 0!important;text-shadow:0 5px 24px rgba(0,0,0,.28)!important}
.cde-sv-demo .cde-device-intro .device-message p{color:rgba(255,255,255,.78)!important;font-size:clamp(12px,1.5vw,15px)!important;margin:0!important;font-weight:700!important}
.cde-sv-demo .device-intro-cta{
  appearance:none!important;border:1px solid rgba(255,255,255,.24)!important;background:rgba(255,255,255,.11)!important;
  color:#fff!important;min-width:170px!important;min-height:50px!important;margin:18px auto 0!important;padding:12px 24px!important;
  border-radius:999px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;
  font:800 15px/1 Cairo,system-ui,sans-serif!important;cursor:pointer!important;pointer-events:auto!important;
  box-shadow:0 12px 34px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.14)!important;
  backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;
}
.cde-sv-demo .device-intro-cta i{font-size:12px!important;animation:cdeIntroArrow888 1.25s ease-in-out infinite!important}
.cde-sv-demo.intro-running .device-intro-cta{pointer-events:none!important;opacity:.28!important}
@keyframes cdeIntroArrow888{0%,100%{transform:translateY(-2px)}50%{transform:translateY(4px)}}
.cde-sv-demo.intro-enter .device-message{opacity:0!important;transition:opacity .22s ease!important}

@media(max-width:768px){
  .cde-sv-demo .cde-device-intro .device-laptop{width:min(86vw,520px)!important;height:min(48vh,310px)!important}
  .cde-sv-demo .cde-device-intro .device-tablet{width:min(82vw,440px)!important;height:min(54vh,340px)!important}
  .cde-sv-demo .cde-device-intro .device-phone{width:min(80vw,390px)!important;height:min(70vh,620px)!important;max-height:620px!important;border-radius:clamp(28px,5vw,44px)!important}
  .cde-sv-demo .cde-device-intro .device-phone .device-screen{inset:7px!important;border-radius:23px!important}
  .cde-sv-demo .cde-device-intro .device-laptop .device-theme-orbit,.cde-sv-demo .cde-device-intro .device-tablet .device-theme-orbit{display:none!important}
  .cde-sv-demo .cde-device-intro .device-phone .device-theme-orbit{display:flex!important}
}
@media(min-width:769px) and (max-width:1100px){
  .cde-sv-demo .cde-device-intro .device-phone .device-theme-orbit,.cde-sv-demo .cde-device-intro .device-laptop .device-theme-orbit{display:none!important}
  .cde-sv-demo .cde-device-intro .device-tablet .device-theme-orbit{display:flex!important}
}
@media(min-width:1101px){
  .cde-sv-demo .cde-device-intro .device-phone .device-theme-orbit,.cde-sv-demo .cde-device-intro .device-tablet .device-theme-orbit{display:none!important}
  .cde-sv-demo .cde-device-intro .device-laptop .device-theme-orbit{display:flex!important}
}
@media(max-width:480px){.cde-sv-demo .device-intro-cta{min-width:150px!important;min-height:46px!important;font-size:14px!important;margin-top:14px!important}.cde-sv-demo .cde-device-intro .device-message h2{font-size:clamp(20px,6vw,25px)!important}}
@media(prefers-reduced-motion:reduce){.cde-sv-demo .cde-device-intro .device-intro-cta i{animation:none!important}.cde-sv-demo .cde-device-intro .device-scene .device{animation-duration:.01ms!important;animation-iteration-count:1!important}}


/* 7.8.9 — pre-animation title + true reveal handoff. Keep all intro effects isolated. */
.cde-sv-demo .cde-device-intro .device-response{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.cde-sv-demo .cde-device-intro .device-message{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  bottom:auto!important;
  width:min(92vw,920px)!important;
  margin:0!important;
  padding:0 12px!important;
  z-index:100!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  transform:translate(-50%,-42%)!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  animation:none!important;
}
.cde-sv-demo .cde-device-intro .device-message small{
  display:block!important;
  margin:0 0 10px!important;
  color:#63e6d5!important;
  opacity:1!important;
  letter-spacing:.22em!important;
  font-size:clamp(9px,1.2vw,12px)!important;
  line-height:1.4!important;
  font-weight:900!important;
}
.cde-sv-demo .cde-device-intro .device-message h2{
  display:block!important;
  color:#fff!important;
  opacity:1!important;
  font-size:clamp(27px,5vw,58px)!important;
  line-height:1.22!important;
  margin:0!important;
  font-weight:900!important;
  text-shadow:0 8px 35px rgba(0,0,0,.34)!important;
}
.cde-sv-demo .cde-device-intro .device-message p{
  display:block!important;
  color:rgba(255,255,255,.82)!important;
  opacity:1!important;
  font-size:clamp(13px,1.7vw,17px)!important;
  line-height:1.6!important;
  margin:9px 0 0!important;
  font-weight:700!important;
}
.cde-sv-demo .cde-device-intro .device-intro-cta{
  position:relative!important;
  z-index:101!important;
  margin:24px auto 0!important;
  min-width:190px!important;
  min-height:56px!important;
  padding:13px 30px!important;
  border:1px solid rgba(255,255,255,.28)!important;
  background:rgba(255,255,255,.11)!important;
  color:#fff!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:13px!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  box-shadow:0 14px 42px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.16)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.cde-sv-demo .cde-device-intro .device-intro-cta span{color:#fff!important;opacity:1!important}
.cde-sv-demo .cde-device-intro .device-intro-cta i{color:#fff!important;opacity:1!important}
.cde-sv-demo.intro-running .cde-device-intro .device-message{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:opacity .28s ease,visibility 0s linear .28s!important;
}
.cde-sv-demo.intro-running .cde-device-intro .device-response{display:none!important}
/* During the final camera move, reveal the real demo underneath instead of leaving an opaque blank layer. */
.cde-sv-demo.intro-enter .cde-device-intro{
  background:transparent!important;
  pointer-events:none!important;
  transition:background .45s ease!important;
}
.cde-sv-demo.intro-enter .cde-device-intro .device-scene{
  background:transparent!important;
}
.cde-sv-demo.intro-enter .cde-device-intro .device-screen{
  box-shadow:none!important;
}
@media(max-width:768px){
  .cde-sv-demo .cde-device-intro .device-message{width:94vw!important;transform:translate(-50%,-38%)!important;padding:0 8px!important}
  .cde-sv-demo .cde-device-intro .device-message h2{font-size:clamp(24px,7.2vw,36px)!important}
  .cde-sv-demo .cde-device-intro .device-message p{font-size:13px!important;margin-top:8px!important}
  .cde-sv-demo .cde-device-intro .device-intro-cta{min-width:178px!important;min-height:52px!important;margin-top:20px!important;font-size:15px!important}
}
@media(max-width:380px){
  .cde-sv-demo .cde-device-intro .device-message{transform:translate(-50%,-34%)!important}
  .cde-sv-demo .cde-device-intro .device-message h2{font-size:23px!important}
  .cde-sv-demo .cde-device-intro .device-message p{font-size:12px!important}
}


/* v7.9.0 — isolated intro polish, real logo, populated phone and hard handoff boundary. */
.cde-sv-demo .cde-device-intro{isolation:isolate!important;overflow:hidden!important;background:radial-gradient(circle at 50% 42%,rgba(91,77,229,.24),transparent 42%),#0b1020!important;color:#fff!important}
.cde-sv-demo .cde-device-intro-brand,.cde-device-intro .device-intro-brand{position:absolute!important;top:5.5%!important;left:50%!important;transform:translateX(-50%)!important;width:min(190px,38vw)!important;z-index:80!important;display:flex!important;justify-content:center!important;opacity:1!important;pointer-events:none!important}
.cde-sv-demo .device-intro-brand img{display:block!important;width:100%!important;height:auto!important;max-height:58px!important;object-fit:contain!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:none!important;opacity:1!important}
.cde-sv-demo .cde-device-intro .phone-scroll{transform:none!important;animation:none!important;will-change:auto!important;min-height:100%!important;height:auto!important;position:relative!important;top:auto!important;bottom:auto!important}
.cde-sv-demo .cde-device-intro .phone-screen{background:#f8faf8!important;color:#173326!important}
.cde-sv-demo .cde-device-intro .phone-nav,.cde-sv-demo .cde-device-intro .phone-hero,.cde-sv-demo .cde-device-intro .phone-stat,.cde-sv-demo .cde-device-intro .phone-course,.cde-sv-demo .cde-device-intro .phone-feature,.cde-sv-demo .cde-device-intro .phone-cta,.cde-sv-demo .cde-device-intro .phone-footer{opacity:1!important;visibility:visible!important}
.cde-sv-demo .cde-device-intro .phone-nav{min-height:18px!important}
.cde-sv-demo .cde-device-intro .phone-hero{min-height:76px!important}
.cde-sv-demo .cde-device-intro .phone-stat{min-height:34px!important}
.cde-sv-demo .cde-device-intro .phone-course{display:block!important;min-height:54px!important}
.cde-sv-demo .cde-device-intro .phone-feature{display:block!important;min-height:34px!important}
.cde-sv-demo .cde-device-intro .phone-cta{display:block!important}
.cde-sv-demo .cde-device-intro .phone-footer{display:block!important}
@media(max-width:480px){
 .cde-sv-demo .cde-device-intro-brand{top:4.5%!important;width:min(155px,42vw)!important}
 .cde-sv-demo .cde-device-intro .phone-scroll{padding:9px 6px!important}
 .cde-sv-demo .cde-device-intro .phone-hero{min-height:48px!important;height:48px!important}
 .cde-sv-demo .cde-device-intro .phone-stat{min-height:27px!important;padding:5px!important}
 .cde-sv-demo .cde-device-intro .phone-course{min-height:34px!important;height:34px!important}
 .cde-sv-demo .cde-device-intro .phone-feature{min-height:23px!important;height:23px!important}
}
/* Keep the real demo page completely outside the intro transform/filter stack. */
.cde-sv-demo.intro-done .cde-device-intro{display:none!important;visibility:hidden!important;pointer-events:none!important;opacity:0!important;transform:none!important;filter:none!important}