@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Jost:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap";
:root{--primary:#4361ee;--secondary:#14b8a6;--bg-base:#f8fafc;--text-main:#0f172a;--text-muted:#64748b;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--glass-bg:#ffffffb3;--glass-border:#fff6;--glass-shadow:0 8px 32px 0 #1f268712}.sympo-landing p{margin-top:1em;margin-bottom:1em}.sympo-landing h1,.sympo-landing h2,.sympo-landing h3,.sympo-landing h4,.sympo-landing h5,.sympo-landing h6{margin-top:.83em;margin-bottom:.83em;font-weight:700}.sympo-landing h1{font-size:2em}.sympo-landing h2{font-size:1.5em}.sympo-landing h3{font-size:1.17em}.sympo-landing ul{margin-top:1em;margin-bottom:1em;padding-left:40px;list-style-type:disc}.sympo-landing button,.sympo-landing input,.sympo-landing select,.sympo-landing textarea{font-family:inherit;font-size:100%}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;max-width:100%;overflow-x:hidden}.sympo-landing{background-color:var(--bg-base);color:var(--text-main);width:100%;max-width:100%;font-family:Inter,sans-serif;line-height:1.6;position:relative;overflow-x:hidden}.sympo-landing h1,.sympo-landing h2,.sympo-landing h3,.sympo-landing h4,.sympo-landing h5,.sympo-landing h6{color:var(--text-main);font-family:Outfit,sans-serif}.sympo-landing a:not(.btn){color:inherit;text-decoration:none}.sympo-landing ::placeholder{color:#94a3b8!important;opacity:1!important}.sympo-landing :focus-visible{outline:3px solid var(--primary);outline-offset:3px;border-radius:4px}.sympo-container{max-width:1200px;margin:0 auto;padding:0 2rem}.text-primary{color:var(--primary)}.text-secondary{color:var(--secondary)}.btn{cursor:pointer;border:none;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.875rem 1.5rem;font-family:Inter,sans-serif;font-size:1rem;font-weight:600;transition:all .3s;display:inline-flex}.btn-primary{background-color:var(--primary);color:#fff;box-shadow:0 4px 14px #4361ee4d}.btn-primary:hover{background-color:#314ecc;transform:translateY(-2px);box-shadow:0 6px 20px #4361ee66}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:1rem}.dark-mockup{color:#fff;background:#0b1120;border:1px solid #ffffff1a;border-radius:1.5rem;overflow:hidden;box-shadow:0 25px 50px -12px #00000080}header{z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f8fafccc;border-bottom:1px solid #0000000d;padding:1.5rem 0;position:sticky;top:0}.nav-container{justify-content:space-between;align-items:center;display:flex}.lang-selector{align-items:center;gap:1rem;margin-right:1rem;display:flex}.sympo-landing a.lang-link{color:var(--text-muted);opacity:.7;align-items:center;gap:.25rem;font-size:.85rem;font-weight:500;transition:all .3s;display:flex}.sympo-landing a.lang-link:hover{opacity:1;color:var(--primary)}.sympo-landing a.lang-link.active{color:var(--primary);opacity:1;font-weight:600}.logo{letter-spacing:-.5px;color:var(--primary);align-items:center;gap:.5rem;font-family:Outfit,sans-serif;font-size:1.5rem;font-weight:800;display:flex}.hero{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;padding-block:6rem;display:grid;position:relative}.hero.center-layout{text-align:center;grid-template-columns:1fr;padding-bottom:0}.hero.center-layout .hero-content p{margin:0 auto 2rem}.hero.center-layout .hero-mockup{max-width:1000px;margin-top:3rem;margin-left:auto;margin-right:auto;transform:none}.split-layout{min-height:100vh;display:flex}.split-left{background-color:var(--primary);color:#fff;flex-direction:column;flex:1;justify-content:center;padding:4rem;display:flex}.split-left h1,.split-left p{color:#fff}.split-right{background:#fff;flex:1;justify-content:center;align-items:center;padding:4rem;display:flex}.split-right .hero-mockup{transform:perspective(1000px)rotateY(-5deg)rotateX(2deg)}.hero-content{flex-direction:column;align-items:flex-start;gap:1.5rem;display:flex}.hero-content h1{letter-spacing:-1px;margin-bottom:0;font-size:3.5rem;font-weight:800;line-height:1.1}.hero-content p{color:var(--text-muted);max-width:90%;margin-bottom:0;font-size:1.25rem}@keyframes float{0%{transform:perspective(1000px)rotateY(-10deg)rotateX(5deg)translateY(0)}50%{transform:perspective(1000px)rotateY(-8deg)rotateX(4deg)translateY(-20px)}to{transform:perspective(1000px)rotateY(-10deg)rotateX(5deg)translateY(0)}}.hero-mockup{z-index:10;transition:transform .5s;animation:6s ease-in-out infinite float;position:relative;transform:perspective(1000px)rotateY(-10deg)rotateX(5deg)}.hero-mockup:hover{animation-play-state:paused;transform:perspective(1000px)rotateY(-5deg)rotateX(2deg)scale(1.02)}.mockup-header{border-bottom:1px solid #ffffff1a;align-items:center;gap:.5rem;padding:1rem;display:flex}.mockup-dot{border-radius:50%;width:12px;height:12px}.dot-red{background:#ff5f56}.dot-yellow{background:#ffbd2e}.dot-green{background:#27c93f}.mockup-body{flex-direction:column;gap:1.5rem;min-height:350px;padding:2rem;display:flex}.mockup-chart{height:120px;color:var(--primary);background:linear-gradient(#4361ee33 0%,#4361ee00 100%);border:1px dashed #4361ee80;border-radius:.5rem;justify-content:center;align-items:center;font-weight:600;display:flex}.mockup-row{gap:1rem;display:flex}.mockup-card{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:.5rem;flex:1;padding:1rem}.mockup-card-title{color:var(--text-muted);margin-bottom:.5rem;font-size:.875rem}.mockup-card-value{font-family:Outfit,sans-serif;font-size:1.5rem;font-weight:700}@keyframes pulseBlob{0%{opacity:.8;transform:scale(1)translate(0)}33%{opacity:1;transform:scale(1.1)translate(20px,-20px)}66%{opacity:.9;transform:scale(.9)translate(-20px,20px)}to{opacity:.8;transform:scale(1)translate(0)}}.bg-blob{z-index:0;pointer-events:none;background:radial-gradient(circle,#14b8a626 0%,#f8fafc00 70%);border-radius:50%;width:500px;height:500px;animation:10s ease-in-out infinite pulseBlob;position:absolute;top:10%;right:5%}.social-proof{background:#fff;border-top:1px solid #0000000d;border-bottom:1px solid #0000000d;padding:3rem 0}.social-proof p{text-align:center;text-transform:uppercase;letter-spacing:2px;color:var(--text-muted);margin-bottom:1.5rem;font-size:.875rem;font-weight:600}.logos{opacity:.6;filter:grayscale();flex-wrap:wrap;justify-content:center;gap:4rem;transition:all .3s;display:flex}.logos:hover{opacity:.8;filter:grayscale(50%)}.logo-placeholder{color:var(--text-main);font-family:Outfit,sans-serif;font-size:1.25rem;font-weight:700}.features{padding-block:6rem}.section-header{text-align:center;flex-direction:column;gap:1rem;margin-bottom:4rem;display:flex}.section-header h2{margin-bottom:0;font-size:2.5rem;font-weight:700}.bento-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem;display:grid}.bento-item{background:#fff;border:1px solid #0000000d;border-radius:1.5rem;flex-direction:column;gap:1rem;padding:2.5rem;transition:all .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d}.bento-item:hover{border-color:#14b8a64d;transform:translateY(-8px)scale(1.01);box-shadow:0 25px 30px -5px #00000026}.bento-large{background:linear-gradient(135deg, var(--primary) 0%, #314ecc 100%);color:#fff;grid-column:span 2}.bento-large h3,.bento-large p{color:#fff}.feature-icon{border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:0;display:flex}.icon-blue{color:var(--primary);background:#4361ee1a}.icon-teal{color:var(--secondary);background:#14b8a61a}.icon-white{color:#fff;background:#fff3}.bento-item h3{margin-bottom:0;font-size:1.5rem;font-weight:700}.bento-item p{color:var(--text-muted);margin-bottom:0}.tabs-section{background:#fff;border-top:1px solid #0000000d;padding-block:6rem}.tabs-container{grid-template-columns:1fr 1fr;align-items:stretch;gap:4rem;display:grid}.tabs-nav{flex-direction:column;justify-content:space-between;gap:1rem;display:flex}.tab-btn{text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:1rem;padding:1.5rem;font-family:Inter,sans-serif;transition:all .3s}.tab-btn h4{color:var(--text-main);margin-bottom:.5rem;font-family:Outfit,sans-serif;font-size:1.25rem;font-weight:700}.tab-btn p{color:var(--text-muted)}.tab-btn:hover{background:#f8fafc80}.tab-btn.active{background:var(--bg-base);border-color:#0000000d;box-shadow:0 4px 6px -1px #0000000d}.tab-content{background:var(--bg-base);border:1px solid #0000000d;border-radius:1.5rem;position:relative;overflow:hidden}.tab-pane{opacity:0;visibility:hidden;text-align:center;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:3rem;transition:all .5s;display:flex;position:absolute;top:0;left:0;transform:translate(20px)}.tab-pane.active{opacity:1;visibility:visible;transform:translate(0)}.tab-pane-icon{width:80px;height:80px;color:var(--primary);background:#fff;border-radius:50%;justify-content:center;align-items:center;margin-bottom:2rem;display:flex;box-shadow:0 10px 15px -3px #0000001a}.cta-section{text-align:center;background:linear-gradient(135deg, var(--primary) 0%, #14b8a6 100%);color:#fff;padding-block:6rem;position:relative}.cta-section h2{color:#fff;margin-bottom:1rem;font-size:3rem}.cta-section p{opacity:.9;margin-bottom:3rem;font-size:1.25rem}.form-container{text-align:left;background:#fff;border-radius:1.5rem;max-width:500px;margin:0 auto;padding:3rem;box-shadow:0 25px 50px -12px #00000040}#demo-form{flex-direction:column;gap:1.5rem;display:flex}.form-group{flex-direction:column;gap:.5rem;margin-bottom:0;display:flex}.form-group label{color:var(--text-main);margin-bottom:0;font-weight:500;display:block}.form-group input{border:1px solid #0000001a;border-radius:.5rem;width:100%;padding:.875rem 1rem;font-family:Inter,sans-serif;transition:all .3s}.form-group input:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #4361ee33}.btn-block{width:100%;margin-top:1rem}.micro-copy{color:var(--text-muted);text-align:center;justify-content:center;align-items:center;gap:.5rem;margin-top:1.5rem;font-size:.875rem;display:flex}.hero-interactive{z-index:10;width:100%;max-width:650px;margin-left:auto;transition:transform .5s;position:relative;transform:perspective(1000px)rotateY(-5deg)rotateX(2deg);box-shadow:0 25px 50px -12px #00000080}.hero-interactive:hover{transform:perspective(1000px)rotateY(0)rotateX(0)scale(1.02)}.mockup-interactive-body{background:#0b1120f2;border-radius:0 0 1.5rem 1.5rem;height:380px;display:flex;overflow:hidden}.mockup-sidebar{background:#ffffff08;border-right:1px solid #ffffff0d;flex-direction:column;gap:.5rem;width:200px;padding:1rem;display:flex}.sidebar-title{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:.5rem;font-size:.75rem;font-weight:600}.student-item{cursor:pointer;border:1px solid #0000;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:all .2s;display:flex}.student-item:hover{background:#ffffff0d}.student-item.active{background:#ffffff14;border-color:#ffffff1a}.student-avatar{border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:.85rem;font-weight:700;display:flex}.student-info{flex-direction:column;display:flex}.student-name{color:#fff;font-size:.85rem;font-weight:600}.student-status{font-size:.7rem;font-weight:500}.mockup-main{flex-direction:column;flex:1;padding:1.5rem;display:flex}.report-header{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;padding-bottom:1rem;display:flex}.report-metrics{gap:1.5rem;display:flex}.metric{flex-direction:column;display:flex}.metric-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-size:.7rem}.metric-value{font-family:Outfit,sans-serif;font-size:1.25rem;font-weight:700}.report-badge{border-radius:1rem;padding:.25rem .75rem;font-size:.75rem;font-weight:600}.chat-log{flex-direction:column;gap:.75rem;padding-right:.5rem;display:flex;overflow-y:auto}.chat-bubble{border-radius:1rem;max-width:85%;padding:.75rem 1rem;font-size:.85rem;line-height:1.4;animation:.3s forwards fadeUp}.chat-bubble.user{color:#fff;background:#ffffff1a;border-bottom-left-radius:.25rem;align-self:flex-start}.chat-bubble.ai{color:#fff;background:#4361ee33;border:1px solid #4361ee4d;border-bottom-right-radius:.25rem;align-self:flex-end}.mockup-play-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#ffffffb3;cursor:pointer;z-index:20;background:#ffffff14;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .25s;animation:.3s forwards fadeUp;display:flex;position:absolute;bottom:1rem;right:1rem}.mockup-play-btn:hover{color:#fff;background:#4361ee4d;border-color:#4361ee80;transform:scale(1.1)}@media (max-width:992px){.hero{text-align:center;grid-template-columns:1fr;gap:2rem}.hero-content{align-items:center}.hero-content p{margin:0 auto}.bento-grid{grid-template-columns:1fr}.bento-large{grid-column:span 1}.tabs-container{grid-template-columns:1fr;gap:2rem}.split-layout{flex-direction:column}}@media (max-width:768px){.sympo-container{padding:0 1.5rem}.hero{padding-block:4rem}.nav-container .cta-primary{display:none}.hero-content h1{word-break:break-word;-webkit-hyphens:auto;hyphens:auto;font-size:2.25rem}.hero-content p{font-size:1.125rem}.section-header h2{word-break:break-word;font-size:2rem}.features{padding-block:4rem}.bento-item{padding:1.5rem}.hero-interactive{margin-top:2rem;transform:perspective(1000px)rotateY(0)rotateX(0)}.hero-interactive:hover{transform:perspective(1000px)rotateY(0)rotateX(0)scale(1.02)}.mockup-sidebar{width:130px;padding:.5rem}.student-item,.student-item.active{gap:.5rem;padding:.5rem}.student-avatar,.student-item.active .student-avatar{width:24px;height:24px;font-size:.75rem}.student-name,.student-item.active .student-name{font-size:.75rem}.student-status,.student-item.active .student-status{font-size:.65rem}.mockup-main{padding:.75rem;overflow:hidden}.report-header{flex-direction:column;align-items:flex-start;gap:.5rem}.metric-value{word-break:break-word;-webkit-hyphens:auto;hyphens:auto;font-size:.9rem}.chat-bubble{padding:.5rem .75rem;font-size:.75rem}.report-badge{padding:.2rem .5rem;font-size:.65rem}.mockup-header{justify-content:center;padding:.75rem}.tab-pane,.form-container{padding:1.5rem}.tabs-section,.cta-section{padding-block:4rem}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-up{opacity:0;animation:.8s forwards fadeUp}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}