*{margin:0;padding:0;box-sizing:border-box;} body{font-family:'DM Sans',sans-serif;color:#222;line-height:1.6;background:#f5f5f5 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1280" height="537" fill="none" viewBox="0 0 1280 537"><g stroke="%239d2800" stroke-opacity=".15"><path d="m1278 316-40.74 40.743a6 6 0 0 1-4.25 1.757h-74.52c-1.6 0-3.12.632-4.25 1.757l-55.98 55.986a5.98 5.98 0 0 0-1.76 4.242V536.5"/><circle cx="1132.5" cy="242.5" r="5.5"/><circle cx="1055.5" cy="359.5" r="5.5"/><path d="M1055.5 365v110"/><circle cx="5.5" cy="5.5" r="5.5" transform="matrix(0 -1 -1 0 1061 344)"/><circle cx="5.5" cy="5.5" r="5.5" transform="matrix(0 -1 -1 0 1117 248)"/><path d="M1138 242.5h49.01c1.6 0 3.12-.632 4.25-1.757L1216 216l63-63M1106 242.5h-21.01c-1.6 0-3.12.632-4.25 1.757l-23.98 23.986a5.98 5.98 0 0 0-1.76 4.242V332.5"/><path d="m1252 1-68.24 68.243a6 6 0 0 1-4.25 1.757h-36.02c-1.6 0-3.12.632-4.25 1.757l-122.48 122.486a5.98 5.98 0 0 0-1.76 4.242v98.03c0 1.591-.63 3.117-1.76 4.242l-22.483 22.486a6 6 0 0 0-1.757 4.242V465.5M2 316l40.743 40.743a6 6 0 0 0 4.242 1.757h74.53a6 6 0 0 1 4.242 1.757l55.986 55.986a6 6 0 0 1 1.757 4.242V536.5M28 1l68.243 68.243A6 6 0 0 0 100.485 71h36.03c1.591 0 3.117.632 4.242 1.757l122.486 122.486a6 6 0 0 1 1.757 4.242v98.03a6 6 0 0 0 1.757 4.242l22.486 22.486a6 6 0 0 1 1.757 4.242V465.5"/><circle cx="5.5" cy="5.5" r="5.5" transform="matrix(-1 0 0 1 153 237)"/><circle cx="5.5" cy="5.5" r="5.5" transform="matrix(-1 0 0 1 230 354)"/><path d="M224.5 365v110"/><circle cx="224.5" cy="338.5" r="5.5" transform="rotate(-90 224.5 338.5)"/><circle cx="168.5" cy="242.5" r="5.5" transform="rotate(-90 168.5 242.5)"/><path d="M142 242.5H92.985a6 6 0 0 1-4.242-1.757L64 216 1 153M174 242.5h21.015a6 6 0 0 1 4.242 1.757l23.986 23.986a6 6 0 0 1 1.757 4.242V332.5"/><circle cx="34.5" cy="40.5" r="5.5" transform="rotate(-90 34.5 40.5)"/><circle cx="49.5" cy="54.5" r="5.5" transform="rotate(-90 49.5 54.5)"/><circle cx="1244.5" cy="39.5" r="5.5"/><circle cx="1230.5" cy="54.5" r="5.5"/></g></svg>');} .pc_hidden{display:none;} .pb-30{padding-bottom:30px!important;} .padding-30{padding:30px 0!important;} .mb-50{margin-bottom:50px!important;} .overflow_hidden{overflow:hidden;} .set_animated .anime{transform:translateY(50%);transition:transform .5s ease,opacity .5s ease!important;opacity:0;} .anime_big{transform:translateY(120%);transition:transform .5s ease,opacity .5s ease;opacity:0;} .animated{opacity:1;transform:translateY(0);} .features_content{max-width:1200px;width:100%;margin:0 auto;display:flex;margin-top:30px;} .features_content .features_sidebar{width:25%;padding-top:5px;} .features_content .features_sidebar ul{display:flex;width:100%;flex-direction:column;gap:4px;} .features_content .features_sidebar ul li{display:flex;list-style:none;width:100%;} .features_content .features_sidebar ul li a{color:#222;text-decoration:none;padding:6px 12px;font-size:14px;border-radius:4px;min-width:170px;} .features_content .features_sidebar ul li a:hover{color:#000;font-weight:500;} .features_content .features_sidebar ul li a.active{background-color:#E6EAEF;font-weight:500;} .feature_area{display:flex;flex-direction:column;width:100%;background-color:#fff;border-radius:15px;} .feature_area .page{display:flex;flex-direction:column;width:100%;padding:0 30px;} .feature_area p{font-size:16px;color:#555;line-height:150%;margin-bottom:15px;} .feature_area h2{font-size:22px;margin-bottom:10px;} .feature_area ul{display:flex;width:100%;flex-direction:column;} .feature_area ul li{margin-left:20px;list-style:circle;} .breadcrumb{display:flex;width:100%;padding-top:50px;} .breadcrumb ul{display:flex;width:100%;gap:10px;} .breadcrumb ul li{display:flex;list-style:none;color: #555; text-decoration: none; font-size: 14px;} .breadcrumb ul li a{display:flex;color:#555;text-decoration:none;font-size:14px;position:relative;gap:10px;align-items:center;} .breadcrumb ul li a svg{width:13px;height:13px;position:relative;top:-1px;} .breadcrumb li:last-child a::after{content:none;} .breadcrumb li a::after{content:">";position:relative;right:0;top:45%;transform:translateY(-50%);font-size:14px;color:#555;} .container{width:100%;max-width:1200px;margin:0 auto;} .page_title{display:flex;width:100%;padding-top:30px;} .ai_badge{display:inline-flex;align-items:center;justify-content:center;padding:2px 10px;background:linear-gradient(135deg,#8b5cf6 0%,#6366f1 100%);color:#fff;font-size:20px;font-weight:700;border-radius:4px;text-transform:uppercase;letter-spacing:.3px;} .hand_shake{display:flex;} .hand_shake svg path{fill:#8b5cf6;} .hand_shake svg{width:40px;height:40px;rotate:-45deg;position:relative;top:2px;left:1px;} .flex_title_area{display:flex;align-items:center;justify-content:center;gap:11px;} .top-banner{background:#222;color:#fff;text-align:center;padding:12px 20px;font-size:14px;} .top-banner a{font-weight:600;text-decoration:underline;text-rendering:optimizeLegibility!important;-webkit-font-smoothing:antialiased!important;background:linear-gradient(85deg,#c583e0 0%,#2563eb 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:#fff;} .top-banner a:hover{opacity:.8;} .header{display:flex;justify-content:space-between;padding:0 30px;background:#fff;position:sticky;top:0;z-index:100;box-shadow:0 2px 10px rgba(0,0,0,.05);width:1200px;margin:0 auto;border-radius:15px;margin-top:30px;align-items:center;} .logo{display:flex;position:relative;top:-2px;} .logo a{display:flex;width:100px;} .logo svg{width:100px;accent-color:aliceblue;} .nav{display:flex;gap:25px;position:relative;top:1px;} .nav a{text-decoration:none;color:#000;font-weight:400;font-size:16px;transition:color .2s;padding:30px 0;line-height:100%;} .nav a:hover,.nav a.active{color:#2563eb;} .nav a.active{font-weight:500;} .header-buttons{display:flex;gap:12px;align-items:center;} .btn{padding:10px 20px;border-radius:10px;font-weight:500;font-size:14px;cursor:pointer;transition:all .2s;text-decoration:none;} .btn-outline{border:1px solid #e0e0e0;background:#fff;color:#555;} .btn-outline:hover{border-color:#000;} .btn-arrow{display:inline-flex;align-items:center;gap:0;overflow:hidden;} .btn-arrow .arrow-icon{width:0;height:14px;fill:currentColor;opacity:0;transform:translateX(-10px);transition:all .3s ease;} .btn-arrow:hover .arrow-icon{width:16px;opacity:1;transform:translateX(0);margin-left:8px;} .btn-primary{background:#222;color:#fff;border:1px solid #222;} .btn-primary:hover{background:#333;} .btn-snake{position:relative;background:#222;color:#fff;border:none;padding:12px 24px;border-radius:10px;font-weight:500;font-size:14px;cursor:pointer;text-decoration:none;z-index:1;overflow:hidden;} .btn-snake::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:conic-gradient(from 0deg,transparent 0deg,transparent 60deg,#c583e0 60deg,#2563eb 120deg,transparent 120deg,transparent 360deg);border-radius:12px;z-index:-2;animation:snakeRotate 2.5s linear infinite;} .btn-snake::after{content:'';position:absolute;top:2px;left:2px;right:2px;bottom:2px;background:#000;border-radius:8px;z-index:-1;} .btn-snake:hover::after{background:#1a1a1a;} @keyframes snakeRotate{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}} .hero{text-align:center;padding:80px 20px 60px;max-width:900px;margin:0 auto;padding-bottom:15px;} .hero h1{font-size:48px;font-weight:700;line-height:120%;margin-bottom:25px;} .hero-line{display:block;} .highlight{text-rendering:optimizeLegibility!important;-webkit-font-smoothing:antialiased!important;background:linear-gradient(85deg,#c583e0 0%,#2563eb 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;} .hero-buttons{display:flex;gap:16px;justify-content:center;margin-bottom:50px;} .hero-stats{font-size:14px;color:#888;} .hero-stats span{color:#000;font-weight:600;} .hero p{font-size:17px;color:#222;margin-bottom:30px;} .dashboard-preview{max-width:1100px;margin:0 auto;margin-bottom:100px;} .dashboard-preview img{width:100%;height:auto;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.15);border:1px solid #e0e0e0;} .dashboard-placeholder{width:100%;height:500px;background:linear-gradient(135deg,#f5f5f5 0%,#e8e8e8 100%);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.1);border:1px solid #e0e0e0;display:flex;align-items:center;justify-content:center;color:#999;font-size:18px;} .section{padding:80px 0;} .section-white{background:#fff;} .section-navy{background-color:#00093c;} .section-navy .btn-primary{background-color:#fff;color:#00093c;} .section-navy .section-title h2{color:#fff;} .section-navy .faq-question{color:#fff;} .section-navy .faq-answer p{color:#fff;} .section-gray{background:#f5f5f5;} .section-title{margin-bottom:30px;text-align:center;} .section-title h2{font-size:42px;font-weight:bold;margin-bottom:0;color:#222;} .section-title p{font-size:18px;color:#222;} .workflow{display:flex;gap:80px;max-width:1200px;margin:0 auto;align-items:center;padding:35px 0;} .workflow-content{flex:1;} .workflow-cta{text-align:center;margin-top:50px;} .workflow-item{display:flex;align-items:flex-start;gap:15px;margin-bottom:24px;cursor:pointer;transition:all .3s ease;} .workflow-item:last-child{margin-bottom:0;} .workflow-number{font-size:24px;color:#595959;padding-top:20px;flex-shrink:0;transition:color .3s ease;width:40px;text-align:center;} .workflow-item.active .workflow-number{color:#000;font-weight:600;} .workflow-item-content{padding:15px 20px;border-left:2px solid #e0e0e0;border-radius:0 12px 12px 0;transition:all .3s ease;flex:1;} .workflow-item.active .workflow-item-content{border-left-color:#000;background:#fff;} .workflow-item h3{font-size:28px;font-weight:600;} .workflow-item p{color:#666;font-size:16px;line-height:1.5;} .workflow-item.active p{color:#222;font-size:16px;} .workflow-image{flex:1;position:relative;width:100%;height:600px;} .workflow-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.1);opacity:0;transform:scale(.98);transition:opacity .4s ease,transform .4s ease;pointer-events:none;} .workflow-img.active{opacity:1;transform:scale(1);pointer-events:auto;} .workflow-image-placeholder{width:100%;height:400px;background:#fff;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.1);border:1px solid #e0e0e0;} .feature-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:900px;margin:0 auto;} .feature-card{background:#fff;padding:40px;border-radius:16px;border:1px solid #e0e0e0;transition:box-shadow .3s;} .feature-card:hover{box-shadow:0 10px 40px rgba(0,0,0,.08);} .feature-icon{width:48px;height:48px;background:#f0f0f0;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;font-size:24px;} .feature-card h3{font-size:20px;font-weight:600;margin-bottom:12px;} .feature-card p{color:#666;font-size:15px;} .features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;max-width:1200px;margin:0 auto;} .feature-item{background:#fff;padding:20px;border-radius:12px;display:flex;gap:20px;transition:all .3s ease;box-shadow:4px 4px 20px rgba(0,0,0,.08);align-items:flex-start;cursor:pointer;} .feature-item:hover{border-color:#000;box-shadow:0 8px 30px rgba(0,0,0,.08);transform:translateY(-4px);} .feature-icon-wrapper{width:48px;height:48px;min-width:48px;background:#f5f5f5;border-radius:12px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;} .feature-item:hover .feature-icon-wrapper{background:#000;color:#fff!important;} .feature-item:hover .feature-icon-wrapper svg path{fill:#fff;} .feature-icon-wrapper svg{width:22px;height:22px;} .feature-content{flex:1;} .feature-item h3{font-size:17px;font-weight:600;margin-bottom:3px;} .feature-item p{color:#666;font-size:14px;line-height:1.6;margin-bottom:14px;} .feature-tags{display:flex;gap:8px;} .tag{font-size:11px;padding:4px 10px;border-radius:4px;font-weight:600;} .tag-free{background:#e8e8e8;color:#333;} .tag-premium{background:#000;color:#fff;} .pricing-header{text-align:center;margin-bottom:50px;} .pricing-badge{display:inline-block;background:#d1f4e0;color:#059669;font-size:13px;font-weight:500;padding:8px 18px;border-radius:50px;margin-bottom:16px;} .pricing-main-title{font-size:40px;font-weight:400;line-height:1.3;color:#111;} .pricing-features-section{max-width:1200px;margin:0 auto;} .features-title{font-size:15px;font-weight:500;color:#6b7280;margin-bottom:30px;} .table-header{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:0;margin-bottom:20px;} .header-plan{text-align:center;padding:24px 16px;background:#f8f9fa;border-radius:12px 12px 0 0;height:180px;} .header-plan.featured{background:#1a1a1a;color:#fff;transform:translateY(-8px);padding:32px 16px;position:relative;height:190px;} .plan-name{font-size:16px;font-weight:600;margin-bottom:8px;color:#111;} .header-plan.featured .plan-name{color:#fff;} .plan-price{font-size:24px;font-weight:800;margin-bottom:16px;letter-spacing:-1px;display:flex;align-items:center;justify-content:center;gap:5px;} .plan-price span{font-size:14px;font-weight:400;color:#6b7280;} .header-plan.featured .plan-price span{color:rgba(255,255,255,.6);} .plan-buy-btn{display:inline-flex;align-items:center;justify-content:center;gap:0;overflow:hidden;width:100%;padding:10px 16px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;text-align:center;transition:all .2s ease;background:#fff;color:#111;border:1px solid #e5e7eb;} .plan-buy-btn .arrow-icon{width:0;height:12px;fill:currentColor;opacity:0;transform:translateX(-10px);transition:all .3s ease;} .plan-buy-btn:hover .arrow-icon{width:14px;opacity:1;transform:translateX(0);margin-left:6px;} .plan-buy-btn:hover{background:#f3f4f6;} .header-plan.featured .plan-buy-btn{background:#fff;color:#333;border:none;} .header-plan.featured .plan-buy-btn:hover{opacity:.9;} .features-table{background:#fff;border:1px solid #f0f0f0;border-radius:0 0 12px 12px;} .feature-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;align-items:center;border-bottom:1px solid #f0f0f0;padding:16px;} .feature-row:last-child{border-bottom:none;} .feature-name{font-size:14px;color:#6b7280;padding-right:20px;} .feature-value{text-align:center;font-size:14px;color:#111;} .feature-value.featured-col{background:#fafafa;margin:-16px 0;padding:16px 0;} .check-icon{width:20px;height:20px;color:#111;} .check-icon.disabled{color:#d1d5db;} .faq-list{max-width:700px;margin:0 auto;} .faq-item{border-bottom:1px solid #e0e0e0;padding:24px 0;} .faq-question{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:21px;font-weight:500;transition:color .3s ease;} .faq-question:hover{color:#666;} .faq-question span{font-size:24px;color:#999;transition:transform .3s ease;font-weight:300;} .faq-item.active .faq-question span{transform:rotate(45deg);} .faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease;padding:0;} .faq-item.active .faq-answer{max-height:300px;padding-top:16px;} .faq-answer p{color:#666;font-size:16px;line-height:1.7;margin:0;} .partners-section{background:#fff;padding:40px 0;overflow:hidden;} .partners-slider{position:relative;width:100%;overflow:hidden;} .partners-track{display:flex;gap:70px;align-items:center;animation:scroll 30s linear infinite;width:max-content;} @keyframes scroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}} .partner-logo{flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:opacity .3s ease;} .partner-logo:hover{opacity:1;} .partner-logo svg{height:30px;width:auto;} .partner-logo svg path,.partner-logo svg circle,.partner-logo svg ellipse{fill:#cbcbcb!important;} .cta{text-align:center;padding:60px 0;background:#000;color:#fff;} .cta h2{font-size:42px;margin-bottom:5px;} .cta p{font-size:18px;margin-bottom:30px;} .cta .btn-primary{background:#fff;color:#000;border-color:#fff;} .cta .btn-primary:hover{background:#f0f0f0;} .footer{border-top:1px solid #eee;padding:50px 0;} .footer-content{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;max-width:1200px;margin:0 auto;} .footer-brand{width:350px;} .footer-brand svg{width:100px;} .footer-brand p{color:#666;margin-top:16px;font-size:14px;} .app-buttons{display:flex;gap:10px;margin-top:20px;} .app-btn{display:inline-block;transition:opacity .2s ease,transform .2s ease;} .app-btn img{height:40px;width:auto;} .app-btn:hover{opacity:.8;transform:translateY(-2px);} .footer-links strong{display:block;font-size:14px;font-weight:600;margin-bottom:20px;} .footer-links a{display:block;color:#555;text-decoration:none;font-size:15px;margin-bottom:8px;} .footer-links a:hover{color:#000;} .footer-bottom{max-width:1200px;margin:40px auto 0;padding-top:20px;border-top:1px solid #eee;font-size:13px;color:#999;} .hamburger{display:none;flex-direction:column;justify-content:center;align-items:center;width:40px;height:40px;background:transparent;border:none;cursor:pointer;padding:0;z-index:1001;position:relative;} .hamburger-line{display:block;width:24px;height:2px;background-color:#000;border-radius:2px;transition:all .3s ease;position:absolute;} .hamburger-line:nth-child(1){transform:translateY(-8px);} .hamburger-line:nth-child(2){transform:translateY(0);} .hamburger-line:nth-child(3){transform:translateY(8px);} .hamburger.active .hamburger-line:nth-child(1){transform:translateY(0) rotate(45deg);} .hamburger.active .hamburger-line:nth-child(2){opacity:0;} .hamburger.active .hamburger-line:nth-child(3){transform:translateY(0) rotate(-45deg);} .mobile-menu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#fff;z-index:1000;padding:100px 30px 40px;flex-direction:column;opacity:0;visibility:hidden;transition:all .3s ease;} .mobile-menu.active{opacity:1;visibility:visible;} .mobile-nav{display:flex;flex-direction:column;gap:0;} .mobile-nav a{font-size:20px;font-weight:500;color:#000;text-decoration:none;padding:16px 0;border-bottom:1px solid #eee;transition:color .2s;} .mobile-nav a:hover,.mobile-nav a.active{color:#2563eb;} .mobile-buttons{display:flex;flex-direction:column;gap:12px;margin-top:30px;} .mobile-buttons .btn{text-align:center;padding:14px 24px;} @media(max-width:1250px){.header{width:85%;}} @media(max-width:1065px){.header{height:76px;} .hamburger{display:flex;} .nav,.header-buttons{display:none;} .mobile-menu{display:flex;}} @media screen and (max-width:1024px){.mobile_hidden{display:none!important;} .pc_hidden{display:flex!important;} .container{max-width:100%;}} @media(max-width:1024px){.feature-area{max-width:100%;} .section{padding:60px 40px;} .features-grid,.pricing-cards{grid-template-columns:repeat(2,1fr);} .workflow{flex-direction:column;padding-top:0;width:100%;padding-bottom:0;margin-bottom:0;gap:30px;} .workflow-item h3{font-size:20px;} .workflow-item p{font-size:15px!important;}} @media(max-width:768px){.header{width:calc(100% - 40px);} .hero{padding-top:40px;} .hero h1{font-size:26px;} .hero p{font-size:16px;} .section{padding:40px 20px;} .partners-section{padding:20px 0;} .partner-logo svg{height:20px;} .section-title{margin-bottom:15px;} .section-title h2{font-size:28px;} .feature-cards,.features-grid,.pricing-cards{grid-template-columns:1fr;} .pricing-card.featured{transform:none;} .pricing-features-section{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:10px;} .table-header,.features-table{min-width:700px;} .table-header,.feature-row{grid-template-columns:140px repeat(4,1fr);font-size:12px;} .header-plan{padding:16px 8px;height:auto;min-height:140px;} .header-plan.featured{height:auto;min-height:150px;transform:translateY(-5px);} .plan-name{font-size:11px;} .plan-price{font-size:14px;} .plan-buy-btn{padding:6px 8px;font-size:9px;} .feature-name{font-size:12px;} .feature-value{font-size:11px;} .footer-content{grid-template-columns:1fr 1fr;gap:30px;max-width:100%;padding:0 20px;} .footer-brand{grid-column:1/-1;width:100%;text-align:center;} .footer-brand p{max-width:100%;} .app-buttons{justify-content:center;} .footer-links{text-align:center;} .footer-bottom{text-align:center;padding:20px;} .faq-list{max-width:100%;padding:0;} .faq-item{padding:16px 0;} .faq-question{font-size:16px;gap:12px;} .faq-question span{font-size:20px;flex-shrink:0;} .faq-answer p{font-size:14px;} .cta{padding:40px 20px;} .cta h2{font-size:26px;} .cta p{font-size:15px;margin-bottom:20px;} .dashboard-preview{max-width:85%;margin:0 auto;} .hero-buttons{margin-bottom:15px;}}