.elementor-29286 .elementor-element.elementor-element-d24f841{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-29286 .elementor-element.elementor-element-d24f841:not(.elementor-motion-effects-element-type-background), .elementor-29286 .elementor-element.elementor-element-d24f841 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}.elementor-29286 .elementor-element.elementor-element-7f5958c.elementor-element{--align-self:center;}/* Start custom CSS for html, class: .elementor-element-7f5958c */.framer-chrome-container {
    width: 400px; /* Ajuste conforme necessário */
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    filter: contrast(120%) brightness(110%);
}

.chrome-shape {
    width: 300px;
    height: 350px;
    position: relative;
    
    /* 1. O MESH GRADIENT (Cores da sua imagem) */
    background: radial-gradient(at 0% 0%, #ff9a9e 0%, transparent 50%),
                radial-gradient(at 100% 0%, #fad0c4 0%, transparent 50%),
                radial-gradient(at 100% 100%, #ffecd2 0%, transparent 50%),
                radial-gradient(at 0% 100%, #fcb69f 0%, transparent 50%),
                #ff8177; /* Cor base */
    background-size: 200% 200%;
    animation: meshMovement 10s ease infinite;

    /* 2. A FORMA (Clip-path ou Mask) */
    /* Usei um clip-path para simular a geometria da imagem */
    clip-path: polygon(30% 0%, 100% 0%, 100% 30%, 60% 30%, 60% 45%, 100% 45%, 100% 75%, 60% 75%, 60% 100%, 0% 100%, 0% 70%, 40% 70%, 40% 55%, 0% 55%, 0% 25%, 40% 25%, 40% 15%);

    /* 3. O FILTRO DE LÍQUIDO */
    filter: url(#liquid-chrome);
    
    /* Borda sutil de vidro */
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Animação das cores "vivas" */
@keyframes meshMovement {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Efeito de flutuação suave */
.framer-chrome-container:hover .chrome-shape {
    transform: scale(1.05) rotate(2deg);
    transition: all 0.8s ease-in-out;
}/* End custom CSS */