*{margin:0;padding:0;box-sizing:border-box;} body{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;line-height:1.6;color:#333;overflow-x:hidden;} html{scroll-behavior:smooth;} .container{max-width:1200px;margin:0 auto;padding:0 20px;} .navbar{position:fixed;top:0;width:100%;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);z-index:1000;transition:all 0.3s ease;border-bottom:1px solid rgba(0,0,0,0.1);} .navbar.scrolled{background:rgba(255,255,255,0.98);box-shadow:0 2px 20px rgba(0,0,0,0.1);} .nav-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;height:70px;} .nav-logo{display:flex;align-items:center;font-size:24px;font-weight:700;color:#1a73e8;} .nav-logo-link{color:#1a73e8;text-decoration:none;font-weight:700;} .nav-logo i{margin-right:8px;font-size:28px;} .nav-menu{display:flex;list-style:none;gap:30px;align-items:center;} .nav-link{text-decoration:none;color:#333;font-weight:500;transition:color 0.3s ease;position:relative;} .nav-link i{display:none;} .lang-switch .nav-link i{display:inline-block;} .nav-link:hover,.nav-link.active{color:#1a73e8;} .nav-link::after{content:"";position:absolute;bottom:-5px;left:0;width:0;height:2px;background:#1a73e8;transition:width 0.3s ease;} .nav-link:hover::after,.nav-link.active::after{width:100%;} .lang-switch .nav-link{display:flex;align-items:center;gap:3px;color:#1a73e8;background:rgba(26,115,232,0.05);padding:3px 8px;border-radius:4px;font-size:13px;line-height:1;} .lang-switch .nav-link:hover{background:rgba(26,115,232,0.1);} .lang-switch .nav-link::after{display:none;} .hamburger{display:none;flex-direction:column;cursor:pointer;} .bar{width:25px;height:3px;background:#333;margin:3px 0;transition:all 0.3s ease-in-out;} .hamburger.active .bar:nth-child(1){transform:translateY(9px) rotate(45deg);} .hamburger.active .bar:nth-child(2){opacity:0;} .hamburger.active .bar:nth-child(3){transform:translateY(-9px) rotate(-45deg);} .btn{display:inline-flex;align-items:center;padding:12px 24px;font-size:16px;border-radius:8px;text-decoration:none;font-weight:600;transition:all 0.3s ease;border:none;cursor:pointer;gap:8px;min-width:140px;justify-content:center;} .btn-primary{background:linear-gradient(135deg,#1a73e8,#4285f4);color:white;box-shadow:0 4px 15px rgba(26,115,232,0.3);} .btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(26,115,232,0.4);} .btn-secondary{background:transparent;color:#1a73e8;border:2px solid #1a73e8;} .btn-secondary:hover{background:#1a73e8;color:white;transform:translateY(-2px);} .hero{min-height:100vh;position:relative;display:flex;align-items:center;padding:100px 0 60px;box-sizing:border-box;} .hero-background{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);z-index:-2;} .hero-background::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:url("../images/hero-bg.webp");background-position:center;background-size:cover;opacity:0.1;z-index:-1;} @media (max-width:768px){.hero-background::before{background-image:url("../images/hero-bg-mobile.webp");} } .hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.4);z-index:-1;pointer-events:none;} .hero-content{width:100%;z-index:1;} .hero-text{text-align:center;color:white;max-width:800px;margin:0 auto;} .hero-title{font-size:3.5rem;font-weight:700;margin-bottom:20px;line-height:1.2;} .highlight{background:linear-gradient(135deg,#ff6b35,#f7931e);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:inline-block;white-space:nowrap;} .hero-subtitle{font-size:1.25rem;margin-bottom:40px;opacity:0.9;} .hero-stats{display:flex;justify-content:center;gap:60px;margin:50px auto;max-width:900px;} .stat-item{text-align:center;} .stat-number{font-size:2.5rem;font-weight:700;color:#ff6b35;margin-bottom:5px;} .stat-label{font-size:0.9rem;opacity:0.8;} .hero-buttons{display:flex;justify-content:center;gap:20px;margin-top:40px;} .scroll-indicator{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);animation:bounce 2s infinite;} .scroll-arrow{width:30px;height:30px;border:2px solid white;border-top:none;border-left:none;transform:rotate(45deg);} @keyframes bounce{0%,20%,50%,80%,100%{transform:translateX(-50%) translateY(0);} 40%{transform:translateX(-50%) translateY(-10px);} 60%{transform:translateX(-50%) translateY(-5px);} } section{padding:100px 0;} .section-header{text-align:center;margin-bottom:60px;} .section-title{font-size:2.5rem;font-weight:700;color:#333;margin-bottom:20px;} .section-subtitle{font-size:1.1rem;color:#4b5563;max-width:600px;margin:0 auto;} .services{background:#f8fafc;} .services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:30px;margin-top:60px;} .service-card{background:white;padding:40px 30px;border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,0.08);transition:all 0.3s ease;border:1px solid rgba(0,0,0,0.05);} .service-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px rgba(0,0,0,0.15);} .service-icon{width:70px;height:70px;background:linear-gradient(135deg,#1a73e8,#4285f4);border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:25px;} .service-icon i{font-size:30px;color:white;} .service-title{font-size:1.5rem;font-weight:600;color:#333;margin-bottom:15px;} .service-description{color:#4b5563;margin-bottom:20px;line-height:1.6;} .service-features{list-style:none;} .service-features li{padding:8px 0;color:#555;position:relative;padding-left:25px;} .service-features li::before{content:"✓";position:absolute;left:0;color:#1a73e8;font-weight:bold;} .about{background:white;} .about-content{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;margin-bottom:80px;} .about-text .section-header{text-align:left;margin-bottom:30px;} .about-description p{margin-bottom:20px;color:#666;line-height:1.8;} .advantages-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:40px;} .advantage-item{display:flex;align-items:flex-start;gap:15px;} .advantage-icon{width:50px;height:50px;background:linear-gradient(135deg,#ff6b35,#f7931e);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px;} .advantage-icon i{font-size:20px;color:white;} .advantage-content h3{font-size:1.1rem;font-weight:600;color:#333;margin-bottom:5px;} .advantage-content p{color:#666;font-size:0.9rem;} .about-image{text-align:center;} .dashboard-image{width:100%;max-width:500px;height:auto;border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,0.15);} .team-section{border-top:1px solid #eee;padding-top:60px;} .team-title{text-align:center;font-size:2rem;font-weight:600;color:#333;margin-bottom:50px;} .team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:40px;} .team-member{text-align:center;padding:30px 20px;background:#f8fafc;border-radius:16px;transition:transform 0.3s ease;} .team-member:hover{transform:translateY(-5px);} .member-avatar{width:80px;height:80px;background:linear-gradient(135deg,#1a73e8,#4285f4);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;} .member-avatar i{font-size:35px;color:white;} .member-name{font-size:1.3rem;font-weight:600;color:#333;margin-bottom:5px;} .member-role{color:#1a73e8;font-weight:500;margin-bottom:10px;} .member-description{color:#666;font-size:0.9rem;line-height:1.5;} .contact{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;} .contact .section-title,.contact .section-subtitle{color:white;} .contact-wrapper{display:flex;margin-top:50px;align-items:stretch;justify-content:center;max-width:900px;margin-left:auto;margin-right:auto;} .contact-left,.contact-right{display:flex;flex:1;max-width:450px;} .contact-left{justify-content:flex-end;} .contact-right{justify-content:flex-start;} .contact-info-box{background:rgba(255,255,255,0.06);backdrop-filter:blur(10px);border-radius:16px 0 0 16px;padding:35px 35px 35px 70px;border:1px solid rgba(255,255,255,0.15);border-right:none;display:flex;flex-direction:column;justify-content:center;gap:30px;width:100%;} .contact-item{display:flex;align-items:center;gap:20px;} .contact-icon{width:55px;height:55px;background:linear-gradient( 135deg,rgba(255,255,255,0.25),rgba(255,255,255,0.1) );border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;} .contact-icon i{font-size:22px;color:white;} .contact-details h4{font-size:1.15rem;font-weight:600;margin-bottom:4px;} .contact-details span{font-size:0.85rem;color:rgba(255,255,255,0.8);} .qrcode-item{padding-top:20px;border-top:1px solid rgba(255,255,255,0.15);} .qrcode-inline{width:130px;height:130px;flex-shrink:0;} .qrcode-inline img{width:130px;height:130px;border-radius:10px;} .contact-form-new{background:rgba(255,255,255,0.12);backdrop-filter:blur(10px);padding:35px;border-radius:0 16px 16px 0;border:1px solid rgba(255,255,255,0.2);border-left:1px solid rgba(255,255,255,0.1);width:100%;display:flex;flex-direction:column;justify-content:center;} .contact-form-new .form-title{font-size:1.5rem;font-weight:700;color:white;margin-bottom:8px;text-align:center;} .contact-form-new .form-subtitle{font-size:0.9rem;color:rgba(255,255,255,0.8);margin-bottom:25px;text-align:center;} .contact-form-new .form-group{margin-bottom:20px;} .contact-form-new label{display:block;margin-bottom:8px;color:white;font-weight:600;font-size:0.95rem;} .contact-form-new input[type="text"],.contact-form-new select{width:100%;padding:14px 16px;border:1px solid rgba(255,255,255,0.3);border-radius:10px;background-color:rgba(255,255,255,0.08);color:white;font-size:1rem;box-sizing:border-box;transition:all 0.3s ease;} .contact-form-new input[type="text"]:focus,.contact-form-new select:focus{outline:none;border-color:rgba(255,255,255,0.6);background-color:rgba(255,255,255,0.12);} .contact-form-new input[type="text"]::placeholder{color:rgba(255,255,255,0.5);} .contact-form-new .contact-input-group{display:flex;gap:12px;} .contact-form-new .contact-input-group select{flex-shrink:0;width:auto;min-width:100px;} .contact-form-new .contact-input-group input{flex-grow:1;} .contact-form-new button[type="submit"]{display:block;width:100%;padding:14px 20px;background-color:#1a73e8;color:white;border:none;border-radius:10px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:background-color 0.3s ease;margin-top:10px;} .contact-form-new button[type="submit"]:hover:not(:disabled){background-color:#155cb8;} .contact-form-new button[type="submit"]:disabled{background-color:#999;cursor:not-allowed;} .footer{background:#fff;color:#5f6368;padding:30px 0;font-size:0.9rem;border-top:1px solid #eee;} .footer-bottom{text-align:center;} .footer-bottom p{margin:0;} .footer-bottom a{color:#5f6368;text-decoration:none;transition:color 0.2s;} .footer-bottom a:hover{color:#1a73e8;} @media (max-width:768px){.hamburger{display:flex;} .nav-menu{position:fixed;left:0;top:70px;flex-direction:column;background-color:rgba(255,255,255,0.95);backdrop-filter:blur(15px);width:100%;height:calc(100vh - 70px);text-align:center;transition:all 0.4s cubic-bezier(0.4,0,0.2,1);padding:50px 0;gap:0;align-items:center;justify-content:flex-start;z-index:999;box-shadow:none;border-top:1px solid rgba(0,0,0,0.03);overflow-y:auto;transform:translateY(-10px);opacity:0;visibility:hidden;} .navbar.menu-open{border-bottom-color:transparent !important;box-shadow:none !important;background:rgba(255,255,255,1) !important;} .nav-menu.active{transform:translateY(0);opacity:1;visibility:visible;box-shadow:0 15px 30px rgba(0,0,0,0.05);} .nav-item{margin:0;width:100%;opacity:0;transform:translateY(10px);transition:all 0.3s ease;border-bottom:1px solid rgba(0,0,0,0.04);} .nav-menu.active .nav-item{opacity:1;transform:translateY(0);} .nav-menu.active .nav-item:nth-child(1){transition-delay:0.05s;} .nav-menu.active .nav-item:nth-child(2){transition-delay:0.1s;} .nav-menu.active .nav-item:nth-child(3){transition-delay:0.15s;} .nav-menu.active .nav-item:nth-child(4){transition-delay:0.2s;} .nav-menu.active .nav-item:nth-child(5){transition-delay:0.25s;} .nav-menu.active .nav-item:nth-child(6){transition-delay:0.3s;} .nav-link{font-size:1.15rem;font-weight:500;display:flex;align-items:center;padding:20px 20px;width:100%;color:#4b5563;text-align:left;} .nav-link i{display:inline-block !important;width:24px;text-align:center;margin-right:15px;color:#1a73e8;font-size:1.1rem;} .nav-link:active{background-color:rgba(26,115,232,0.05);color:#1a73e8;} .lang-switch{margin-top:0;border-bottom:none;} .lang-switch .nav-link{display:flex;width:100%;justify-content:flex-start;padding:20px 20px;background-color:transparent;border-radius:0;font-size:1.15rem;color:#1a73e8;font-weight:600;} .hero-title{font-size:2.2rem;line-height:1.2;} html[lang="en"] .hero-title{font-size:2rem;} .hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;max-width:600px;margin:20px auto;padding:0 20px;} .scroll-indicator{display:none;} .hero-buttons{flex-direction:column;align-items:center;} .services-grid{grid-template-columns:1fr;} .about-content{grid-template-columns:1fr;gap:50px;} .about-text .section-header{text-align:center;} .advantages-grid{grid-template-columns:1fr;} .contact-wrapper{flex-direction:column;gap:0;max-width:100%;padding:0;} .contact-left,.contact-right{justify-content:center;max-width:none;} .contact-info-box{border-radius:16px 16px 0 0;border-right:1px solid rgba(255,255,255,0.15);border-bottom:none;} .contact-form-new{border-radius:0 0 16px 16px;border-left:1px solid rgba(255,255,255,0.2);border-top:1px solid rgba(255,255,255,0.1);} .contact-info-box{max-width:none;padding:25px;} .contact-form-new{max-width:none;padding:25px;} .qrcode-item{display:none;} .team-grid{grid-template-columns:1fr;} .contact-form-new .contact-input-group{flex-direction:column;gap:10px;} .contact-form-new .contact-input-group select{width:100%;} } @media (max-width:1024px){.hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:600px;margin:30px auto;padding:0 32px;} } @media (max-width:480px){.container{padding:0 15px;} .hero-title{font-size:1.8rem;} html[lang="en"] .hero-title{font-size:1.6rem;} .section-title{font-size:2rem;} .hero-stats{gap:20px;} .stat-number{font-size:2rem;} .service-card{padding:30px 20px;} } .thank-you-section{min-height:100vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;align-items:center;padding:120px 0 60px;} .thank-you-content{text-align:center;max-width:800px;margin:0 auto;background:rgba(255,255,255,0.95);padding:60px 40px;border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,0.1);} .thank-you-icon{font-size:80px;color:#10b981;margin-bottom:30px;} .thank-you-title{font-size:2.5rem;font-weight:700;color:#1f2937;margin-bottom:20px;} .thank-you-message{font-size:1.2rem;color:#6b7280;margin-bottom:40px;line-height:1.6;} .next-steps{text-align:left;margin-bottom:40px;} .next-steps h3{font-size:1.5rem;color:#1f2937;margin-bottom:20px;text-align:center;} .steps-list{list-style:none;padding:0;} .steps-list li{display:flex;align-items:center;margin-bottom:15px;padding:15px;background:#f8fafc;border-radius:10px;border-left:4px solid #1a73e8;} .steps-list li i{font-size:1.2rem;color:#1a73e8;margin-right:15px;width:20px;} .contact-info-summary{margin-bottom:40px;} .contact-info-summary h3{font-size:1.3rem;color:#1f2937;margin-bottom:20px;} .contact-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:20px;} .contact-option{display:flex;align-items:center;padding:15px;background:#f8fafc;border-radius:10px;text-align:left;} .contact-option i{font-size:1.5rem;color:#1a73e8;margin-right:15px;} .contact-option strong{display:block;color:#1f2937;margin-bottom:5px;} .contact-option p{color:#6b7280;margin:0;font-size:0.9rem;} .action-buttons{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;} @media (max-width:768px){.thank-you-content{padding:40px 20px;margin:0 20px;} .thank-you-title{font-size:2rem;} .thank-you-icon{font-size:60px;} .action-buttons{flex-direction:column;align-items:center;} .contact-options{grid-template-columns:1fr;} } .telegram-float{pointer-events:auto;z-index:9999;} .wechat-float-button{position:fixed;bottom:20px;right:20px;z-index:9999;pointer-events:auto;} .faq-section{background-color:#f8fafc;} .faq-grid{max-width:900px;margin:0 auto;display:grid;gap:20px;} .faq-item{background:white;border-radius:12px;padding:25px 30px;box-shadow:0 4px 6px rgba(0,0,0,0.02);border:1px solid rgba(0,0,0,0.05);transition:all 0.3s ease;} .faq-item:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,0.08);} .faq-question{font-size:1.2rem;font-weight:600;color:#1a73e8;margin-bottom:15px;display:flex;justify-content:space-between;align-items:center;} .faq-answer{color:#4b5563;line-height:1.7;font-size:1rem;}