{"id":1290,"date":"2024-11-21T22:27:58","date_gmt":"2024-11-22T01:27:58","guid":{"rendered":"https:\/\/development.texin.com.br\/?page_id=1290"},"modified":"2025-03-26T12:35:31","modified_gmt":"2025-03-26T15:35:31","slug":"artesanato-e-decoracao-2","status":"publish","type":"page","link":"https:\/\/texin.com.br\/es\/artesanato-e-decoracao-2\/","title":{"rendered":"ARTESAN\u00cdA Y DECORACI\u00d3N"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"1290\" class=\"elementor elementor-1290\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\" data-elementor-post-type=\"page\">\n\t\t\t\t<div data-particle_enable=\"false\" data-particle-mobile-disabled=\"false\" class=\"elementor-element elementor-element-dc48d83 e-flex e-con-boxed e-con e-parent\" data-id=\"dc48d83\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9d74b9f elementor-widget elementor-widget-text-editor\" data-id=\"9d74b9f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\u00a1DESCUBRE NUESTRO PORTAFOLIO PARA MANUALIDADES Y DECORACI\u00d3N! \u00a1AQU\u00cd ENCONTRAR\u00c1S LOS MEJORES HILOS Y MATERIALES PARA TUS TRABAJOS!\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div data-particle_enable=\"false\" data-particle-mobile-disabled=\"false\" class=\"elementor-element elementor-element-a397adc e-flex e-con-boxed e-con e-parent\" data-id=\"a397adc\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-55e3831 elementor-widget elementor-widget-html\" data-id=\"55e3831\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"pt-BR\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    \n    <style>\n        body {\n            margin: 0;\n            padding: 0;\n            overflow-x: hidden;\n        }\n\n        .row-box {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 10px;\n            justify-content: center;\n            max-width: 98%;\n            margin: 0 auto;\n            opacity: 1; \/* Agora sempre vis\u00edvel *\/\n        }\n\n        .card-box {\n            flex: 1 1 5%; \/* Cada card ocupar\u00e1 22% do container, ajustando-se para 4 em linha *\/\n            max-width: 400px;\n            height: 300px;\n            overflow: hidden;\n            background-color: #fff;\n            background-size: cover;\n            background-position: center;\n            border-radius: 10px;\n            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n             transition: transform 0.3s ease, opacity 0.5s ease;\n            opacity: 0; \/* Come\u00e7a invis\u00edvel *\/\n            transform: translateY(50px); \/* Come\u00e7a deslocado *\/\n            animation: fadeInUp 0.5s forwards; \/* Ativa a anima\u00e7\u00e3o *\/\n        }\n\n        .card-box:nth-child(1) { background-image: url('..\/wp-content\/uploads\/2024\/11\/tc.jpg'); }\n        .card-box:nth-child(2) { background-image: url('..\/wp-content\/uploads\/2024\/11\/ta.jpg'); }\n        .card-box:nth-child(3) { background-image: url('..\/wp-content\/uploads\/2024\/11\/tn.jpg'); }\n        .card-box:nth-child(4) { background-image: url('..\/wp-content\/uploads\/2024\/11\/ace.jpg'); }\n\n        .card-box:hover { transform: scale(1.05); }\n\n        .content {\n            position: absolute;\n            bottom: -100%;\n            left: 0;\n            right: 0;\n            padding: 20px;\n            background: linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));\n            color: white;\n            transition: bottom 0.3s ease;\n        }\n\n        .card-box:hover .content { bottom: 0; }\n\n       \/* .icon {\n            background-color: #EB3E32;\n            width: 82px;\n            height: 82px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            border-radius: 5px;\n            margin-bottom: 10px;\n        }\n\n        .icon img { width: 52px; height: 52px; }*\/\n\n        h2 { margin: 10px 0; font-size: 20px; }\n\n        p { margin: 10px 0; font-size: 14px; }\n\n        button {\n            padding: 10px 20px;\n            background-color: transparent;\n            color: #ff6600;\n            border: 1px solid #ff6600;\n            border-radius: 5px;\n            cursor: pointer;\n            transition: background-color 0.3s ease;\n        }\n\n        button:hover {\n            background-color: #ff6600;\n            color: #fff;\n        }\n\n        \/* Responsivo: Ajusta os cards para 2 por linha em telas menores *\/\n        @media (max-width: 768px) {\n            .card-box { flex: 1 1 45%; }\n        }\n\n        \/* Responsivo: Ajusta para 1 por linha em telas bem pequenas *\/\n        @media (max-width: 480px) {\n            .card-box { flex: 1 1 100%; }\n        }\n\n        @keyframes fadeInUp {\n            0% { opacity: 0; transform: translateY(50px); }\n            100% { opacity: 1; transform: translateY(0); }\n        }\n    <\/style>\n<\/head>\n<body>\n    <div class=\"row-box\">\n        <div class=\"card-box\">\n            <div class=\"content\">\n                <div class=\"icon\">\n                   \n                <\/div>\n                <h2>TRICOT Y GANCHILLO<\/h2>\n                <p><\/p>\n                <a href='https:\/\/texin.com.br\/es\/loja-virtual\/?jsf=jet-woo-products-grid&tax=product_cat:trico-e-croche'><button >SABER M\u00c1S<\/button><\/a>\n            <\/div>\n        <\/div>\n        <div class=\"card-box\">\n            <div class=\"content\">\n                <div class=\"icon\">\n                   \n                <\/div>\n                <h2>CINTA Y\nARTESAN\u00cdA<\/h2>\n                <p><\/p>\n                <a href='https:\/\/texin.com.br\/es\/loja-virtual\/?jsf=jet-woo-products-grid&tax=product_cat:tapecaria-e-artesanato'> <button>SABER M\u00c1S<\/button><\/a>\n            <\/div>\n        <\/div>\n        <div class=\"card-box\">\n            <div class=\"content\">\n                <div class=\"icon\">\n                    \n                <\/div>\n                <h2>TEJIDOS NATURALES<\/h2>\n                <p><\/p>\n                <a href='#'><button>SABER M\u00c1S<\/button><\/a>\n            <\/div>\n        <\/div>\n        <div class=\"card-box\">\n            <div class=\"content\">\n                <div class=\"icon\">\n                   \n                <\/div>\n                <h2>ACCESORIOS<\/h2>\n                <p><\/p>\n                <a href='https:\/\/texin.com.br\/es\/loja-virtual\/?jsf=jet-woo-products-grid&tax=product_cat:acessorios'><button>SABER M\u00c1S<\/button><\/a>\n            <\/div>\n        <\/div>\n    <\/div>\n    <script>\n        window.addEventListener('scroll', () => {\n            const rowBox = document.querySelector('.row-box');\n            const rowBoxRect = rowBox.getBoundingClientRect();\n            \n            if (rowBoxRect.top < window.innerHeight && rowBoxRect.bottom >= 0) {\n                rowBox.style.opacity = 1;\n                const cards = document.querySelectorAll('.card-box');\n                \n                cards.forEach((card, index) => {\n                    setTimeout(() => {\n                        card.style.opacity = 1;\n                        card.style.transform = 'translateY(0)';\n                        card.style.transition = 'opacity 0.5s ease, transform 0.5s ease';\n                        card.style.animation = 'fadeInUp 0.5s forwards';\n                    }, index * 100);\n                });\n            }\n        });\n    <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>\u00a1DESCUBRE NUESTRO PORTAFOLIO PARA MANUALIDADES Y DECORACI\u00d3N! \u00a1AQU\u00cd ENCONTRAR\u00c1S LOS MEJORES HILOS Y MATERIALES PARA TUS TRABAJOS! PUNTO Y GANCHILLO M\u00c1S INFORMACI\u00d3N TAPICER\u00cdA Y MANUALIDADES M\u00c1S INFORMACI\u00d3N TEJIDOS NATURALES M\u00c1S INFORMACI\u00d3N ACCESORIOS M\u00c1S INFORMACI\u00d3N<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1290","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/pages\/1290","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/comments?post=1290"}],"version-history":[{"count":3,"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/pages\/1290\/revisions"}],"predecessor-version":[{"id":3710,"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/pages\/1290\/revisions\/3710"}],"wp:attachment":[{"href":"https:\/\/texin.com.br\/es\/wp-json\/wp\/v2\/media?parent=1290"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}