.demo-hero{text-align:center;background:radial-gradient(circle at 12% 15%,#55c8f640,#0000 25%),radial-gradient(circle at 88% 12%,#f3a7d547,#0000 27%),linear-gradient(145deg,#f8fbff,#fff9fc);padding:74px 0 68px;position:relative;overflow:hidden}.demo-hero__inner{justify-items:center;display:grid}.demo-hero h1{color:var(--teacher-text);letter-spacing:-.045em;margin:16px 0 14px;font-size:clamp(38px,5.2vw,68px);line-height:1.08}.demo-hero h1 strong{color:#0000;background:linear-gradient(90deg,#4f46e5,#d93470);-webkit-background-clip:text;background-clip:text}.demo-hero p{max-width:760px;color:var(--teacher-muted);margin:0;font-size:16px;line-height:1.75}.demo-hero__nav{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:28px;display:flex}.demo-hero__nav a{color:#3d4b62;background:#ffffffe0;border:1px solid #4f46e51f;border-radius:999px;padding:10px 15px;font-size:11px;font-weight:900;transition:transform .2s,border-color .2s,color .2s;box-shadow:0 8px 22px #26324a12}.demo-hero__nav a:hover{color:#4f46e5;border-color:#8d6be8;transform:translateY(-2px)}.demo-page{background:#fff;gap:42px;padding:56px 0 90px;display:grid}.demo-section{background:linear-gradient(145deg,#fff,#fffafd);border:1px solid #e2e8f0e6;border-radius:32px;padding:36px;scroll-margin-top:130px;box-shadow:0 18px 52px #26324a12}.demo-heading{justify-content:space-between;align-items:end;gap:32px;margin-bottom:20px;display:flex}.demo-heading>div{flex:1}.demo-heading span{color:#8d6be8;letter-spacing:.12em;text-transform:uppercase;font-size:10px;font-weight:900}.demo-heading h2{color:var(--teacher-text);margin:7px 0 0;font-size:clamp(25px,3vw,38px);line-height:1.2}.demo-heading p{max-width:470px;color:var(--teacher-muted);margin:0;font-size:12px;line-height:1.7}.demo-action{justify-content:center;margin-bottom:26px;display:flex}.demo-register{color:#fff;border-radius:14px;justify-content:center;align-items:center;min-height:44px;padding:10px 18px;font-size:12px;font-weight:900;transition:transform .2s,box-shadow .2s;display:inline-flex;box-shadow:0 12px 26px #26324a24}.demo-register:hover{transform:translateY(-2px);box-shadow:0 17px 32px #26324a33}.demo-register--mint{background:linear-gradient(135deg,#10b981,#34d399)}.demo-register--purple{background:linear-gradient(135deg,#7e22ce,#a855f7)}.demo-register--orange{background:linear-gradient(135deg,#ea580c,#fb923c)}.demo-register--red{background:linear-gradient(135deg,#dc2626,#fb7185)}.demo-register--green{background:linear-gradient(135deg,#15803d,#4ade80)}.demo-code-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;display:grid}.demo-code-card{color:#263449;text-align:center;background:radial-gradient(circle at 100% 0,#ffffffe6,#0000 38%),linear-gradient(145deg,#f7f5ff,#eefbff);border:1px solid #4f46e51a;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;min-height:138px;padding:20px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 10px 28px #26324a0f}.demo-code-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px #26324a1f}.demo-code-card span{color:#6d28d9;letter-spacing:.1em;text-transform:uppercase;font-size:10px;font-weight:900}.demo-code-card h3{margin:7px 0 10px;font-size:16px}.demo-code-card small{color:#64748b;font-size:10px;font-weight:800}.demo-code-card--11{background:linear-gradient(145deg,#f0fdf4,#f7fffb)}.demo-code-card--11 span{color:#15803d}.demo-code-card--12{background:linear-gradient(145deg,#fff7ed,#fffaf5)}.demo-code-card--12 span{color:#c2410c}.demo-media-grid,.demo-document-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.demo-document-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.demo-document-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-document-grid article{background:#fff;border:1px solid #8d6be821;border-radius:21px;padding:12px;overflow:hidden;box-shadow:0 10px 28px #26324a0f}.demo-document-grid article>h3{color:#334155;margin:2px 5px 11px;font-size:12px}.demo-frame{aspect-ratio:16/9;background:#172235;border-radius:17px;position:relative;overflow:hidden}.demo-frame iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.demo-frame--document{aspect-ratio:4/3}.demo-feature{background:linear-gradient(145deg,#f0fdf4,#f7f5ff);border-radius:24px;grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);align-items:center;gap:28px;margin-bottom:30px;padding:24px;display:grid}.demo-feature>div:first-child>span{color:#15803d;letter-spacing:.1em;text-transform:uppercase;font-size:10px;font-weight:900}.demo-feature h3{color:var(--teacher-text);margin:7px 0;font-size:22px}.demo-feature p{color:var(--teacher-muted);font-size:12px;line-height:1.7}.demo-text-link{color:#6d28d9;background:#fff;border-radius:12px;margin-top:5px;padding:9px 13px;font-size:11px;font-weight:900;display:inline-flex;box-shadow:0 8px 20px #26324a14}.demo-subheading{color:var(--teacher-text);margin:34px 0 15px;font-size:18px}.demo-quick-links{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px;display:flex}.demo-quick-links a{color:#15803d;background:#f0fdf4;border:1px solid #15803d26;border-radius:12px;padding:9px 13px;font-size:10px;font-weight:900}.demo-quick-links a:last-child{color:#c2410c;background:#fff7ed;border-color:#ea580c26}@media (width<=900px){.demo-heading{flex-direction:column;align-items:start;gap:10px}.demo-heading p{max-width:700px}.demo-code-grid,.demo-document-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-feature{grid-template-columns:1fr}}@media (width<=600px){.demo-hero{padding:48px 0}.demo-hero h1{font-size:36px}.demo-hero p{font-size:13px}.demo-page{gap:25px;padding:34px 0 60px}.demo-section{border-radius:24px;padding:22px 16px}.demo-action{display:grid}.demo-register{text-align:center;width:100%}.demo-code-grid,.demo-media-grid,.demo-document-grid,.demo-document-grid--two{grid-template-columns:1fr}.demo-code-card{min-height:120px}.demo-feature{padding:16px}.demo-feature h3{font-size:19px}}@media (prefers-reduced-motion:reduce){.demo-hero__nav a,.demo-register,.demo-code-card{transition:none}}
