/**
 * Homepage Styles - Instabooster
 * Optimized for PageSpeed and Core Web Vitals
 */

.hero,body{width:100%}.hero-button .icon-arrow,.show-more-btn i{transition:transform .3s ease}.hero,.hero-content,.step-card{position:relative}.user-name,.user-title{white-space:nowrap;text-overflow:ellipsis}.testimonial-text,.user-name,.user-title{text-overflow:ellipsis}:root{--primary:#E91E63;--primary-dark:#C2185B;--secondary:#FF5252;--dark:#1a1a1a;--light:#f8f9fa;--gradient:linear-gradient(135deg, #E91E63 0%, #c9154f 100%);--header-height:80px;--cream:#F7F7E8;--emerald:#00C9A7;--teal:#1B7B8A;--magenta:#E4007C;--gold:#FDB833;--shadow:rgba(0, 0, 0, 0.08)}*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.6;color:var(--dark);background:#fff;overflow-x:hidden}.hero{background:var(--gradient);overflow:hidden;padding:120px 0 80px}.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%23ffffff' fill-opacity='0.1' fill-rule='evenodd'/%3E%3C/svg%3E");opacity:.5}.hero-content{max-width:1400px;margin:0 auto;padding:0 20px;text-align:center;z-index:2;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.hero h1{font-size:3.5rem;font-weight:800;margin-bottom:1.5rem;text-shadow:0 2px 4px rgba(0,0,0,.1);animation:1s ease-out fadeInUp;line-height:1.2}.hero p{font-size:1.25rem;margin-bottom:2rem;opacity:.9;animation:1s ease-out .2s backwards fadeInUp;max-width:800px;margin-left:auto;margin-right:auto}.hero-button{display:inline-flex;align-items:center;gap:15px;padding:15px 40px;background:#fff;border-radius:50px;font-weight:600;transition:.3s;animation:1s ease-out .4s backwards fadeInUp;box-shadow:0 4px 15px rgba(0,0,0,.1);margin:0 auto;width:auto;text-decoration:none!important;color:var(--primary)}.hero-button:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,.2);text-decoration:none!important;color:var(--primary)}.service-item,.service-item:hover{color:inherit;text-decoration:none!important}.hero-button .icon-arrow{display:inline-block;animation:slideArrow 1.5s ease-in-out infinite}@keyframes slideArrow{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}.hero-button:hover .icon-arrow{animation:none;transform:translateX(8px)}.reviews,.services{padding:80px 0;background:#fff}.section-title{text-align:center;margin-bottom:50px}.section-title h2{font-size:2.5rem;font-weight:800;color:var(--dark);margin-bottom:1rem}.section-title p{color:#666;font-size:1.1rem;max-width:600px;margin:0 auto}.services-grid,.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;max-width:1400px;margin:0 auto;padding:0 20px}.platform-card{background:#fff;border-radius:20px;padding:30px;box-shadow:0 10px 30px rgba(0,0,0,.05);transition:.3s}.platform-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px rgba(0,0,0,.1)}.platform-header{text-align:center;margin-bottom:30px}.platform-icon{width:60px;height:60px;margin:0 auto 15px;display:flex;align-items:center;justify-content:center}.platform-icon img{width:100%;height:100%;object-fit:contain}.platform-name{font-size:1.5rem;font-weight:700;margin:0}.service-list{display:flex;flex-direction:column;gap:10px}.service-item{display:flex;align-items:center;padding:15px;background:#f8f9fa;border-radius:12px;transition:.3s}.service-item:hover{transform:translateX(5px);background:#f0f0f0}.service-icon{width:30px;height:30px;margin-right:15px;display:flex;align-items:center;justify-content:center}.service-info{flex:1;display:flex;justify-content:space-between;align-items:center}.service-name{font-weight:500;margin:0}.service-price{color:var(--primary);font-weight:600}.hidden-services{display:none}.show-more-btn{width:100%;padding:10px;margin-top:15px;background:0 0;border:1px solid #ddd;border-radius:12px;color:#666;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:.3s}.show-more-btn:hover{background:#f8f9fa;border-color:#ccc}.show-more-btn.active i{transform:rotate(180deg)}.view-all-services-container{text-align:center;margin-top:60px}.view-all-services{display:inline-flex;align-items:center;padding:15px 40px;background:var(--gradient);color:#fff;text-decoration:none!important;border-radius:50px;font-weight:600;transition:.3s;box-shadow:0 4px 15px rgba(0,0,0,.1)}.view-all-services:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,.2);color:#fff;text-decoration:none!important}.why-us{padding:80px 0;background:#f8f9fa}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;max-width:1400px;margin:0 auto;padding:0 20px}.feature-card{background:#fff;padding:40px 30px;border-radius:20px;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.05);transition:.3s}.feature-icon,.how-it-works{background:var(--primary);color:#fff}.feature-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px rgba(0,0,0,.1)}.feature-icon{width:80px;height:80px;margin:0 auto 20px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:2rem}.reviews .section-title{margin-bottom:40px}.senja-embed{max-width:1400px;margin:0 auto;padding:0 20px}.how-it-works{padding:80px 0}.how-it-works .section-title h2,.how-it-works .section-title p{color:#fff}.step-card{background:#fff;color:var(--dark);border-radius:20px;padding:40px 30px}.step-number{position:absolute;top:20px;right:20px;width:40px;height:40px;background:var(--primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem}

/* Iconos SVG optimizados para PageSpeed */
.icon-bolt::before{content:'';display:inline-block;width:32px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='white' d='M349.4 44.6c5.9-13.7 1.5-29.7-10.6-38.5s-28.6-8-39.9 1.8l-256 224c-10 8.8-13.6 22.9-8.9 35.3S50.7 288 64 288H175.5L98.6 467.4c-5.9 13.7-1.5 29.7 10.6 38.5s28.6 8 39.9-1.8l256-224c10-8.8 13.6-22.9 8.9-35.3s-16.6-20.7-30-20.7H272.5L349.4 44.6z'/%3E%3C/svg%3E") no-repeat center;background-size:contain}
.icon-shield::before{content:'';display:inline-block;width:32px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='white' d='M256 0c4.6 0 9.2 1 13.4 2.9L457.7 82.8c22 9.3 38.4 31 38.3 57.2c-.5 99.2-41.3 280.7-213.6 363.2c-16.7 8-36.1 8-52.8 0C57.3 420.7 16.5 239.2 16 140c-.1-26.2 16.3-47.9 38.3-57.2L242.7 2.9C246.8 1 251.4 0 256 0zm0 66.8V444.8C394 378 431.1 230.1 432 141.4L256 66.8l0 0z'/%3E%3C/svg%3E") no-repeat center;background-size:contain}
.icon-chart::before{content:'';display:inline-block;width:32px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='white' d='M64 64c0-17.7-14.3-32-32-32S0 46.3 0 64V400c0 44.2 35.8 80 80 80H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H80c-8.8 0-16-7.2-16-16V64zm406.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L320 210.7l-57.4-57.4c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L240 221.3l57.4 57.4c12.5 12.5 32.8 12.5 45.3 0l128-128z'/%3E%3C/svg%3E") no-repeat center;background-size:contain}
.icon-headset::before{content:'';display:inline-block;width:32px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='white' d='M256 48C141.1 48 48 141.1 48 256v40c0 13.3-10.7 24-24 24s-24-10.7-24-24V256C0 114.6 114.6 0 256 0S512 114.6 512 256V400.1c0 48.6-39.4 88-88.1 88L313.6 488c-8.3 14.3-23.8 24-41.6 24H240c-26.5 0-48-21.5-48-48s21.5-48 48-48h32c17.8 0 33.3 9.7 41.6 24l110.4 .1c22.1 0 40-17.9 40-40V256C464 141.1 370.9 48 256 48zm-176 208v-16c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32v64c0 17.7-14.3 32-32 32H112c-17.7 0-32-14.3-32-32V256zm288 0v-16c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32v64c0 17.7-14.3 32-32 32H400c-17.7 0-32-14.3-32-32V256z'/%3E%3C/svg%3E") no-repeat center;background-size:contain}
.icon-arrow::before{content:'';display:inline-block;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='currentColor' d='M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z'/%3E%3C/svg%3E") no-repeat center;background-size:contain}
.icon-chevron::before{content:'';display:inline-block;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='currentColor' d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E") no-repeat center;background-size:contain}

@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.hero{padding:100px 0 60px;margin-top:0}.hero-content{width:100%;max-width:100%;padding:0 20px;min-height:300px;justify-content:center}.hero h1{font-size:2.5rem;margin-bottom:1rem;padding:0 10px}.hero p{font-size:1.1rem;margin-bottom:1.5rem;padding:0 15px}.hero-button{padding:12px 30px;font-size:1rem;width:auto;display:inline-flex;margin:0 auto}.section-title h2{font-size:2rem;padding:0 15px}.section-title p{font-size:1rem;padding:0 20px}.how-it-works,.reviews,.services,.why-us{padding:60px 0}.features-grid,.services-grid,.steps-grid{grid-template-columns:1fr;padding:0 15px}.feature-card,.platform-card,.step-card{padding:20px}.service-info{flex-direction:column;align-items:flex-start;gap:5px}.view-all-services{width:auto;margin:0 auto;display:inline-flex}.testimonials-container .section-title{margin-bottom:2rem}}

/* Fix for the view all services button on mobile */
@media (max-width: 768px) {
    .view-all-services-container {
        text-align: center;
        width: 100%;
    }
    .view-all-services {
        display: inline-flex;
        width: auto;
        margin: 0 auto;
        justify-content: center;
    }
}

/* Style for the new "View all reviews" button */
.view-all-reviews-container {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 20px;
}
.view-all-reviews {
    display: inline-flex;
    align-items: center;
    padding: 15px 40px;
    background: var(--gradient);
    color: #fff;
    text-decoration: none !important;
    border-radius: 50px;
    font-weight: 600;
    transition: .3s;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .1);
}
.view-all-reviews:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, .2);
    color: #fff;
    text-decoration: none !important;
}

/* Testimonials section - optimized for PageSpeed */
.instabooster-testimonials {
    font-family: Inter,-apple-system,BlinkMacSystemFont,sans-serif;
    padding: 4rem 0;
    width: 100%;
    overflow: hidden;
    position: relative;
    background: #fff;
}

/* Update the testimonials styles to fix overlapping issues */

/* 1. Update the testimonials container styles */
.testimonials-container {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    overflow: hidden;
}

/* 2. Fix the testimonials rows spacing - reduce vertical gap */
.testimonials-rows {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.5rem; /* Reduced from 2rem to bring rows closer */
    margin: 2rem 0;
}

/* 3. Update the testimonials row styles */
.testimonials-row {
    position: relative;
    width: 100%;
    height: 180px; /* Adjusted height */
    overflow: hidden;
    margin-bottom: 0.5rem; /* Reduced margin between rows */
}

/* 4. Fix the testimonial track positioning and spacing */
.testimonial-track {
    display: flex;
    gap: 0.75rem; /* Reduced from 2rem to bring cards closer */
    position: relative;
    width: max-content;
    height: 100%;
    padding: 0;
}

/* 5. Update the testimonial card styles */
.testimonial-card {
    flex: 0 0 auto;
    width: 300px;
    height: 170px; /* Adjusted height */
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px var(--shadow);
    transition: transform .3s ease, box-shadow .3s ease;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0; /* Remove any margin that might cause spacing */
}

/* 6. Update the animation keyframes to ensure smooth movement */
@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-50% - 0.375rem)); } /* Half gap */
}

@keyframes scroll-right {
    0% { transform: translateX(calc(-50% - 0.375rem)); } /* Half gap */
    100% { transform: translateX(0); }
}

/* 7. Update animation classes with proper timing */
.scroll-left {
    animation: scroll-left 120s linear infinite;
    will-change: transform;
}

.scroll-right {
    animation: scroll-right 120s linear infinite;
    will-change: transform;
}

/* 8. Mobile optimizations */
@media (max-width: 768px) {
    .testimonials-row {
        height: 200px; /* Slightly taller on mobile */
    }

    .testimonial-card {
        width: 280px;
        height: 190px;
    }
}

.testimonials-rows {
    position: relative;
    height: auto;
    overflow: hidden;
    margin: -.5rem 0;
}

.testimonials-row:last-child {
    margin-bottom: 0;
}

.testimonial-header {
    display: flex;
    align-items: center;
    gap: .75rem;
}
.avatar {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    position: relative;
    font-size: 1rem;
    font-weight: 600;
    overflow: hidden;
}
.avatar-text {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    text-align: center;
    line-height: 1;
}
.user-info {
    flex: 1;
    min-width: 0;
}
.user-name {
    color: #1d1d1b;
    margin-bottom: .125rem;
    font-size: 1rem;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.user-title {
    font-size: .85rem;
    color: #666;
    font-weight: 500;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.testimonial-content {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.testimonial-text {
    font-size: .9rem;
    line-height: 1.5;
    color: #4a4a4a;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
}
.testimonial-rating {
    display: flex;
    gap: 2px;
}
.star {
    color: var(--gold);
    width: 16px;
    height: 16px;
}

/* Gradient overlays for smooth edges */
.testimonials-row::before,
.testimonials-row::after {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 30px;
    pointer-events: none;
    z-index: 2;
}
.testimonials-row::before {
    left: 0;
    background: linear-gradient(to right, #fff, rgba(255,255,255,0));
}
.testimonials-row::after {
    right: 0;
    background: linear-gradient(to left, #fff, rgba(255,255,255,0));
}

/* Animation classes - slower speed */
@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

@keyframes scroll-right {
    0% { transform: translateX(-50%); }
    100% { transform: translateX(0); }
}

.scroll-left {
    animation: scroll-left 120s linear infinite;
}

.scroll-right {
    animation: scroll-right 120s linear infinite;
}

/* Pause on hover */
.testimonials-row:hover .testimonial-track {
    animation-play-state: paused;
}

a.service_link {
    color: var(--dark);
    text-decoration: none;
}

a.service_link:hover {
    color: #e93380;
}

/* Reduce animations for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    .scroll-left, .scroll-right {
        animation: none;
    }
}

/* Optimize for print */
@media print {
    .scroll-left, .scroll-right {
        animation: none;
    }
}

/* Mobile optimization */
@media (max-width: 768px) {
    .testimonials-row::before,
    .testimonials-row::after {
        width: 20px;
    }
    .testimonial-card {
        width: 280px;
    }
}
