@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
:root {
    --primary-green: #00CDA3; --dark-green: #009A7A; --accent-blue: #4A90E2;
    --bg-white: #FFFFFF; --bg-off-white: #F9FAFB; --text-dark: #1F2937;
    --text-medium: #4B5563; --text-light: #6B7280; --border-ultra-light: #F3F4F6;
    --border-light: #E5E7EB; --shadow-subtle: 0 4px 12px rgba(0,0,0,0.04);
    --shadow-card: 0 8px 24px rgba(0,0,0,0.06); --font-main: 'Inter', sans-serif;
    --transition-smooth: all 0.4s cubic-bezier(0.4,0,0.2,1);
    --transition-fast: all 0.25s cubic-bezier(0.4,0,0.2,1);
}
#preloader { position: fixed; top:0; left:0; width:100%; height:100%; background-color:var(--bg-white); display:flex; justify-content:center; align-items:center; z-index:9999; opacity:1; transition:opacity 0.5s ease-out; }
#preloader.loaded { opacity:0; pointer-events:none; }
.loader-spinner { width:50px; height:50px; border:5px solid var(--border-light); border-top-color:var(--primary-green); border-radius:50%; animation:spin 1s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:var(--font-main); color:var(--text-medium); background-color:var(--bg-white); line-height:1.65; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-x:hidden; position:relative; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
body::-webkit-scrollbar { width:8px; } body::-webkit-scrollbar-track { background:var(--bg-off-white); } body::-webkit-scrollbar-thumb { background-color:var(--primary-green); border-radius:10px; border:2px solid var(--bg-off-white); }
h1,h2,h3,h4 { font-weight:700; color:var(--text-dark); line-height:1.25; margin-bottom:0.5em; }
h1 { font-size:clamp(2.2rem,4.5vw,3.2rem); letter-spacing:-0.03em; font-weight:800; } h2 { font-size:clamp(2.2rem,4.5vw,3rem); letter-spacing:-0.02em; } h3 { font-size:clamp(1.5rem,3.5vw,2rem); font-weight:600; } h4 { font-size:clamp(1.1rem,2.8vw,1.4rem); font-weight:600; }
p { margin-bottom:1.3em; color:var(--text-light); font-size:clamp(0.95rem,1.8vw,1.05rem); }
a { text-decoration:none; color:var(--primary-green); transition:var(--transition-fast); } a:hover { color:var(--dark-green); }
.container { width:90%; max-width:1200px; margin-left:auto; margin-right:auto; padding:0 15px; } .container-fluid { width:100%; padding:0; margin:0; }
section { padding:clamp(50px,10vh,100px) 0; position:relative; overflow:hidden; }
.section-header { text-align:center; margin-bottom:clamp(50px,8vw,80px); }
.section-header .eyebrow { display:inline-block; color:var(--primary-green); font-weight:600; font-size:0.9rem; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:10px; padding:6px 12px; background-color:rgba(0,205,163,0.08); border-radius:20px; }
.section-header h2 { margin-bottom:15px; } .section-header p.subtitle { font-size:clamp(1rem,2vw,1.15rem); color:var(--text-medium); max-width:750px; margin:0 auto; line-height:1.6; }
.cta-button-primary { display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(95deg,var(--primary-green) 0%,var(--dark-green) 100%); color:var(--bg-white) !important; padding:16px 36px; border-radius:8px; font-weight:600; font-size:clamp(1rem,1.8vw,1.1rem); transition:var(--transition-smooth); box-shadow:0 4px 12px rgba(0,205,163,0.25),0 0 0 0 rgba(0,205,163,0.5); position:relative; overflow:hidden; z-index:1; border:none; }
.cta-button-primary:hover { transform:translateY(-3px) scale(1.02); box-shadow:0 8px 20px rgba(0,205,163,0.3),0 0 15px 2px rgba(0,205,163,0.3); }
.cta-button-primary .agent-faces { display:inline-flex; margin-left:12px; } .cta-button-primary .agent-face { width:28px; height:28px; border-radius:50%; border:2px solid var(--bg-white); background-color:var(--border-light); margin-left:-8px; display:inline-block; background-size:cover; background-position:center; } .cta-button-primary .agent-face:first-child { margin-left:0; }
.cta-button-secondary { display:inline-flex; align-items:center; justify-content:center; background-color:transparent; color:var(--primary-green) !important; padding:14px 32px; border-radius:8px; font-weight:600; font-size:clamp(0.95rem,1.7vw,1.05rem); transition:var(--transition-smooth); border:2px solid var(--primary-green); margin-left:15px; } .cta-button-secondary:hover { background-color:rgba(0,205,163,0.08); color:var(--dark-green) !important; border-color:var(--dark-green); transform:translateY(-2px); }
.main-header { position:fixed; top:0; left:0; width:100%; z-index:1000; padding:20px 0; transition:padding 0.3s ease,background-color 0.3s ease,backdrop-filter 0.3s ease,box-shadow 0.3s ease; }
.main-header.scrolled { padding:15px 0; background-color:rgba(255,255,255,0.9); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-shadow:var(--shadow-subtle); }
.nav-container { display:flex; justify-content:space-between; align-items:center; width:90%; max-width:1300px; margin:0 auto; }
.logo img { height:40px; transition:height 0.3s ease; } .main-header.scrolled .logo img { height:36px; }
.main-nav ul { list-style:none; display:flex; } .main-nav li { margin-left:35px; } .main-nav a { font-weight:500; font-size:0.95rem; color:var(--text-dark); padding:8px 0; position:relative; } .main-nav a::after { content:''; position:absolute; bottom:-2px; left:0; width:0; height:2px; background-color:var(--primary-green); transition:width 0.3s ease; } .main-nav a:hover::after, .main-nav a.active::after { width:100%; }
.menu-toggle { display:none; font-size:1.8rem; cursor:pointer; color:var(--text-dark); } .menu-toggle .line { transition:transform 0.3s ease,opacity 0.3s ease; }
.animate-init { opacity:0; } .animate-on-scroll { transition-property:opacity,transform; transition-duration:0.8s; transition-timing-function:cubic-bezier(0.2,0.8,0.2,1); } .animate-fade-in { transform:translateY(0); } .animate-slide-up { transform:translateY(40px); } .animate-slide-left { transform:translateX(-40px); } .animate-slide-right { transform:translateX(40px); } .animate-scale-in { transform:scale(0.9); }
.is-visible { opacity:1 !important; transform:translate(0,0) scale(1) !important; }
.stagger-children > * { opacity:0; transform:translateY(20px); transition:opacity 0.6s ease,transform 0.6s ease; } .stagger-children.is-visible > * { opacity:1; transform:translateY(0); }
#hero { position:relative; padding-top:80px; padding-bottom:clamp(20px,4vh,30px); background-color:var(--bg-white); display:flex; align-items:center; overflow:hidden; }
#hero-canvas-background { position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; opacity:0.6; }
.hero-main-container { position:relative; z-index:1; display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:clamp(20px,4vw,50px); width:90%; max-width:1300px; margin-left:auto; margin-right:auto; }
.hero-text-content { position:relative; z-index:1; text-align:left; padding-right:20px; }
.hero-text-content .g2-badge { display:inline-flex; align-items:center; background-color:rgba(0,205,163,0.1); color:var(--primary-green); padding:8px 16px; border-radius:25px; font-weight:600; font-size:0.8rem; letter-spacing:0.03em; margin-bottom:clamp(10px,2vh,15px); }
.hero-text-content .g2-badge svg { margin-right:8px; width:14px; height:14px; }
.hero-text-content h1 { font-size:clamp(2.2rem,4.5vw,3.2rem); margin-bottom:clamp(15px,2vh,20px); line-height:1.15; } .hero-text-content h1 .highlight { color:var(--primary-green); }
.hero-subheadline { font-size:clamp(1rem,1.8vw,1.15rem); color:var(--text-medium); max-width:580px; margin-bottom:clamp(15px,3vh,20px); line-height:1.6; }
.hero-cta-group { margin-top:clamp(20px,3vh,25px); display:flex; flex-wrap:wrap; align-items:center; gap:15px; }
.hero-visual-content { position:relative; z-index:1; height:100%; min-height:clamp(250px,30vh,320px); display:flex; align-items:center; justify-content:center; }
.hero-visual-content img { display:block; max-width:100%; max-height:100%; height:auto; width:auto; object-fit:contain; border-radius:10px; }

.trusted-by-section { padding-top:clamp(10px,2vh,20px); padding-bottom:clamp(20px,4vh,30px); text-align:center; background-color:var(--bg-white); }
.trusted-by-section p { font-size:clamp(0.8rem,1.3vh,0.9rem); color:var(--text-light); margin-bottom:clamp(10px,2vh,15px); text-transform:uppercase; letter-spacing:0.08em; font-weight:500; }
.hero-partner-logos { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:clamp(20px,4vw,40px); }
.hero-partner-logos img { height:clamp(50px,4vh,55px); opacity:0.4; filter:grayscale(1%); transition:var(--transition-fast); } .hero-partner-logos img:hover { opacity:0.9; filter:grayscale(0%); }
.feature-card { background-color:var(--bg-white); padding:clamp(25px,4vw,40px); border-radius:12px; box-shadow:var(--shadow-subtle); border:1px solid var(--border-ultra-light); transition:var(--transition-smooth); text-align:left; height:100%; }
.feature-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-card); border-color:rgba(0,205,163,0.3); }
.feature-card .icon-wrapper { display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; background-color:rgba(0,205,163,0.1); border-radius:10px; margin-bottom:20px; } .feature-card .icon-wrapper svg { width:28px; height:28px; color:var(--primary-green); }
.feature-card h3 { margin-bottom:10px; font-size:1.3rem; } .feature-card p { font-size:0.95rem; margin-bottom:0; }
#about { background-color:var(--bg-off-white); }
.about-grid { display:grid; grid-template-columns:1fr 0.9fr; gap:clamp(40px,6vw,80px); align-items:center; }
.about-content h3.subtitle-accent { color:var(--primary-green); margin-bottom:15px; font-size:1.6rem; }
.about-graphics { height:450px; display:flex; align-items:center; justify-content:center; position:relative; }
.grid-layout { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:30px; }
.product-showcase { background-color:var(--bg-white); border-radius:16px; box-shadow:var(--shadow-card); padding:clamp(40px,6vw,60px); margin-bottom:70px; display:grid; grid-template-columns:0.8fr 1fr; gap:clamp(40px,5vw,70px); align-items:center; }
.product-showcase.reverse { grid-template-columns:1fr 0.8fr; }
.product-showcase.reverse .product-graphic-container { grid-column:2 / 3; grid-row:1 / 2; }
.product-showcase.reverse .product-details { grid-column:1 / 2; grid-row:1 / 2; }
.product-graphic-container { height:400px; background-color:var(--bg-off-white); border-radius:12px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; border:1px solid var(--border-light); }
.product-graphic-container .mockup-placeholder { font-size:1.3rem; color:var(--text-light); opacity:0.7; }
.product-details .tag { display:inline-block; color:var(--primary-green); font-weight:600; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:12px; padding:5px 10px; background-color:rgba(0,205,163,0.08); border-radius:20px; }
.product-details h3 { font-size:clamp(1.8rem,4vw,2.5rem); color:var(--text-dark); margin-bottom:15px; }
.product-details ul { list-style:none; padding-left:0; margin-top:20px; } .product-details ul li { padding-left:30px; position:relative; margin-bottom:12px; font-size:1rem; color:var(--text-medium); } .product-details ul li::before { content:''; position:absolute; left:0; top:7px; width:10px; height:10px; background-color:var(--primary-green); border-radius:50%; box-shadow:0 0 8px rgba(0,205,163,0.5); }
.product-example { font-style:italic; color:var(--text-light); margin-top:25px; padding:15px; background-color:var(--bg-off-white); border-left:4px solid var(--primary-green); border-radius:0 8px 8px 0; font-size:0.95rem; }
.multilingual-feature { margin-top:70px; padding:40px; background-color:var(--bg-off-white); border-radius:12px; text-align:center; } .multilingual-feature .icon-wrapper { margin:0 auto 20px auto; } .multilingual-feature h3 { font-size:1.6rem; }
#solutions { background-color:var(--bg-off-white); }
.solutions-carousel-wrapper { position:relative; } .solutions-carousel { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:30px; padding-bottom:20px; -ms-overflow-style:none; scrollbar-width:none; } .solutions-carousel::-webkit-scrollbar { display:none; }
.solution-card { flex:0 0 clamp(320px,30vw,380px); scroll-snap-align:start; position:relative; border-radius:12px; overflow:hidden; height:420px; box-shadow:var(--shadow-card); transition:var(--transition-smooth); } .solution-card:hover { transform:translateY(-5px) scale(1.02); }
.solution-card img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; } .solution-card:hover img { transform:scale(1.08); }
.solution-overlay { position:absolute; bottom:0; left:0; width:100%; padding:50px 25px 25px; background:linear-gradient(transparent,rgba(0,0,0,0.85) 60%); color:var(--bg-white); } .solution-overlay h3 { color:var(--bg-white); font-size:1.5rem; margin-bottom:8px; } .solution-overlay p { color:rgba(255,255,255,0.8); font-size:0.9rem; max-height:0; opacity:0; overflow:hidden; transition:max-height 0.4s ease,opacity 0.4s ease 0.1s; } .solution-card:hover .solution-overlay p { max-height:80px; opacity:1; }
.process-steps-container { display:flex; justify-content:space-between; position:relative; flex-wrap:wrap; margin-top:40px; gap: 20px; }
.process-step { flex:1; min-width:220px; text-align:center; padding:20px; position:relative; z-index:1; } .process-step .step-indicator { width:64px; height:64px; margin:0 auto 25px; border-radius:50%; background-color:var(--bg-white); border:2px solid var(--primary-green); display:flex; align-items:center; justify-content:center; font-size:1.5rem; font-weight:700; color:var(--primary-green); box-shadow:var(--shadow-subtle); transition:var(--transition-smooth); } .process-step:hover .step-indicator { transform:scale(1.1) rotate(5deg); background-color:var(--primary-green); color:var(--bg-white); box-shadow:0 6px 15px rgba(0,205,163,0.3); } .process-step h4 { font-size:1.15rem; margin-bottom:8px; font-weight:600; }
#contact { background:linear-gradient(180deg,var(--bg-off-white) 0%,var(--bg-white) 70%); }
.contact-wrapper { display:grid; grid-template-columns:0.8fr 1fr; gap:clamp(50px,8vw,100px); background-color:var(--bg-white); padding:clamp(40px,6vw,70px); border-radius:16px; box-shadow:var(--shadow-card); border:1px solid var(--border-light); }
.contact-info h3 { color:var(--text-dark); font-size:1.8rem; margin-bottom:20px; } .contact-info .info-item { display:flex; align-items:flex-start; margin-bottom:20px; } .contact-info .info-item .icon-wrapper { flex-shrink:0; width:44px; height:44px; background-color:rgba(0,205,163,0.1); border-radius:8px; display:flex; align-items:center; justify-content:center; margin-right:15px; } .contact-info .info-item .icon-wrapper svg { width:22px; height:22px; color:var(--primary-green); }
.contact-form label { display:block; font-weight:500; margin-bottom:8px; color:var(--text-dark); font-size:0.9rem; } .contact-form .form-group { margin-bottom:20px; } .contact-form input,.contact-form textarea { width:100%; padding:14px 18px; border:1px solid var(--border-light); border-radius:8px; font-family:var(--font-main); font-size:1rem; transition:var(--transition-fast); background-color:var(--bg-off-white); } .contact-form input:focus,.contact-form textarea:focus { outline:none; border-color:var(--primary-green); box-shadow:0 0 0 3px rgba(0,205,163,0.2); background-color:var(--bg-white); } .contact-form textarea { min-height:130px; resize:vertical; }
.main-footer { background-color:#111827; color:#9CA3AF; padding:70px 0 30px; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:40px; margin-bottom:50px; } .footer-column h4 { color:var(--bg-white); margin-bottom:20px; font-size:1.1rem; font-weight:600; } .footer-column p,.footer-column ul li { margin-bottom:12px; font-size:0.9rem; } .footer-column ul { list-style:none; } .footer-column ul a { color:#9CA3AF; } .footer-column ul a:hover { color:var(--primary-green); }
.footer-socials a { color:#9CA3AF; margin-right:18px; font-size:1.3rem; } .footer-socials a:hover { color:var(--primary-green); }
.copyright { text-align:center; padding-top:40px; border-top:1px solid #374151; font-size:0.85rem; color:#6B7280; } .copyright a { color:#9CA3AF; } .copyright a:hover { color:var(--primary-green); }

@media (max-width:992px) { 
    #hero { padding-top:90px; padding-bottom:clamp(15px,2vh,20px); }
    .hero-main-container {
        grid-template-columns:1fr; 
        text-align:center;
        gap: clamp(20px, 4vw, 40px); 
    }
    .hero-text-content {
        padding-right:0;
        text-align:center;
        margin-bottom:clamp(20px,3vh,30px);
    }
    .hero-text-content .g2-badge { margin-left:auto; margin-right:auto; }
    .hero-cta-group { justify-content:center; }
    .hero-visual-content {
        min-height:clamp(220px,28vh,280px);
        max-height:35vh;
        max-width:80%;
        margin:0 auto; 

    }
    .hero-visual-content img { object-fit:contain; }
    .hero-subheadline { margin-left:auto; margin-right:auto; }

    .trusted-by-section { padding-top:clamp(10px,2vh,15px); padding-bottom:clamp(15px,3vh,25px); }
    .hero-partner-logos img { height:clamp(28px,3.2vh,32px); }

    .about-grid,
    .product-showcase,
    .product-showcase.reverse,
    .contact-wrapper {
        grid-template-columns:1fr;
        gap: clamp(30px, 5vw, 50px); 
    }

    .about-content, .about-graphics,
    .product-details, .product-graphic-container,
    .contact-info, .contact-form {
        grid-column: 1 / -1 !important; 
        grid-row: auto !important;      
    }

    .product-showcase .product-graphic-container {
         margin-bottom: 30px;
    }
    
    .product-showcase.reverse .product-graphic-container {
        margin-bottom: 30px; 
    }
    
    .product-showcase.reverse .product-details { 
        margin-bottom: 0; 
    }

    .about-graphics {
        height:300px; 
        margin-top:20px; 
        max-width: 90%;
        margin-left: auto;
        margin-right: auto;
    }

    .process-steps-container {
        flex-direction: column;
        align-items: center; 
        gap: 30px; 
    }
    .process-steps-container::before { display:none; } 
    .process-step {
        min-width: 80%; 
        max-width: 400px; 
    }
}

@media (max-width:768px) { 
    #hero { padding-top:80px; padding-bottom:15px; }
    .hero-text-content h1 { font-size:clamp(1.8rem,6vw,2.4rem); line-height:1.2; margin-bottom:10px; }
    .hero-subheadline { font-size:clamp(0.85rem,3.5vw,1rem); margin-bottom:15px; line-height:1.5; }
    .hero-text-content .g2-badge { font-size:0.75rem; padding:6px 12px; margin-bottom:8px; }
    .hero-cta-group { flex-direction:column; gap:12px; margin-top:15px; }
    .cta-button-primary,.cta-button-secondary { width:100%; max-width:280px; margin-left:0; padding:12px 24px; font-size:clamp(0.9rem,2.5vw,1rem); }
    .cta-button-primary .agent-face { width:24px; height:24px; }

    .hero-visual-content { 
        display: none;
    }

    .trusted-by-section { padding-top:10px; padding-bottom:20px; }
    .trusted-by-section p { font-size:0.75rem; margin-bottom:10px; }
    .hero-partner-logos { gap:clamp(15px,3vw,30px); }
    .hero-partner-logos img { height:clamp(24px,3vh,28px); }
    h2 { font-size:clamp(1.8rem,4vw,2.5rem); }

    .product-graphic-container {
        height: 300px;
        padding: 20px;
    }
    .product-image {
        max-width: 90%;
        max-height: 90%;
    }
    .product-image-dark-bg-wrapper {
        padding: 15px;
    }
    .product-details h3 {
        font-size:clamp(1.5rem, 5vw, 2rem); 
    }
    .product-details ul li {
        font-size: 0.9rem; 
    }
    .contact-wrapper {
        padding: clamp(30px, 5vw, 50px); 
    }

    .menu-toggle { display:flex; align-items:center; justify-content:center; }
    .main-nav { position:fixed; top:0; right:-100%; width:min(80vw,320px); height:100vh; background-color:var(--bg-white); box-shadow:-5px 0 20px rgba(0,0,0,0.1); padding-top:70px; transition:right 0.4s cubic-bezier(0.6,0.05,0.28,0.91); z-index:999; }
    .main-nav.active { right:0; }
    .main-nav ul { flex-direction:column; align-items:flex-start; padding:25px; }
    .main-nav li { margin:0; width:100%; }
    .main-nav a { display:block; padding:16px 10px; width:100%; border-bottom:1px solid var(--border-ultra-light); font-size:1rem; }
    .main-nav a::after { display:none; }
    .main-nav li:last-child a { border-bottom:none; }
    section { padding:clamp(60px,8vh,80px) 0; } 
}

@keyframes gradientBG { 0% {background-position:0% 50%} 50% {background-position:100% 50%} 100% {background-position:0% 50%} }
#network-container { width:100%; height:100%; }
#network-container svg { display:block; width:100%; height:100%; }
.node { cursor:pointer; transform-origin:0 0; animation:fadeInNodeGraph 0.7s cubic-bezier(0.25,0.8,0.25,1) forwards; animation-delay:var(--graph-delay,0s); }
@keyframes fadeInNodeGraph { to { opacity:1; transform:translate(var(--tx,0px),var(--ty,0px)) scale(1); } }
.outer-node .node-circle { fill:url(#grad-outer-node-green); stroke:#81C784; stroke-width:1.5px; filter:drop-shadow(0px 3px 6px rgba(0,0,0,0.12)); transition:filter 0.25s ease-out,transform 0.25s ease-out; }
.outer-node:hover .node-circle { filter:drop-shadow(0px 5px 10px rgba(0,0,0,0.18)) brightness(1.03); transform:scale(1.05); }
.outer-node text { fill:#2E7D32; font-size:10.5px; font-weight:500; text-anchor:middle; dominant-baseline:central; pointer-events:none; paint-order:stroke; stroke:#FFFFFF; stroke-width:2px; stroke-linejoin:round; }
.inner-node .inner-node-logo { filter:drop-shadow(0px 4px 8px rgba(0,0,0,0.2)); transition:filter 0.25s ease-out,transform 0.25s ease-out; }
.inner-node:hover .inner-node-logo { filter:drop-shadow(0px 6px 12px rgba(0,0,0,0.3)); transform:scale(1.08); }
.link { stroke:#7CB342; stroke-width:1.2px; opacity:0.55; stroke-dasharray:5 5; animation:antTrail 3s linear infinite; }
@keyframes antTrail { to { stroke-dashoffset:-10; } }

.product-showcase {
    transition: var(--transition-smooth);
}
.product-showcase:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}
.product-showcase:hover .product-graphic-container {
    border-color: rgba(0, 205, 163, 0.4);
    transform: scale(1.02);
}
.product-image {
    display: block;
    max-width: 85%;
    max-height: 85%;
    object-fit: contain;
    border-radius: 8px;
    transition: transform 0.3s ease-out, filter 0.3s ease-out;
    filter: drop-shadow(0px 4px 10px rgba(0,0,0,0.1));
}
.product-showcase:hover .product-image {
    transform: scale(1.05);
    filter: drop-shadow(0px 6px 15px rgba(0,0,0,0.15));
}
.product-image-dark-bg-wrapper {
    background-color: #2D3748;
    padding: 20px;
    border-radius: 10px;
    box-shadow: inset 0 0 15px rgba(0,0,0,0.2), 0px 2px 5px rgba(0,0,0,0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    max-height: 100%;
}
.product-image-dark-bg-wrapper .product-image {
    max-width: 100%;
    max-height: 100%;
    filter: none;
    border-radius: 4px;
}
#iitjobs-graphic-container.product-graphic-container {

}