.demo-hero{border:1.5px solid var(--stage-border);box-shadow:var(--stage-shadow);max-width:var(--layout-max-w);text-align:center;background:#fff;border-radius:36px;margin:30px auto 40px;padding:clamp(60px,8vh,100px) clamp(24px,5vw,64px);position:relative;overflow:hidden}.demo-hero:before{content:"✦";color:var(--warm-accent);opacity:.7;font-size:20px;position:absolute;top:24px;left:32px}.demo-hero:after{content:"✦";color:var(--brand-400);opacity:.6;font-size:18px;position:absolute;bottom:24px;right:32px}.demo-badge{background:var(--warm-accent-soft);border:1.5px solid var(--warm-accent-border);color:var(--brand-700);letter-spacing:.02em;border-radius:9999px;align-items:center;gap:8px;margin-bottom:20px;padding:6px 16px;font-size:13px;font-weight:700;display:inline-flex}.demo-badge-dot{background-color:var(--warm-accent);width:7px;height:7px;box-shadow:0 0 8px var(--warm-accent);border-radius:50%;animation:2s infinite demo-pulse}@keyframes demo-pulse{0%{opacity:.5;transform:scale(.95)}50%{opacity:1;transform:scale(1.2)}to{opacity:.5;transform:scale(.95)}}.demo-hero h1{color:var(--brand-700);letter-spacing:-.5px;margin-bottom:20px;font-size:clamp(32px,5vw,48px);font-weight:900;line-height:1.25}.demo-hero p{color:var(--text-muted);max-width:720px;margin:0 auto 32px;font-size:clamp(16px,2vw,19px);line-height:1.7}.demo-benefits-section{max-width:var(--layout-max-w);margin:0 auto;padding:80px 5%}.demo-section-title{text-align:center;color:var(--brand-700);margin-bottom:48px;font-size:clamp(24px,4vw,32px);font-weight:800;position:relative}.demo-section-title:after{content:"";background:var(--accent);border-radius:2px;width:60px;height:4px;margin:12px auto 0;display:block}.demo-benefits-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;display:grid}.demo-benefit-card{border:1.5px solid var(--card-border-strong);transition:var(--transition);box-shadow:var(--shadow-sm);background:#fff;border-radius:26px;flex-direction:column;padding:36px 28px;display:flex;position:relative;overflow:hidden}.demo-benefit-card:hover{border-color:var(--brand-500);box-shadow:var(--shadow-lg);transform:translateY(-5px)}.demo-benefit-card:nth-child(2){background:var(--brand-500);border-color:var(--brand-500);color:#fff}.demo-benefit-card:nth-child(2) h3,.demo-benefit-card:nth-child(2) p{color:#fff}.demo-benefit-card:nth-child(2) .demo-card-icon{color:var(--brand-700);background:#fff}.demo-benefit-card:nth-child(2) .demo-card-number{color:#fff3}.demo-card-number{color:var(--neutral-100);z-index:1;transition:var(--transition);-webkit-user-select:none;user-select:none;font-size:40px;font-weight:900;line-height:1;position:absolute;top:20px;right:24px}.demo-benefit-card:hover .demo-card-number{color:#8e72bd14;transform:scale(1.1)}.demo-card-icon{width:48px;height:48px;color:var(--brand-500);z-index:2;transition:var(--transition);background:#70529a0d;border-radius:12px;justify-content:center;align-items:center;margin-bottom:24px;display:flex;position:relative}.demo-benefit-card:hover .demo-card-icon{background:var(--accent);color:#fff;transform:rotate(5deg)}.demo-benefit-card h3{color:var(--brand-700);z-index:2;margin-bottom:12px;font-size:19px;font-weight:700;position:relative}.demo-benefit-card p{color:var(--text-muted);z-index:2;margin:0;font-size:14px;line-height:1.6;position:relative}.demo-content-section{max-width:var(--layout-max-w);grid-template-columns:1fr 1fr;align-items:start;gap:64px;margin:0 auto 80px;padding:80px 5%;display:grid}@media (max-width:991px){.demo-content-section{grid-template-columns:1fr;gap:48px}}.demo-learn-column h2{color:var(--brand-700);margin-bottom:24px;font-size:clamp(24px,4vw,30px);font-weight:800}.demo-learn-list{flex-direction:column;gap:16px;margin:0;padding:0;list-style:none;display:flex}.demo-learn-item{color:var(--text);align-items:flex-start;gap:14px;font-size:15px;line-height:1.6;display:flex}.demo-learn-check{width:22px;height:22px;color:var(--accent-dark);background:#8e72bd1a;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-top:2px;display:flex}.demo-form-wrapper{background:var(--bg-alt);border:1px solid var(--neutral-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:40px;position:relative}.demo-form-wrapper:after{content:"";background:linear-gradient(90deg, var(--brand-500), var(--accent));border-radius:100px;height:3px;position:absolute;top:-1px;left:40px;right:40px}.demo-form-title{color:var(--brand-700);border-bottom:1px solid var(--neutral-100);margin-bottom:30px;padding-bottom:16px;font-size:clamp(18px,2.5vw,22px);font-weight:800}.demo-form-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (max-width:640px){.demo-form-grid{grid-template-columns:1fr}}.demo-form-group{margin-bottom:20px}.demo-form-group.full-width{grid-column:span 2}@media (max-width:640px){.demo-form-group.full-width{grid-column:span 1}}.demo-form-label{color:var(--brand-700);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:13px;font-weight:700;display:block}.demo-input-element{border:1.5px solid var(--neutral-200);border-radius:var(--radius-sm);background:var(--bg);width:100%;color:var(--text);transition:var(--transition);box-sizing:border-box;outline:none;padding:13px 18px;font-size:15px}.demo-input-element:focus{border-color:var(--accent);background:var(--bg-alt);box-shadow:0 0 0 4px #8e72bd1a}.demo-submit-btn{border-radius:var(--radius-sm);background:linear-gradient(135deg, var(--brand-500), var(--brand-600));color:#fff;cursor:pointer;width:100%;transition:var(--transition);box-shadow:var(--shadow-brand);border:none;justify-content:center;align-items:center;gap:10px;padding:15px;font-size:16px;font-weight:800;display:flex}.demo-submit-btn:hover{background:linear-gradient(135deg, var(--brand-600), var(--brand-700));box-shadow:var(--shadow-brand-lg);transform:translateY(-2px)}.demo-submit-btn:disabled{background:var(--neutral-300);box-shadow:none;cursor:not-allowed;transform:none}.demo-success-card{border-radius:var(--radius-lg);text-align:center;background:#8e72bd05;border:2px dashed #8e72bd4d;flex-direction:column;align-items:center;padding:48px 36px;animation:.5s ease-out demo-fade-in;display:flex}@keyframes demo-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.demo-success-icon{background:var(--accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin-bottom:24px;display:flex;box-shadow:0 8px 20px #8e72bd4d}.demo-success-card h3{color:var(--brand-700);margin-bottom:12px;font-size:22px;font-weight:800}.demo-success-card p{color:var(--text-muted);max-width:360px;margin:0;font-size:15px;line-height:1.7}.demo-cta-section{background:radial-gradient(circle at 10% 20%, #70529a0d 0%, transparent 35%), radial-gradient(circle at 90% 80%, #8e72bd0d 0%, transparent 35%), var(--bg-alt);border-top:1px solid var(--neutral-100);text-align:center;padding:90px 5%}.demo-cta-box{background:linear-gradient(135deg, var(--brand-700) 0%, var(--brand-900) 100%);border-radius:var(--radius-xl);color:#fff;max-width:900px;margin:0 auto;padding:72px 48px;position:relative;overflow:hidden;box-shadow:0 30px 60px #1b202340}.demo-cta-box:before{content:"";pointer-events:none;background:radial-gradient(circle at 100% 0,#8e72bd26,#0000 60%);position:absolute;inset:0}.demo-cta-box h2{color:#fff;z-index:2;margin-bottom:16px;font-size:clamp(24px,4vw,36px);font-weight:800;position:relative}.demo-cta-box p{color:#ffffffbf;z-index:2;max-width:520px;margin-bottom:36px;margin-left:auto;margin-right:auto;font-size:16px;line-height:1.7;position:relative}.demo-cta-box .btn-primary-lg{background:var(--accent);color:#fff;transition:var(--transition);z-index:2;border-radius:100px;padding:16px 36px;font-size:16px;font-weight:800;text-decoration:none;display:inline-flex;position:relative;box-shadow:0 10px 25px #8e72bd4d}.demo-cta-box .btn-primary-lg:hover{background:var(--accent-dark);transform:translateY(-3px);box-shadow:0 15px 30px #8e72bd73}@media (max-width:768px){.demo-hero{padding:100px 5% 48px}.demo-hero h1{font-size:clamp(28px,6vw,40px)}.demo-hero p{font-size:clamp(15px,3.5vw,17px)}}@media (max-width:480px){.demo-benefits-grid{grid-template-columns:1fr}.demo-benefit-card{padding:28px 20px}}
