*{margin:0;padding:0;box-sizing:border-box}:root{--primary:#4285F4;--secondary:#34A853;--accent:#FBBC04;--danger:#EA4335;--text:#202124;--text-light:#5F6368;--bg:#FFF;--bg-alt:#F8F9FA;--border:#DADCE0}body{font-family:'Inter',system-ui,sans-serif;color:var(--text);line-height:1.6;overflow-x:hidden}.nav{position:fixed;top:0;width:100%;background:rgba(255,255,255,.98);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:999}.nav-container{max-width:1200px;margin:0 auto;padding:16px 24px;display:flex;justify-content:space-between;align-items:center}.nav-logo{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:800;color:var(--text)}.nav-logo span{background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.nav-links{display:flex;align-items:center;gap:28px}.nav-links a{color:var(--text-light);text-decoration:none;font-weight:500;transition:.3s}.nav-links a:hover{color:var(--primary)}.mobile-menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;z-index:1000}.mobile-menu-btn span{width:24px;height:2px;background:var(--text);transition:.3s;border-radius:2px}.mobile-menu-btn.active span:nth-child(1){transform:rotate(45deg) translate(7px,7px)}.mobile-menu-btn.active span:nth-child(2){opacity:0}.mobile-menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}.btn-primary,.btn-secondary,.btn-outline{padding:10px 20px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;border:none;transition:.3s;display:inline-flex;align-items:center;gap:6px}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:#1967D2;transform:translateY(-2px);box-shadow:0 8px 24px rgba(66,133,244,.3)}.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border)}.btn-outline{background:transparent;color:var(--primary);border:2px solid var(--primary)}.btn-lg{padding:14px 28px;font-size:16px}.hero{padding:140px 0 80px;background:linear-gradient(135deg,#F8F9FA 0%,#E8F0FE 100%);min-height:100vh;display:flex;align-items:center}.hero-container{max-width:1200px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.hero-content h1{font-size:52px;font-weight:800;line-height:1.1;margin-bottom:20px}.gradient{background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-desc{font-size:19px;color:var(--text-light);margin-bottom:32px}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}.stat-item{text-align:center;padding:16px;background:#fff;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,.08)}.stat-val{font-size:28px;font-weight:800;color:var(--primary);display:block}.stat-lbl{font-size:13px;color:var(--text-light)}.hero-cta{display:flex;gap:12px;margin-bottom:20px}.hero-note{color:var(--text-light);font-size:14px}.hero-visual{position:relative}.dashboard-mock{background:#fff;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.12);overflow:hidden}.mock-header{background:var(--bg-alt);padding:14px;border-bottom:1px solid var(--border)}.mock-tabs{display:flex;gap:6px}.mock-tab{padding:8px 14px;border-radius:6px;font-size:13px;font-weight:500;color:var(--text-light);cursor:pointer;transition:.3s}.mock-tab.active{background:#fff;color:var(--primary);box-shadow:0 1px 3px rgba(0,0,0,.1)}.mock-content{padding:20px;display:grid;gap:12px}.mock-card{padding:16px;background:var(--bg-alt);border-radius:10px;border-left:3px solid var(--primary)}.mock-label{display:block;font-size:12px;color:var(--text-light);margin-bottom:6px}.mock-value{display:block;font-size:24px;font-weight:700;margin-bottom:4px}.mock-change{display:block;font-size:13px;font-weight:600;color:var(--secondary)}.live-stats{padding:60px 24px;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff}.stats-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.stat-box{text-align:center;padding:28px 20px;background:rgba(255,255,255,.12);border-radius:12px;backdrop-filter:blur(10px)}.stat-icon{font-size:36px;margin-bottom:12px}.stat-num{font-size:44px;font-weight:800;line-height:1;display:inline-block}.stat-suffix{font-size:24px;font-weight:700;margin-left:4px}.stat-txt{font-size:14px;margin-top:8px;opacity:.95}.features,.testimonials,.comparison,.pricing{padding:80px 24px}.section-container{max-width:1200px;margin:0 auto}.section-header{text-align:center;margin-bottom:50px}.section-header h2{font-size:40px;font-weight:800;margin-bottom:12px}.section-header p{font-size:18px;color:var(--text-light)}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.feature-card{padding:28px;background:#fff;border-radius:14px;border:1px solid var(--border);transition:.3s}.feature-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,.1)}.feature-icon{font-size:42px;margin-bottom:14px}.feature-card h3{font-size:20px;font-weight:700;margin-bottom:10px}.feature-card p{color:var(--text-light);font-size:15px}.testimonials{background:linear-gradient(135deg,#f8f9fa,#e8f0fe);position:relative;overflow:hidden}.testimonials-carousel{position:relative;max-width:1200px;margin:0 auto;padding:0 70px}.testimonials-wrapper{overflow:hidden}.testimonials-track{display:flex;gap:20px;transition:transform .6s cubic-bezier(.25,.46,.45,.94)}.testimonial-card{background:#fff;padding:24px;border-radius:14px;box-shadow:0 4px 16px rgba(0,0,0,.08);width:360px;flex-shrink:0;transition:.3s;display:flex;flex-direction:column}.testimonial-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,.14)}.testimonial-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}.testimonial-header img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--primary);box-shadow:0 2px 6px rgba(0,0,0,.1);flex-shrink:0}.testimonial-header>div{flex:1;min-width:0}.testimonial-header h4{font-size:16px;font-weight:700;margin-bottom:2px;color:var(--text)}.testimonial-header p{font-size:12px;color:var(--text-light);margin-bottom:5px}.rating{font-size:15px;color:#FBBC04;letter-spacing:1px}.testimonial-card>p{font-size:14px;line-height:1.65;margin-bottom:18px;color:var(--text);flex-grow:1}.testimonial-stats{display:flex;gap:16px;padding-top:16px;border-top:2px solid var(--bg-alt)}.testimonial-stats>div{flex:1;text-align:center}.t-val{display:block;font-size:22px;font-weight:800;color:var(--primary);margin-bottom:3px}.t-lbl{font-size:11px;color:var(--text-light);font-weight:500;text-transform:uppercase}.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:#fff;border:2px solid var(--primary);color:var(--primary);width:44px;height:44px;border-radius:50%;font-size:24px;font-weight:700;cursor:pointer;z-index:10;transition:.3s;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.12)}.carousel-btn:hover{background:var(--primary);color:#fff;transform:translateY(-50%) scale(1.15);box-shadow:0 6px 20px rgba(66,133,244,.4)}.carousel-btn.prev{left:10px}.carousel-btn.next{right:10px}.carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:28px}.carousel-dot{width:10px;height:10px;border-radius:50%;background:#d1d5db;cursor:pointer;transition:.3s}.carousel-dot.active{background:var(--primary);width:28px;border-radius:5px}.comparison-table{max-width:1000px;margin:0 auto;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.1)}.comp-row{display:grid;grid-template-columns:2fr 1.2fr 1.2fr;gap:0;padding:24px 28px;border-bottom:1px solid var(--border);align-items:center}.comp-header{background:linear-gradient(135deg,#f8f9fa,#e8f0fe);padding:28px}.comp-row:last-child{border-bottom:none}.comp-row:hover:not(.comp-header):not(.comp-footer){background:#fafbfc}.comp-header .comp-highlight{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;padding:20px;border-radius:12px;position:relative;text-align:center;margin:-4px 0}.comp-row:not(.comp-header):not(.comp-footer) .comp-highlight{background:transparent;color:var(--text);padding:0;margin:0;border-radius:0}.badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--accent);color:var(--text);padding:4px 12px;border-radius:12px;font-size:11px;font-weight:700;white-space:nowrap}.comp-highlight h3{font-size:20px;margin-bottom:4px;font-weight:800}.comp-highlight p{font-size:13px;opacity:.95;margin:0}.comp-feature{text-align:left}.comp-feature strong{display:block;font-size:16px;margin-bottom:4px;color:var(--text)}.comp-feature span{font-size:13px;color:var(--text-light)}.comp-row>div:not(.comp-feature){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center}.check,.cross{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;flex-shrink:0}.check{background:var(--secondary);color:#fff}.cross{background:var(--danger);color:#fff}.metric{font-size:28px;font-weight:800;color:var(--primary)}.comp-footer{background:linear-gradient(135deg,#f8f9fa,#e8f0fe);padding:28px}.comp-footer .comp-highlight{background:transparent;margin:0;padding:0}.pricing{background:var(--bg-alt)}.pricing-card{max-width:480px;margin:0 auto;padding:42px;background:#fff;border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,.1);position:relative;text-align:center}.pricing-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;padding:6px 20px;border-radius:16px;font-weight:600;font-size:13px}.pricing-card h3{font-size:24px;margin-bottom:20px}.price{margin-bottom:20px}.price-amount{font-size:52px;font-weight:800;color:var(--primary)}.price-period{font-size:18px;color:var(--text-light)}.trial-box{padding:18px;background:var(--bg-alt);border-radius:10px;margin-bottom:28px}.trial-box strong{display:block;font-size:17px;color:var(--secondary);margin-bottom:4px}.trial-box p{font-size:14px;color:var(--text-light)}.features-list{list-style:none;margin-bottom:28px;text-align:left}.features-list li{padding:10px 0;border-bottom:1px solid var(--border);font-size:15px}.cta{padding:80px 24px;background:linear-gradient(135deg,var(--primary),var(--secondary))}.cta-content{max-width:800px;margin:0 auto;text-align:center;color:#fff}.cta-content h2{font-size:40px;font-weight:800;margin-bottom:14px}.cta-content p{font-size:19px;margin-bottom:28px;opacity:.95}.cta-content .btn-primary{background:#fff;color:var(--primary)}.footer{padding:50px 24px 24px;background:var(--text);color:#fff}.footer-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 3fr;gap:50px;margin-bottom:32px}.footer-brand p{color:rgba(255,255,255,.7);margin-top:12px}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.footer-links h4{margin-bottom:12px;font-size:15px}.footer-links a{display:block;color:rgba(255,255,255,.7);text-decoration:none;margin-bottom:10px;font-size:14px;transition:.3s}.footer-links a:hover{color:#fff}.footer-bottom{text-align:center;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.5);font-size:14px}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);z-index:9999;align-items:center;justify-content:center}.modal.active{display:flex}.modal-content{background:#fff;border-radius:14px;padding:36px;max-width:440px;width:90%;position:relative;animation:slideUp .3s}.modal-close{position:absolute;top:14px;right:14px;background:none;border:none;font-size:28px;cursor:pointer;color:var(--text-light)}.form-group{margin-bottom:18px}.form-group label{display:block;margin-bottom:6px;font-weight:500;font-size:14px}.form-group input{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:8px;font-size:15px;transition:.3s}.form-group input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(66,133,244,.1)}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1024px){.testimonials-carousel{padding:0 60px}.testimonial-card{width:340px}.hero-content h1{font-size:44px}.section-header h2{font-size:36px}}@media(max-width:768px){.hero{padding:120px 0 60px;min-height:auto}.hero-container{grid-template-columns:1fr;gap:40px}.hero-content h1{font-size:32px;line-height:1.2}.hero-desc{font-size:16px}.hero-stats{grid-template-columns:repeat(3,1fr);gap:12px}.stat-item{padding:12px}.stat-val{font-size:22px}.stat-lbl{font-size:12px}.hero-cta{flex-direction:column;gap:10px}.hero-cta button{width:100%}.hero-visual{order:-1}.dashboard-mock{max-width:100%}.stats-grid{grid-template-columns:repeat(2,1fr);gap:16px}.stat-box{padding:20px 16px}.stat-icon{font-size:28px}.stat-num{font-size:32px}.stat-suffix{font-size:18px}.stat-txt{font-size:13px}.features-grid{grid-template-columns:1fr;gap:20px}.feature-card{padding:24px}.section-header h2{font-size:28px}.section-header p{font-size:16px}.comp-row{grid-template-columns:1fr;gap:12px;padding:16px}.comp-row>div:not(.comp-feature){margin:8px 0}.comp-highlight{margin:0}.comp-header{padding:20px}.comp-footer{padding:20px}.footer-container{grid-template-columns:1fr;gap:32px}.footer-links{grid-template-columns:repeat(2,1fr);gap:24px}.mobile-menu-btn{display:flex}.nav-links{position:fixed;top:65px;left:0;right:0;background:#fff;flex-direction:column;padding:20px;gap:16px;box-shadow:0 4px 12px rgba(0,0,0,.1);transform:translateY(-100%);opacity:0;visibility:hidden;transition:.3s}.nav-links.active{transform:translateY(0);opacity:1;visibility:visible}.nav-links a,.nav-links button{width:100%;text-align:center;justify-content:center}.nav-container{padding:12px 20px}.nav-logo{font-size:20px}.nav-logo svg{width:28px;height:28px}.testimonials-carousel{padding:0 50px}.testimonial-card{width:calc(100vw - 120px);max-width:400px}.carousel-btn{width:38px;height:38px;font-size:20px}.carousel-btn.prev{left:5px}.carousel-btn.next{right:5px}.pricing-card{padding:32px 24px}.price-amount{font-size:42px}.cta-content h2{font-size:32px}.cta-content p{font-size:16px}}@media(max-width:480px){.hero-content h1{font-size:28px}.hero-stats{grid-template-columns:1fr;gap:10px}.stats-grid{grid-template-columns:1fr}.stat-num{font-size:36px}.testimonial-card{width:calc(100vw - 100px)}.carousel-btn{width:34px;height:34px;font-size:18px}}


/* Interactive Dashboard Mock - Wask.co Style */
.dashboard-mock.interactive {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.15);
    overflow: hidden;
    transition: all 0.3s;
}

.dashboard-mock.interactive:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 50px rgba(0,0,0,0.2);
}

.mock-header {
    background: linear-gradient(135deg, #f8f9fa, #e8f0fe);
    padding: 16px;
    border-bottom: 1px solid #dadce0;
}

.mock-tabs {
    display: flex;
    gap: 8px;
}

.mock-tab {
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #5f6368;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent;
}

.mock-tab:hover {
    background: rgba(66, 133, 244, 0.1);
    color: #4285F4;
}

.mock-tab.active {
    background: #fff;
    color: #4285F4;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.mock-tab svg {
    opacity: 0.7;
}

.mock-content {
    padding: 20px;
}

.mock-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}

.mock-metric {
    padding: 14px;
    background: #f8f9fa;
    border-radius: 10px;
    border-left: 3px solid #4285F4;
    transition: all 0.3s;
}

.mock-metric:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.mock-metric .mock-label {
    display: block;
    font-size: 11px;
    color: #5f6368;
    margin-bottom: 6px;
    font-weight: 500;
}

.mock-metric .mock-value {
    display: block;
    font-size: 20px;
    font-weight: 800;
    color: #202124;
    margin-bottom: 4px;
}

.mock-metric .mock-trend {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: #34A853;
}

.mock-chart {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 16px;
    border: 1px solid #e8eaed;
}

.mock-chart canvas {
    width: 100%;
    height: auto;
    display: block;
}

.mock-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.mock-stat {
    text-align: center;
    padding: 12px;
    background: linear-gradient(135deg, #f8f9fa, #e8f0fe);
    border-radius: 8px;
}

.mock-stat .stat-label {
    display: block;
    font-size: 11px;
    color: #5f6368;
    margin-bottom: 4px;
    font-weight: 500;
}

.mock-stat .stat-value {
    display: block;
    font-size: 16px;
    font-weight: 700;
    color: #4285F4;
}

@media (max-width: 768px) {
    .mock-metrics {
        grid-template-columns: 1fr;
    }
    
    .mock-stats {
        grid-template-columns: 1fr;
    }
    
    .mock-tabs {
        flex-direction: column;
    }
    
    .mock-tab {
        width: 100%;
        justify-content: center;
    }
}


/* Footer Contact Section */
.footer-contact {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-contact h4 {
    margin-bottom: 8px;
    font-size: 15px;
    font-weight: 600;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    transition: all 0.3s;
}

.contact-item:hover {
    color: #fff;
    transform: translateX(4px);
}

.contact-item svg {
    opacity: 0.7;
}

.contact-item a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: all 0.3s;
}

.contact-item a:hover {
    color: #fff;
}

/* Update footer grid for 3 columns */
.footer-container {
    grid-template-columns: 2fr 1.5fr 3fr;
}

/* Mobile responsive for contact section */
@media(max-width:768px){
    .footer-container {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    
    .footer-contact {
        order: 2;
    }
    
    .footer-links {
        order: 3;
    }
}


/* FAQ Section */
.faq {
    padding: 80px 24px;
    background: var(--bg-alt);
}

.faq-container {
    max-width: 900px;
    margin: 0 auto;
}

.faq-item {
    background: #fff;
    border-radius: 12px;
    margin-bottom: 16px;
    overflow: hidden;
    border: 1px solid var(--border);
    transition: all 0.3s;
}

.faq-item:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.faq-question {
    width: 100%;
    padding: 24px 28px;
    background: none;
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: 17px;
    font-weight: 600;
    color: var(--text);
    text-align: left;
    transition: all 0.3s;
}

.faq-question:hover {
    color: var(--primary);
}

.faq-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-alt);
    border-radius: 50%;
    font-size: 24px;
    font-weight: 700;
    color: var(--primary);
    transition: all 0.3s;
    flex-shrink: 0;
    margin-left: 16px;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg);
    background: var(--primary);
    color: #fff;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
    padding: 0 28px;
}

.faq-item.active .faq-answer {
    max-height: 500px;
    padding: 0 28px 24px 28px;
}

.faq-answer p {
    color: var(--text-light);
    font-size: 15px;
    line-height: 1.7;
    margin: 0;
}

/* Mobile responsive for FAQ */
@media(max-width:768px){
    .faq {
        padding: 60px 20px;
    }
    
    .faq-question {
        padding: 20px;
        font-size: 15px;
    }
    
    .faq-icon {
        width: 28px;
        height: 28px;
        font-size: 20px;
        margin-left: 12px;
    }
    
    .faq-answer {
        padding: 0 20px;
    }
    
    .faq-item.active .faq-answer {
        padding: 0 20px 20px 20px;
    }
    
    .faq-answer p {
        font-size: 14px;
    }
}