* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'gogh-regular';
    overflow-x: hidden;
    background-color: #f4f4f4;
}

/* Home Section */
.home-section {
    position: relative;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    background-image: 
        linear-gradient(#f0f0f0 1px, transparent 1px),
        linear-gradient(90deg, #f0f0f0 1px, transparent 1px);
    background-size: 40px 40px; /* Grid effect */
    overflow: hidden;
}

.logo-container {
    position: relative;
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.logo-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* Ensures no cropping */
    opacity: 0;
    transition: opacity 0.1s linear;
}

/* First logo visible by default */
.logo-1 {
    opacity: 1;
    z-index: 1;
}

.logo-2 {
    z-index: 2;
}

.logo-3 {
    z-index: 3;
}

.scroll-indicator {
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
    text-align: center;
    color: #747476; /* Contrast color needed */
    font-size: 0.9rem;
    opacity: 0.7;
    animation: bounce 2s infinite;
    font-family: 'gogh-regular', sans-serif;
}

.arrow {
    font-size: 1.5rem;
    margin-top: 5px;
    font-family: 'gogh-regular', sans-serif;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}

/* Services Intro Section */
.services-intro {
    position: relative;
    height: 100vh;
    background-color: #650C30;
    color: #fff;
    padding: 0 5%; /* Side padding */
    display: grid;
    grid-template-columns: 1fr 1fr; /* Split 50/50 */
    align-items: center;
    overflow: hidden;
}

.intro-header {
    padding-top: 1vh; /* Push title down a bit */
}

.intro-title {
    font-size: 3.2rem;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    color: #E0E0E0;
    font-family: 'gogh-regular', sans-serif;
    min-height: 3.2em; /* Reserve space for 2-3 lines to prevent layout shift */
    display: flex;
    align-items: center;
}

.changing-text {
    display: block;
}

.intro-body {
    display: flex;
    flex-direction: column;
    align-items: center; /* Centered alignment */
    justify-content: center; /* Center vertically if needed */
    height: 50%;
    padding-top: 5vh; /* Start near top */
}

.intro-image-wrapper {
    margin-bottom: 20px;
    transform: translateY(-20px); /* Pull image up slightly */
}

.smoke-person-img {
    max-width: 300px; /* Slightly smaller to fit everything */
    height: auto;
}

.intro-text {
    text-align: center;
    font-size: 1.3rem;
    line-height: 1.4;
    color: #ccc;
    max-width: 700px;
    font-family: 'gogh-regular', sans-serif;
    padding-bottom: 20px;
    padding-left: 10px;
    margin-top: -12px;

}

/* Services Cards Section (Horizontal Scroll) */
.services-cards-section {
    position: relative;
    height: 100vh;
    background-color: #650C30;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.cards-scroll-wrapper {
    display: flex;
    gap: 150px; /* More space between cards for "one by one" feel */
    padding-left: 50vw; /* Start first card in middle/right */
    padding-right: 50vw;
    width: fit-content;
}

.service-card {
    width: 300px; /* Smaller, square-ish */
    height: 300px;
    border: 2px solid #fff; /* Solid border like example */
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center content vertically */
    align-items: center; /* Center content horizontally */
    transition: transform 0.3s ease, background-color 0.3s ease;
    background-color: transparent;
    flex-shrink: 0;
    text-align: center; /* Center text */
    font-family: 'gogh-regular', sans-serif;
}

.service-card:hover {
    background-color: rgba(255,255,255,0.05);
}

.service-number {
    font-size: 2rem; /* Big number */
    font-weight: bold;
    color: #D4D4D4; /* Light color */
    opacity: 1;
    line-height: 1;
    margin-bottom: 10px;
}

.service-name {
    font-size: 1.5rem;
    font-weight: normal;
    margin: 5px 0;
    text-transform: none; /* Example has "Design Bold" normal case */
    color: #fff;
}

.service-detail {
    font-size: 1.0rem;
    color: #ddd;
    margin-bottom: 15px;
    display: none; /* Example image doesn't show much detail, but user said "sin borrar nada". Let's keep it but maybe smaller or hidden if user wants exact match. User said "sin borrar nada de los textos". I will keep it. */
    display: block;
    font-family: 'gogh-regular', sans-serif;
}

.service-btn-small {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    font-size: 1.1rem;
    border-bottom: 1px solid #fff;
    padding-bottom: 2px;
    font-family: 'gogh-regular', sans-serif;
}

.service-btn-small:hover {
    opacity: 0.8;
}




/* Wave Separator */
.wave-separator {
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    line-height: 0;
    transform: rotate(180deg);
    z-index: 1;
    pointer-events: none;
}

.wave-separator svg {
    display: block;
    width: 100%;
    height: 80px; /* Reduced further to save vertical space */
}

/* Split Layout Container */
.services-container.split-layout {
    display: flex;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding-top: 60px; /* Reduced padding */
    height: 100%;
    position: relative;
    z-index: 2;
}

/* Left Column: Visual */
.services-visual {
    flex: 0 0 40%; /* Reduced width to give more space to content */
    position: relative;
    display: flex;
    align-items: flex-end; /* Align image to bottom */
    justify-content: flex-start; /* Align to left */
    height: 100%;
    padding-left: 5%; /* Add padding to align with "green box" */
    padding-bottom: 5%;
}

.image-mask-wrapper {
    width: 100%;
    height: 90%; /* Occupy most of the height */
    overflow: visible; 
    display: flex;
    align-items: flex-end; 
    position: relative;
    justify-content: flex-start; 
}

.hero-image {
    width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
    object-position: bottom left; /* Anchor image to bottom left */
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    opacity: 0;
}

/* Right Column: Content */
.services-content {
    flex: 1;
    padding: 10vh 5% 5% 2%; /* Adjusted padding to align with "green box" */
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center content vertically */
    height: 100%;
    gap: 3vh; 
}

.services-header {
    margin-bottom: 1vh;
    flex-shrink: 0; /* Prevent header from shrinking too much */
}

.services-title {
    font-size: clamp(2.5rem, 4vw, 4rem); /* Responsive font size */
    line-height: 0.95;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 2vh;
    display: flex;
    flex-direction: column;
}

.title-part {
    display: block;
}

/* Description Wrapper */
.services-description-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    max-width: 600px;
    margin-left: auto;
    margin-bottom: 6vh; /* Increased spacing to definitely prevent overlap */
}

.curved-arrow {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    transform: rotate(10deg); 
}

.arrow-path, .arrow-head {
    stroke: #BABABA;
}

.services-description {
    font-size: clamp(0.9rem, 1vw, 1.1rem);
    color: #BABABA;
    line-height: 1.3;
}

/* Compact Grid 2x2 */
.services-grid-compact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 10px; /* Reduced gap to bring cards closer together */
    width: 100%;
}

/* Duplicate styles removed */

/* Responsive */
@media (max-width: 1024px) {
    .services-title {
        font-size: 2.8rem;
    }
}

@media (max-width: 768px) {
    .services-section {
        height: auto; /* Allow scroll on mobile */
        min-height: 100vh;
        overflow: visible;
    }

    .services-container.split-layout {
        flex-direction: column;
        padding-top: 60px;
        height: auto;
    }

    .services-visual {
        height: 40vh; /* Smaller image on mobile */
        flex: none;
        width: 100%;
    }
    
    .hero-image {
        height: 100%;
        object-fit: cover;
        object-position: top center;
    }

    .services-content {
        padding: 2rem;
        height: auto;
    }

    .services-title {
        font-size: 2.2rem;
    }
    
    .services-grid-compact {
        grid-template-columns: 1fr; /* Stack cards on mobile */
    }
}

/* --- New Solutions Section (Einstein) --- */
.new-solutions-section {
    position: relative;
    width: 100%;
    height: 100vh; /* Fixed height for pinning */
    background-color: #ffffff;
    overflow: hidden;
    display: flex;
    align-items: center;
    /* No padding here, we control layout inside */
}

.bg-text-servicios {
    position: absolute;
    top: 10%;
    left: 5%;
    transform: none;
    display: flex;
    align-items: baseline;
    z-index: 0;
    pointer-events: none;
    white-space: nowrap;
    opacity: 0.15; /* Subtle opacity */
}

.font-pinyon {
    font-family: 'Pinyon Script', cursive;
    font-size: 20vw; /* Massive Script Letter */
    color: #650c30;
    line-height: 0.5;
    margin-right: -2vw; /* Overlap slightly */
}

.font-gogh {
    font-family: 'Gogh-Regular', sans-serif; /* Fallback to sans-serif */
    font-size: 10vw; /* Smaller sans-serif text */
    color: #650c30;
    text-transform: lowercase;
    font-weight: 400; /* Regular weight like the example */
}

.solutions-container {
    position: relative;
    z-index: 1;
    display: flex;
    width: 100%;
    height: 100%;
    max-width: none;
    gap: 0;
    padding: 0;
    align-items: center; /* Center vertically */
}

.solutions-left {
    flex: 0 0 30%; /* Reduced width to give more space to cards */
    height: auto; /* Auto height to fit content tightly */
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 5%;
    position: relative;
    z-index: 2;
}

.solutions-title {
    font-size: 2rem; /* Significantly smaller */
    line-height: 1.2;
    color: #650c30; /* Updated Brand Color */
    font-weight: 700;
    margin-bottom: 1rem;
    text-shadow: none;
    font-family: 'gogh-regular', sans-serif;
}

.einstein-quote {
    font-size: 1.2rem;
    color: #650c30;
    font-style: italic;
    margin-bottom: 1.5rem;
    font-weight: 500;
    max-width: 100%;
    border-left: 3px solid #650c30;
    padding-left: 10px;
    font-family: 'gogh-regular', sans-serif;
}

.einstein-wrapper {
    position: relative;
    width: 100%;
    max-width: 200px; /* Much smaller image */
    margin-top: 1rem;
}

.einstein-img {
    width: 100%;
    height: auto;
    filter: grayscale(100%);
    mix-blend-mode: multiply;
    /* Removed mask for cleaner look on smaller size */
}

/* Floating Symbols */
.floating-symbol {
    position: absolute;
    font-family: 'Times New Roman', serif;
    font-weight: bold;
    color: #650c30;
    opacity: 0.5;
    pointer-events: none;
}
.sym-1 { top: 0%; right: -20%; font-size: 1.5rem; }
.sym-2 { top: 50%; left: -20%; font-size: 2.5rem; }
.sym-3 { bottom: 10%; right: -10%; font-size: 2rem; }
.sym-4 { top: -20%; left: 10%; font-size: 1.5rem; }

/* The Track for Horizontal Scroll */
.solutions-right-track {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center; /* Center in the right half */
    height: 100%;
    padding-left: 0; 
    margin-left: 10%; /* Push slightly more to right */
}

.solution-card {
    position: absolute;
    top: 50%;
    left: 50%; /* Center initially, JS will animate */
    transform: translate(-50%, -50%);
    width: 280px;
    height: 420px;
    background-color: #650c30;
    border-radius: 20px;
    overflow: hidden;
    color: white;
    display: flex;
    flex-direction: column;
    box-shadow: -10px 10px 30px rgba(0,0,0,0.3);
    transition: transform 0.3s ease;
    border: 1px solid rgba(255,255,255,0.1);
    transform-origin: bottom center; /* Pivot point for fan effect */
    text-align: center; /* Center text */
    font-family: 'gogh-regular', sans-serif;
}

.solution-card:hover {
    transform: translate(-50%, -70%) scale(1.05) rotate(0deg) !important; /* Pop up straight on hover */
    z-index: 100 !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5);
}

.solution-card.card-1,
.solution-card.card-2,
.solution-card.card-3 {
    cursor: pointer;
}

/* Initial positions for stacking effect (fallback or base) */
/* We will override 'left' or 'transform' in JS, but let's set a base */
.card-1 { z-index: 1; }
.card-2 { z-index: 2; }
.card-3 { z-index: 3; }

.card-number {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 2.5rem;
    font-weight: 900;
    color: rgba(255,255,255,0.1);
    z-index: 0;
}

.card-content {
    padding: 1.5rem 1.2rem;
    flex: 1;
    position: relative;
    z-index: 1;
    background: linear-gradient(to bottom, #650c30 0%, #45061f 100%); /* Updated Gradient */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: 'gogh-regular', sans-serif;
}

.card-content h3 {
    font-family: 'gogh-regular', sans-serif;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    line-height: 1.2;
    color: #fff;
    background: none;
    -webkit-text-fill-color: initial;
    text-align: center;
}

.card-content p {
    font-family: 'gogh-regular', sans-serif;
    font-size: 1.2rem;
    line-height: 1.4;
    opacity: 0.9;
    font-weight: 300;
    text-align: center;
}

.card-img-area {
    height: 120px;
    background-size: cover;
    background-position: center;
    position: relative;
}

.card-img-area::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, #2a0513 0%, transparent 100%);
}

/* Placeholders for card images */
.img-1 { background-image: url('https://images.unsplash.com/photo-1460925895917-afdab827c52f?q=80&w=2015&auto=format&fit=crop'); }
.img-2 { background-image: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?q=80&w=2070&auto=format&fit=crop'); }
.img-3 { background-image: url('https://images.unsplash.com/photo-1533750349088-cd871a92f312?q=80&w=2070&auto=format&fit=crop'); }

@media (max-width: 992px) {
    .new-solutions-section {
        height: auto;
        flex-direction: column;
        overflow: visible;
    }
    
    .solutions-left {
        width: 100%;
        padding: 3rem 5%;
        text-align: center;
    }
    
    .einstein-wrapper {
        margin: 0 auto;
        max-width: 300px;
    }
    
    .solutions-right-track {
        width: 100%;
        flex-direction: column;
        padding: 0 5% 3rem 5%;
        gap: 2rem;
    }
    
    .solution-card {
        width: 100%;
        height: auto;
        flex: none;
    }
    
    .bg-text-servicios {
        display: none; /* Hide on mobile to avoid clutter */
    }
}

/* Popup Styles */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.popup-overlay.active {
    opacity: 1;
    visibility: visible;
}

.popup-container {
    background-color: #fff;
    background-image: 
        linear-gradient(#f0f0f0 1px, transparent 1px),
        linear-gradient(90deg, #f0f0f0 1px, transparent 1px);
    background-size: 40px 40px; /* Grid effect */
    width: 90%;
    max-width: 1000px;
    max-height: 90vh;
    border-radius: 20px;
    position: relative;
    overflow-y: auto; /* Allow scrolling if content is too tall */
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    display: flex;
    flex-direction: column;
}

.popup-close {
    position: absolute;
    top: 15px;
    right: 20px;
    background: none;
    border: none;
    font-size: 2rem;
    cursor: pointer;
    color: #333;
    z-index: 10;
    transition: color 0.3s;
}

.popup-close:hover {
    color: #650C30;
}

.popup-content {
    display: flex;
    flex-direction: row;
    padding: 40px;
    gap: 40px;
    align-items: center;
}

.popup-text {
    flex: 1;
    font-family: 'gogh-regular', sans-serif;
    color: #333;
}

.popup-title {
    font-size: 2.5rem;
    line-height: 1.5;
    color: #650C30; /* Using the brand color seen in other sections */
    margin-bottom: 30px;
    font-weight: 100;
    font-family: 'gogh-regular', sans-serif;
}

.popup-title .font-pinyon {
    font-family: 'Pinyon Script', cursive;
    font-size: 4.7rem;
    font-weight: 500;
    display: inline-block;
    margin-right: 5px; /* Fix overlap */
    vertical-align: middle;
    transform: translateY(5px); /* Slight adjustment */
}

.popup-text p {
    margin-bottom: 20px;
    font-size: 1.1rem;
    line-height: 1.6;
}

.popup-image {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup-image img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    /* Optional: Add a subtle shadow to the image if needed */
}

/* Responsive adjustments for Popup */
@media (max-width: 768px) {
    .popup-content {
        flex-direction: column-reverse; /* Image on top or bottom? Let's keep text first or image first. Usually image top on mobile. */
        padding: 30px 20px;
    }
    
    .popup-title {
        font-size: 2rem;
    }
    
    .popup-title .font-pinyon {
        font-size: 3rem;
    }
}

/* EbizAcademy Popup Styles */
.popup-academy-style {
    background-image: url('../assets/bg.jpg') !important; /* Override grid */
    background-size: cover !important;
    background-position: center !important;
    border: 20px solid #650c30;
    background-color: #fff; /* Fallback */
    height: 85vh; /* Fixed height */
    max-height: 800px;
    overflow: hidden; /* Remove scroll */
    display: flex;
    flex-direction: column;
}

/* Reduce padding for this specific popup to save space */
.popup-academy-style .popup-content {
    padding: 30px; /* Reduced from 40px */
    gap: 20px; /* Reduced gap */
    height: 100%;
    display: flex;
    align-items: center;
}

.popup-logo-academy {
    max-width: 200px; /* Slightly smaller logo */
    margin-bottom: -25px;
    display: block;
}

.popup-academy-style .popup-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.popup-academy-style .popup-text p {
    margin-bottom: 15px;
    font-size: 1.1rem;
    line-height: 1.4;
}

.popup-formamos-img {
    max-width: 300px;
    height: auto;
    margin-top: 20px;
    display: block;
}

.popup-academy-style .popup-image {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.popup-academy-style .popup-image img {
    max-height: 100%;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

/* Remove old text styles */
.popup-footer-text { display: none; }

/* Popup Ebiz Specific Styles */
.popup-ebiz-style {
    background-image: url('../assets/ebiz img.webp') !important;
    background-size: cover !important;
    background-position: center !important;
    border: none;
    width: 90%; /* Match ebizacademy width */
    max-width: 1000px; /* Match ebizacademy max-width */
    height: 85vh;
    max-height: 800px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.popup-ebiz-style .popup-content {
    display: block;
    padding: 40px 50px;
    position: relative;
    height: 100%;
    width: 100%;
}

.popup-ebiz-style .popup-text-content {
    width: 45%; /* Reduced width to avoid overlap */
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 30px;
    margin-top: 95px;
}

/* Highlight Box */
.highlight-box {
    background-color: rgba(180, 170, 160, 0.5);
    padding: 20px 20px;
    position: relative;
    margin-bottom: 10px;
    margin-left: 20px;
    font-family: 'gogh-regular', sans-serif;
}

/* Vertical Line with Dots */
.highlight-box::before {
    content: '';
    position: absolute;
    left: -15px;
    top: 0;
    bottom: 0;
    width: 8px;
    background: 
        radial-gradient(circle, #000 40%, transparent 45%) top center / 8px 8px no-repeat,
        radial-gradient(circle, #000 40%, transparent 45%) bottom center / 8px 8px no-repeat,
        linear-gradient(#000, #000) center / 2px 100% no-repeat;
}

.highlight-box::after {
    display: none;
}

.highlight-box p {
    font-family: 'gogh-regular', sans-serif;
    font-size: 1.2rem;
    color: #222;
    line-height: 1.3;
    margin: 0;
    max-width: 95%; /* Allow full width of container */
}

/* Main Description */
.main-description {
    font-family: 'gogh-regular', sans-serif;
    font-size: 1.2rem;
    color: #000;
    line-height: 1.4;
    max-width: 90%; /* Allow full width of container */
    margin-left: 20px;

}

/* Webs Image Replacement */
.webs-image-container {
    margin-top: -95px;
    margin-left: 20px;
    width: fit-content;
}

.webs-img-replacement {
    max-width: 350px;
    height: auto;
    display: block;
}

/* Footer */
.popup-footer {
    position: absolute;
    bottom: 40px;
    right: 80px;
    text-align: left;
    font-family: 'gogh-regular', sans-serif;
}

.footer-instruction {
    font-size: 1.0rem;
    color: #444;
    margin-bottom: 10px;
    font-weight: 500;
    font-family: 'gogh-regular', sans-serif;
}

.footer-links {
    display: flex;
    gap: 15px;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.ebiz-link {
    color: #650c30;
    font-weight: bold;
    text-decoration: underline;
    font-size: 1rem;
    text-transform: uppercase;
    transition: opacity 0.3s;
}

.ebiz-link:hover {
    opacity: 0.7;
}

.separator {
    color: #650c30;
    font-weight: bold;
}

/* Responsive */
@media (max-width: 900px) {
    .popup-ebiz-style .popup-text-content {
        width: 100%;
        height: auto;
        justify-content: flex-start;
    }
    .popup-footer {
        position: relative;
        bottom: auto;
        right: auto;
        margin-top: 30px;
        text-align: left;
    }
    .footer-links {
        justify-content: flex-start;
    }
    .popup-ebiz-style {
        height: auto;
        max-height: 90vh;
        overflow-y: auto;
    }
}

/* Animations for Ebiz Popup Elements */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes floatWebs {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

/* Apply animations when popup is active */
.popup-overlay.active .popup-ebiz-style .highlight-box {
    animation: fadeInUp 0.8s ease-out 0.2s both;
}

.popup-overlay.active .popup-ebiz-style .main-description {
    animation: fadeInUp 0.8s ease-out 0.4s both;
}

.popup-overlay.active .popup-ebiz-style .webs-image-container {
    animation: fadeInUp 0.8s ease-out 0.6s both;
}

.popup-overlay.active .popup-ebiz-style .popup-footer {
    animation: fadeInUp 0.8s ease-out 0.8s both;
}

/* Continuous floating movement for Webs image */
.popup-overlay.active .popup-ebiz-style .webs-img-replacement {
    animation: floatWebs 3s ease-in-out infinite;
}