:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;font-weight:400;color-scheme:light;color:#242424;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-primary: #FF3000;--color-primary-hover: #e62a00;--color-offwhite: #F2F0EF;--color-dark: #242424}*{box-sizing:border-box}body{margin:0;padding:0;background-color:#fff;color:#242424;overflow-x:hidden}a{text-decoration:none;color:inherit}img{max-width:100%;height:auto}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#666;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#444}.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(0,0,0,.1);padding:1rem 4rem;transition:all .3s ease;display:flex;justify-content:space-between;align-items:center}.navbar .logo-container{display:flex;align-items:center;cursor:pointer;transition:transform .3s ease;flex-shrink:0}.navbar .logo-container:hover{transform:scale(1.05)}.navbar .logo-container .logo{height:45px;width:auto;min-width:45px}.navbar .navigation{display:flex;align-items:center;gap:2.5rem}.navbar .navigation .nav-links{display:flex;gap:2.5rem}@media (max-width: 768px){.navbar .navigation .nav-links.desktop-nav{display:none}}.navbar .navigation .nav-links .nav-link{color:#666;text-decoration:none;font-weight:600;font-size:1.2rem;padding:.75rem 1.25rem;border-radius:12px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;cursor:pointer}.navbar .navigation .nav-links .nav-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,48,0,.1),transparent);transition:left .5s ease}.navbar .navigation .nav-links .nav-link:hover{color:#ff3000;background:#ff300014;transform:translateY(-2px);box-shadow:0 8px 25px #ff300026}.navbar .navigation .nav-links .nav-link:hover:before{left:100%}.navbar .navigation .nav-links .nav-link:active{transform:translateY(0);transition:transform .1s ease}.navbar .navigation .mobile-menu{display:none;position:relative;z-index:1001}@media (max-width: 768px){.navbar .navigation .mobile-menu{display:block}}.navbar .navigation .mobile-menu .mobile-menu-button{background:none;border:none;cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger{width:24px;height:2px;background:red;position:relative;transition:all .3s ease}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger:before,.navbar .navigation .mobile-menu .mobile-menu-button .hamburger:after{content:"";position:absolute;width:24px;height:2px;background:red;transition:all .3s ease;left:0}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger:before{top:-6px}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger:after{bottom:-6px}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger.open{background:transparent}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger.open:before{top:0;transform:rotate(45deg)}.navbar .navigation .mobile-menu .mobile-menu-button .hamburger.open:after{bottom:0;transform:rotate(-45deg)}.navbar .navigation .mobile-menu .mobile-dropdown{position:absolute;top:100%;right:0;background:#fff;border-radius:12px;box-shadow:0 10px 30px #00000026;padding:1rem 0;min-width:200px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .3s ease;border:1px solid rgba(0,0,0,.1);z-index:1002}.navbar .navigation .mobile-menu .mobile-dropdown.open{opacity:1;visibility:visible;transform:translateY(0)}.navbar .navigation .mobile-menu .mobile-dropdown .mobile-nav-link{display:block;padding:1rem 1.5rem;color:#666;text-decoration:none;font-weight:600;font-size:1.1rem;transition:all .3s ease;border-bottom:1px solid rgba(0,0,0,.05);cursor:pointer}.navbar .navigation .mobile-menu .mobile-dropdown .mobile-nav-link:last-child{border-bottom:none}.navbar .navigation .mobile-menu .mobile-dropdown .mobile-nav-link:hover{color:#ff3000;background:#ff30000d}@media (max-width: 768px){.navbar{padding:.75rem 2rem}.navbar .logo-container .logo{height:40px;min-width:40px}.navbar .navigation{gap:1rem}.navbar .mobile-menu{display:block}}@media (max-width: 480px){.navbar{padding:.5rem 1.5rem}.navbar .logo-container .logo{height:35px;min-width:35px}}.motto-container{width:100%;min-height:85vh;padding:60px 0 40px;background:linear-gradient(135deg,#fff,#f8f9fa);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.motto-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="50" cy="50" r="1" fill="%23FF3000" opacity="0.03"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');pointer-events:none}.motto-container .hero-content{max-width:1200px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}.motto-container .hero-content .hero-text .hero-title{margin-bottom:2rem;animation:slideInLeft .8s ease-out}.motto-container .hero-content .hero-text .hero-title .hero-logo{height:90px;width:auto;filter:drop-shadow(0 8px 25px rgba(0,0,0,.1));transition:transform .3s ease}.motto-container .hero-content .hero-text .hero-title .hero-logo:hover{transform:scale(1.05)}.motto-container .hero-content .hero-text .hero-subtitle{font-size:2rem;color:#666;margin-bottom:2rem;font-weight:600;animation:slideInLeft .8s ease-out .2s both}@media (max-width: 768px){.motto-container .hero-content .hero-text .hero-subtitle.desktop-only{display:none}}.motto-container .hero-content .hero-text .hero-subtitle.mobile-only{display:none;font-size:1.7rem}@media (max-width: 768px){.motto-container .hero-content .hero-text .hero-subtitle.mobile-only{display:block}}.motto-container .hero-content .hero-text .hero-description{font-size:1.3rem;color:#666;line-height:1.8;margin-bottom:2.5rem;max-width:550px;animation:slideInLeft .8s ease-out .4s both}@media (max-width: 768px){.motto-container .hero-content .hero-text .hero-description.desktop-only{display:none}}.motto-container .hero-content .hero-text .hero-description.mobile-only{display:none;font-size:1.1rem;line-height:1.6;margin-bottom:2rem;max-width:400px}@media (max-width: 768px){.motto-container .hero-content .hero-text .hero-description.mobile-only{display:block}}.motto-container .hero-content .hero-visual{display:flex;justify-content:center;align-items:center}.motto-container .hero-content .hero-visual .app-preview{position:relative;display:flex;gap:2rem}.motto-container .hero-content .hero-visual .app-preview .preview-image-wrapper.home-wrapper{animation:slideInTop .8s ease-out .6s both}.motto-container .hero-content .hero-visual .app-preview .preview-image-wrapper.order-wrapper{animation:slideInBottom .8s ease-out .8s both}.motto-container .hero-content .hero-visual .app-preview .preview-image{height:500px;width:auto;border-radius:20px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);background:transparent;will-change:transform;cursor:pointer}.motto-container .hero-content .hero-visual .app-preview .preview-image.home{transform:rotate(-5deg)}.motto-container .hero-content .hero-visual .app-preview .preview-image.home:hover{transform:rotate(-8deg) translateY(-12px) scale(1.02)}.motto-container .hero-content .hero-visual .app-preview .preview-image.order{transform:rotate(5deg)}.motto-container .hero-content .hero-visual .app-preview .preview-image.order:hover{transform:rotate(8deg) translateY(-12px) scale(1.02)}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.7}to{transform:scale(1);opacity:1}}@media (max-width: 1024px){.motto-container{padding:40px 0 60px}.motto-container .hero-content{grid-template-columns:1fr;gap:3rem;text-align:center}.motto-container .hero-content .hero-text .hero-title .hero-logo{height:80px}.motto-container .hero-content .hero-text .hero-description{margin:0 auto 2.5rem}}@media (max-width: 768px){.motto-container{padding:100px 0 40px}.motto-container .hero-content .hero-text .hero-title .hero-logo{height:70px}.motto-container .hero-content .hero-text .hero-subtitle{font-size:1.7rem}.motto-container .hero-content .hero-text .hero-description{font-size:1.2rem}.motto-container .hero-content .hero-visual .app-preview{flex-direction:row;gap:1.5rem}.motto-container .hero-content .hero-visual .app-preview .preview-image{height:280px;cursor:pointer}.motto-container .hero-content .hero-visual .app-preview .preview-image.home{transform:rotate(-5deg)}.motto-container .hero-content .hero-visual .app-preview .preview-image.home:hover{transform:rotate(-8deg) translateY(-8px) scale(1.02)}.motto-container .hero-content .hero-visual .app-preview .preview-image.order{transform:rotate(5deg)}.motto-container .hero-content .hero-visual .app-preview .preview-image.order:hover{transform:rotate(8deg) translateY(-8px) scale(1.02)}}.body{width:100%;display:flex;justify-content:center;align-items:center;margin-top:80px}@media (max-width: 768px){.body{margin-top:0}}.features-container{padding:20px 20px 100px;background-color:#f8f9fa}@media (max-width: 768px){.features-container{padding:15px 15px 60px}}.features-content{max-width:1200px;margin:0 auto;text-align:center}.features-header{margin-bottom:80px;opacity:0;transform:translateY(-50px);transition:all .8s ease-out}.features-header.animate-in{opacity:1;transform:translateY(0)}.features-header h2{font-size:3rem;font-weight:700;color:#000}@media (max-width: 768px){.features-header h2{font-size:2.2rem;margin-bottom:0}}@media (max-width: 480px){.features-header h2{font-size:1.8rem}}@media (max-width: 768px){.features-header{margin-bottom:50px}}.features-list{display:flex;flex-direction:column;gap:80px}@media (max-width: 768px){.features-list{gap:50px}}@media (max-width: 480px){.features-list{gap:40px}}.feature-item{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;text-align:left;opacity:0;transform:translate(-100px);transition:all .8s ease-out}.feature-item.animate-in{opacity:1;transform:translate(0)}.feature-item:nth-child(2n){grid-template-columns:1fr 1fr;transform:translate(100px)}.feature-item:nth-child(2n).animate-in{transform:translate(0)}.feature-item:nth-child(2n) .feature-text{order:2}.feature-item:nth-child(2n) .feature-image{order:1}@media (max-width: 768px){.feature-item{grid-template-columns:1fr;gap:30px;text-align:center}.feature-item:nth-child(2n){grid-template-columns:1fr}.feature-item:nth-child(2n) .feature-text{order:1}.feature-item:nth-child(2n) .feature-image{order:2}}@media (max-width: 480px){.feature-item{gap:25px}}.feature-text h3{font-size:2.2rem;font-weight:600;margin-bottom:25px;color:#000}@media (max-width: 768px){.feature-text h3{font-size:1.8rem;margin-bottom:20px}}@media (max-width: 480px){.feature-text h3{font-size:1.5rem;margin-bottom:15px}}.feature-text p{font-size:1.3rem;line-height:1.7;color:#555}@media (max-width: 768px){.feature-text p{font-size:1.1rem;line-height:1.6}}@media (max-width: 480px){.feature-text p{font-size:1rem;line-height:1.5}}@media (max-width: 768px){.feature-text p.desktop-only{display:none}}.feature-text p.mobile-only{display:none}@media (max-width: 768px){.feature-text p.mobile-only{display:block}}.feature-image img{max-width:100%;height:auto;border-radius:15px;box-shadow:0 15px 40px #0000001f}@media (max-width: 768px){.feature-image img{border-radius:12px;box-shadow:0 10px 25px #0000001a}}@media (max-width: 480px){.feature-image img{border-radius:10px;box-shadow:0 8px 20px #00000014}}.feature-image:has(img[alt="API Platform"]) img{max-width:80%;margin:0 auto;display:block}@media (max-width: 768px){.feature-image:has(img[alt="API Platform"]) img{max-width:70%}}@media (max-width: 480px){.feature-image:has(img[alt="API Platform"]) img{max-width:65%}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-100vw)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100vw)}to{opacity:1;transform:translate(0)}}@keyframes slideInTop{0%{opacity:0;transform:translateY(-100vh)}to{opacity:1;transform:translateY(0)}}@keyframes slideInBottom{0%{opacity:0;transform:translateY(100vh)}to{opacity:1;transform:translateY(0)}}.contact-container{width:100%;padding:80px 0;background:linear-gradient(135deg,#fff,#f8f9fa);position:relative;overflow:hidden}.contact-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="50" cy="50" r="1" fill="%23FF3000" opacity="0.02"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');pointer-events:none}.contact-container .contact-content{max-width:1200px;margin:0 auto;padding:0 20px;position:relative;z-index:1}.contact-container .contact-content .contact-header{text-align:center;margin-bottom:4rem;opacity:0;transform:translateY(-50px);transition:all .5s ease-out}.contact-container .contact-content .contact-header.animate-in{opacity:1;transform:translateY(0)}.contact-container .contact-content .contact-header h2{font-size:2.5rem;color:#242424;margin-bottom:1rem;font-weight:700}.contact-container .contact-content .contact-header p{font-size:1.2rem;color:#666;line-height:1.6;max-width:600px;margin:0 auto}.contact-container .contact-content .contact-form-wrapper{display:flex;justify-content:center;align-items:start}.contact-container .contact-content .contact-form-wrapper .contact-form{background:#fff;padding:3rem;border-radius:20px;box-shadow:0 8px 30px #00000014;border:1px solid rgba(0,0,0,.05);max-width:600px;width:100%;opacity:0;transform:translateY(50px);transition:all .5s ease-out}.contact-container .contact-content .contact-form-wrapper .contact-form.animate-in{opacity:1;transform:translateY(0)}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group{margin-bottom:1.5rem}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:#242424;font-size:.95rem}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group input,.contact-container .contact-content .contact-form-wrapper .contact-form .form-group textarea{width:100%;padding:1rem;border:2px solid #e9ecef;border-radius:12px;font-size:1rem;transition:all .3s ease;background:#f8f9fa;color:#242424}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group input:focus,.contact-container .contact-content .contact-form-wrapper .contact-form .form-group textarea:focus{outline:none;border-color:#ff3000;background:#fff;box-shadow:0 0 0 3px #ff30001a}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group input::placeholder,.contact-container .contact-content .contact-form-wrapper .contact-form .form-group textarea::placeholder{color:#999}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group textarea{resize:vertical;min-height:120px;font-family:inherit}.contact-container .contact-content .contact-form-wrapper .contact-form .submit-btn{width:100%;padding:1rem 2rem;background:linear-gradient(135deg,#ff3000,#ff6b35);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:1rem}.contact-container .contact-content .contact-form-wrapper .contact-form .submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 25px #ff30004d}.contact-container .contact-content .contact-form-wrapper .contact-form .submit-btn:active{transform:translateY(0)}.contact-container .contact-content .contact-form-wrapper .contact-form .submit-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.contact-container .contact-content .contact-form-wrapper .contact-form .success-message,.contact-container .contact-content .contact-form-wrapper .contact-form .error-message,.contact-container .contact-content .contact-form-wrapper .contact-form .info-message{margin-top:1rem;padding:1rem;border-radius:12px;text-align:center;font-weight:500;animation:fadeIn .3s ease}.contact-container .contact-content .contact-form-wrapper .contact-form .success-message{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.contact-container .contact-content .contact-form-wrapper .contact-form .error-message{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.contact-container .contact-content .contact-form-wrapper .contact-form .info-message{background:#d1ecf1;color:#0c5460;border:1px solid #bee5eb}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 1024px){.contact-container{padding:60px 0}.contact-container .contact-content .contact-header{margin-bottom:3rem}.contact-container .contact-content .contact-header h2{font-size:2.2rem}.contact-container .contact-content .contact-form-wrapper{grid-template-columns:1fr;gap:3rem}}@media (max-width: 768px){.contact-container{padding:40px 0}.contact-container .contact-content .contact-header{margin-bottom:2.5rem}.contact-container .contact-content .contact-header h2{font-size:2rem}.contact-container .contact-content .contact-header p{font-size:1.1rem}.contact-container .contact-content .contact-form-wrapper{gap:2rem}.contact-container .contact-content .contact-form-wrapper .contact-form{padding:2rem}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group{margin-bottom:1.25rem}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group input,.contact-container .contact-content .contact-form-wrapper .contact-form .form-group textarea{padding:.875rem}}@media (max-width: 480px){.contact-container .contact-content .contact-form-wrapper .contact-form{padding:1.5rem}.contact-container .contact-content .contact-form-wrapper .contact-form .form-group input,.contact-container .contact-content .contact-form-wrapper .contact-form .form-group textarea{padding:.75rem;font-size:.95rem}.contact-container .contact-content .contact-form-wrapper .contact-form .submit-btn{padding:.875rem 1.5rem;font-size:1rem}}#root{margin:0 auto;text-align:center}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8f9fa}.app{display:flex;flex-direction:column;align-items:center;min-height:100vh}.container{max-width:1200px;margin:0 auto;padding:0 20px}
