{"id":453,"date":"2026-10-02T11:18:19","date_gmt":"2026-10-02T16:18:19","guid":{"rendered":"https:\/\/deymibellas.online\/?page_id=453"},"modified":"2026-10-03T16:34:22","modified_gmt":"2026-10-03T21:34:22","slug":"galeria-borrador","status":"publish","type":"page","link":"https:\/\/deymibellas.online\/index.php\/galeria-borrador\/","title":{"rendered":"Galeria borrador"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"453\" class=\"elementor elementor-453\">\n\t\t\t\t<div class=\"elementor-element elementor-element-67fad13 e-flex e-con-boxed e-con e-parent\" data-id=\"67fad13\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-50a7b4f elementor-widget elementor-widget-text-editor\" data-id=\"50a7b4f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<!-- ============================================\n     SECCI\u00d3N \"GALER\u00cdA\" \u2014 Deymi_bellas (versi\u00f3n bold)\n     Fondo oscuro, grid tipo bento (tarjetas de distinto\n     tama\u00f1o), overlay que revela la descripci\u00f3n al hover con\n     efecto de inclinaci\u00f3n 3D (tilt) siguiendo el cursor, y\n     filtros con indicador deslizante.\n     DEMO: cada tarjeta usa un degradado como placeholder de\n     foto \u2014 busca \"REEMPLAZAR FOTO\" en el CSS (.db-g1, .db-g2...)\n     y cambia el degradado por: background: url('foto.jpg') center\/cover;\n     Pega este bloque en un widget de HTML personalizado.\n     ============================================ -->\n<p><style>\n  \/* evita que aparezca una barra de scroll horizontal al romper\n     el ancho del contenedor *\/\n  html, body { overflow-x: hidden; }\n\n  #db-gal2 {\n    \/* Rompe el ancho del contenedor de Elementor\/tema para que\n       la secci\u00f3n (y la cinta rosa) lleguen de borde a borde de\n       la pantalla, sin el espacio en blanco a los costados. *\/\n    width: 100vw;\n    position: relative;\n    left: 50%;\n    right: 50%;\n    margin-left: -50vw;\n    margin-right: -50vw;\n\n    --brown: #2a1a16;\n    --brown-2: #1f1310;\n    --pink: #e0466f;\n    --blue: #4a90d9;\n    --clay: #c9814f;\n    --ink-soft: #cbb8ad;\n    font-family: 'JetBrains Mono', monospace;\n    color: #fff;\n    background: var(--brown);\n    position: relative;\n    overflow: hidden;\n    padding: 0 0 100px;\n    box-sizing: border-box;\n  }\n  #db-gal2 *, #db-gal2 *::before, #db-gal2 *::after { box-sizing: border-box; }\n\n  \/* fondo animado *\/\n  #db-gal2 .db-bg {\n    position: absolute;\n    inset: 0;\n    background:\n      radial-gradient(640px 440px at 88% 10%, rgba(224,70,111,0.3), transparent 60%),\n      radial-gradient(520px 420px at 6% 90%, rgba(74,144,217,0.18), transparent 60%),\n      radial-gradient(420px 360px at 50% 50%, rgba(201,129,79,0.12), transparent 65%);\n    background-size: 180% 180%, 180% 180%, 160% 160%;\n    animation: db-bg-drift 18s ease-in-out infinite alternate;\n    pointer-events: none;\n  }\n  @keyframes db-bg-drift {\n    0%   { background-position: 0% 0%, 100% 100%, 50% 50%; }\n    100% { background-position: 25% 15%, 75% 85%, 40% 60%; }\n  }\n  #db-gal2 .db-particle {\n    position: absolute;\n    border-radius: 50%;\n    pointer-events: none;\n    opacity: 0.5;\n  }\n  #db-gal2 .db-p1 { width: 7px; height: 7px; background: var(--pink); top: 14%; left: 10%; animation: db-float 7s ease-in-out infinite; }\n  #db-gal2 .db-p2 { width: 5px; height: 5px; background: var(--blue); top: 70%; left: 88%; animation: db-float 9s ease-in-out infinite 1s; }\n  #db-gal2 .db-p3 { width: 6px; height: 6px; background: var(--clay); top: 40%; left: 92%; animation: db-float 8s ease-in-out infinite 0.4s; }\n  #db-gal2 .db-p4 { width: 5px; height: 5px; background: var(--pink); top: 85%; left: 15%; animation: db-float 10s ease-in-out infinite 2s; }\n  @keyframes db-float {\n    0%, 100% { transform: translateY(0) translateX(0); }\n    50% { transform: translateY(-26px) translateX(10px); }\n  }\n\n  \/* marquee *\/\n  #db-gal2 .db-marquee {\n    position: relative;\n    background: var(--pink);\n    overflow: hidden;\n    white-space: nowrap;\n    padding: 9px 0;\n    margin-bottom: 64px;\n  }\n  #db-gal2 .db-marquee-track { display: inline-flex; width: max-content; animation: db-scroll 20s linear infinite; }\n  #db-gal2 .db-marquee-track span {\n    font-family: 'Poppins', sans-serif;\n    font-weight: 700;\n    font-size: 12.5px;\n    letter-spacing: 0.06em;\n    text-transform: uppercase;\n    padding: 0 20px;\n    display: inline-flex;\n    align-items: center;\n    gap: 20px;\n    flex: none;\n  }\n  #db-gal2 .db-marquee-track span::after { content: \"\u2726\"; font-size: 10px; opacity: 0.8; }\n  @keyframes db-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }\n\n  #db-gal2 .db-head {\n    position: relative;\n    max-width: 640px;\n    margin: 0 auto 40px;\n    text-align: center;\n    padding: 0 24px;\n  }\n  #db-gal2 .db-eyebrow { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--pink); margin: 0 0 16px; }\n  #db-gal2 .db-head h2 {\n    font-family: 'Poppins', sans-serif;\n    font-weight: 900;\n    font-size: clamp(32px, 4.6vw, 50px);\n    line-height: 1.05;\n    margin: 0 0 16px;\n    text-transform: uppercase;\n  }\n  #db-gal2 .db-head h2 em { font-style: normal; color: var(--pink); }\n  #db-gal2 .db-head p { font-size: 13px; color: var(--ink-soft); line-height: 1.7; margin: 0; }\n\n  \/* filtros con indicador deslizante *\/\n  #db-gal2 .db-filters {\n    position: relative;\n    display: inline-flex;\n    gap: 4px;\n    background: rgba(255,255,255,0.06);\n    border: 1px solid rgba(255,255,255,0.14);\n    border-radius: 100px;\n    padding: 5px;\n    margin: 0 auto 50px;\n  }\n  #db-gal2 .db-filters-wrap { display: flex; justify-content: center; padding: 0 24px; }\n  #db-gal2 .db-filter-indicator {\n    position: absolute;\n    top: 5px; bottom: 5px; left: 5px;\n    width: 80px;\n    background: var(--pink);\n    border-radius: 100px;\n    transition: transform 0.35s cubic-bezier(.4,0,.2,1), width 0.35s cubic-bezier(.4,0,.2,1);\n    z-index: 0;\n  }\n  #db-gal2 .db-filter-btn {\n    position: relative;\n    z-index: 1;\n    font-family: 'Poppins', sans-serif;\n    font-weight: 600;\n    font-size: 12.5px;\n    color: var(--ink-soft);\n    background: none;\n    border: none;\n    border-radius: 100px;\n    padding: 9px 20px;\n    cursor: pointer;\n    transition: color 0.25s ease;\n  }\n  #db-gal2 .db-filter-btn.db-active { color: #fff; }\n\n  \/* grid bento *\/\n  #db-gal2 .db-grid {\n    position: relative;\n    max-width: 1160px;\n    margin: 0 auto;\n    padding: 0 24px;\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    grid-auto-rows: 160px;\n    gap: 18px;\n  }\n  #db-gal2 .db-card {\n    grid-column: span 2;\n    grid-row: span 2;\n    position: relative;\n    border-radius: 16px;\n    overflow: hidden;\n    opacity: 0;\n    transform: scale(0.88) rotateX(8deg);\n    transition: opacity 0.7s ease, transform 0.7s cubic-bezier(.2,.8,.2,1);\n    transform-style: preserve-3d;\n    perspective: 800px;\n    cursor: pointer;\n  }\n  #db-gal2 .db-card.db-in { opacity: 1; transform: scale(1) rotateX(0deg); }\n  #db-gal2 .db-card.db-hidden { display: none; }\n  #db-gal2 .db-card.db-wide { grid-column: span 2; grid-row: span 1; }\n  #db-gal2 .db-card.db-tall { grid-column: span 2; grid-row: span 3; }\n\n  #db-gal2 .db-card-bg {\n    position: absolute;\n    inset: 0;\n    transition: transform 0.5s ease;\n    transform: translate(var(--tx, 0), var(--ty, 0)) scale(1.04);\n  }\n  #db-gal2 .db-card:hover .db-card-bg { transform: translate(var(--tx, 0), var(--ty, 0)) scale(1.14); }\n\n  #db-gal2 .db-card-tag {\n    position: absolute;\n    top: 14px; left: 14px;\n    z-index: 3;\n    font-family: 'Poppins', sans-serif;\n    font-weight: 700;\n    font-size: 10px;\n    letter-spacing: 0.05em;\n    text-transform: uppercase;\n    color: #fff;\n    background: rgba(0,0,0,0.4);\n    backdrop-filter: blur(3px);\n    padding: 5px 10px;\n    border-radius: 100px;\n  }\n  #db-gal2 .db-card-tag.db-tag-pedicure { background: var(--blue); }\n  #db-gal2 .db-card-tag.db-tag-manicure { background: var(--pink); }\n\n  #db-gal2 .db-card-overlay {\n    position: absolute;\n    inset: 0;\n    z-index: 2;\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    padding: 18px;\n    background: linear-gradient(0deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.25) 55%, transparent 100%);\n  }\n  #db-gal2 .db-card-overlay h3 {\n    font-family: 'Poppins', sans-serif;\n    font-weight: 700;\n    font-size: 15px;\n    margin: 0 0 6px;\n    color: #fff;\n  }\n  #db-gal2 .db-card-overlay p {\n    font-size: 11.5px;\n    line-height: 1.55;\n    color: #e6d9d1;\n    margin: 0;\n    max-height: 0;\n    opacity: 0;\n    overflow: hidden;\n    transition: max-height 0.4s ease, opacity 0.3s ease;\n  }\n  #db-gal2 .db-card:hover .db-card-overlay p { max-height: 120px; opacity: 1; }\n  #db-gal2 .db-card-overlay h3 {\n    transform: translateY(14px);\n    transition: transform 0.4s ease;\n  }\n  #db-gal2 .db-card:hover .db-card-overlay h3 { transform: translateY(0); }\n\n  #db-gal2 .db-g1 { background: url('https:\/\/deymibellas.online\/wp-content\/uploads\/2026\/09\/01d885fb9f4084ee088652bd10e4f9a2-1.jpg') center\/cover; }\n  #db-gal2 .db-g2 { background: url('https:\/\/deymibellas.online\/wp-content\/uploads\/2026\/09\/9f82afb66df644e1f9062cfa6fb55764.jpg') center\/cover; }\n  #db-gal2 .db-g3 { background: url('https:\/\/deymibellas.online\/wp-content\/uploads\/2026\/09\/pedicure.jpg') center\/cover; }\n  #db-gal2 .db-g4 { background: url('https:\/\/deymibellas.online\/wp-content\/uploads\/2026\/09\/pedicure2.jpg') center\/cover; }\n  #db-gal2 .db-g5 { background: url('https:\/\/deymibellas.online\/wp-content\/uploads\/2026\/09\/natural-1.jpg') center\/cover; }\n\n  @media (max-width: 860px) {\n    #db-gal2 .db-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 180px; }\n    #db-gal2 .db-card { grid-column: span 2 !important; grid-row: span 2 !important; }\n  }\n  @media (prefers-reduced-motion: reduce) {\n    #db-gal2 .db-card, #db-gal2 .db-bg, #db-gal2 .db-particle, #db-gal2 .db-marquee-track {\n      animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important;\n    }\n  }\n<\/style><\/p>\n<section id=\"db-gal2\">\n<div class=\"db-bg\"><\/div>\n<span class=\"db-particle db-p1\"><\/span> <span class=\"db-particle db-p2\"><\/span> <span class=\"db-particle db-p3\"><\/span> <span class=\"db-particle db-p4\"><\/span>\n<div class=\"db-marquee\">\n<div class=\"db-marquee-track\"><span>Galer\u00eda de dise\u00f1os<\/span><span>Manicure<\/span><span>Pedicure<\/span><span>Hecho a mano<\/span> <span>Galer\u00eda de dise\u00f1os<\/span><span>Manicure<\/span><span>Pedicure<\/span><span>Hecho a mano<\/span><\/div>\n<\/div>\n<div class=\"db-head\">\n<p class=\"db-eyebrow\">Deymi_bellas \u00b7 Galer\u00eda<\/p>\n<h2>Dise\u00f1os que <em>enamoran<\/em><\/h2>\n<p>Lo \u00faltimo en tendencia para el cuidado de tus manos y pies.<\/p>\n<\/div>\n<div class=\"db-filters-wrap\">\n<div class=\"db-filters\"><span class=\"db-filter-indicator\"><\/span> <button class=\"db-filter-btn db-active\" data-filter=\"todos\">Todos<\/button> <button class=\"db-filter-btn\" data-filter=\"manicure\">Manicure<\/button> <button class=\"db-filter-btn\" data-filter=\"pedicure\">Pedicure<\/button><\/div>\n<\/div>\n<div class=\"db-grid\">\n<div class=\"db-card db-tall\" data-category=\"manicure\">\n<div class=\"db-card-bg db-g1\"><\/div>\n<span class=\"db-card-tag db-tag-manicure\">Manicure<\/span>\n<div class=\"db-card-overlay\">\n<h3>Almendradas<\/h3>\n<p>Dise\u00f1o sofisticado que alarga tus manos de forma natural. Acabado pulido, delicado y duradero.<\/p>\n<\/div>\n<\/div>\n<div class=\"db-card\" data-category=\"manicure\">\n<div class=\"db-card-bg db-g2\"><\/div>\n<span class=\"db-card-tag db-tag-manicure\">Manicure<\/span>\n<div class=\"db-card-overlay\">\n<h3>Acr\u00edlico<\/h3>\n<p>Consigue el largo y la forma que siempre so\u00f1aste, con m\u00e1xima durabilidad.<\/p>\n<\/div>\n<\/div>\n<div class=\"db-card db-wide\" data-category=\"pedicure\">\n<div class=\"db-card-bg db-g3\"><\/div>\n<span class=\"db-card-tag db-tag-pedicure\">Pedicure<\/span>\n<div class=\"db-card-overlay\">\n<h3>Pedicure Francesa Moderna en Tono Tinto<\/h3>\n<p>Base profunda en tono tinto con la delicada l\u00ednea francesa en contraste.<\/p>\n<\/div>\n<\/div>\n<div class=\"db-card\" data-category=\"manicure\">\n<div class=\"db-card-bg db-g5\"><\/div>\n<span class=\"db-card-tag db-tag-manicure\">Manicure<\/span>\n<div class=\"db-card-overlay\">\n<h3>Esmalte natural<\/h3>\n<p>R\u00e1pido, limpio y respetuoso con tus u\u00f1as. F\u00e1cil de retirar, sin l\u00e1mpara.<\/p>\n<\/div>\n<\/div>\n<div class=\"db-card db-wide\" data-category=\"pedicure\">\n<div class=\"db-card-bg db-g4\"><\/div>\n<span class=\"db-card-tag db-tag-pedicure\">Pedicure<\/span>\n<div class=\"db-card-overlay\">\n<h3>Pedicure Floral Elegante con Cristales<\/h3>\n<p>Flor blanca hecha a mano alzada sobre base nude, con pedrer\u00eda fina.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<p><script>\n  (function () {\n    var root = document.getElementById('db-gal2');\n    var cards = root.querySelectorAll('.db-card');\n\n    \/\/ entrada escalonada al hacer scroll\n    if ('IntersectionObserver' in window) {\n      var io = new IntersectionObserver(function (entries) {\n        entries.forEach(function (entry) {\n          if (entry.isIntersecting) {\n            var el = entry.target;\n            var delay = Array.prototype.indexOf.call(cards, el) % 5 * 90;\n            setTimeout(function () { el.classList.add('db-in'); }, delay);\n            io.unobserve(el);\n          }\n        });\n      }, { threshold: 0.15 });\n      cards.forEach(function (el) { io.observe(el); });\n    } else {\n      cards.forEach(function (el) { el.classList.add('db-in'); });\n    }\n\n    \/\/ tilt 3D siguiendo el cursor\n    cards.forEach(function (card) {\n      card.addEventListener('mousemove', function (e) {\n        var rect = card.getBoundingClientRect();\n        var x = (e.clientX - rect.left) \/ rect.width - 0.5;\n        var y = (e.clientY - rect.top) \/ rect.height - 0.5;\n        card.style.transform = 'scale(1.02) rotateX(' + (y * -6) + 'deg) rotateY(' + (x * 6) + 'deg)';\n        var bg = card.querySelector('.db-card-bg');\n        if (bg) { bg.style.setProperty('--tx', (x * -8) + 'px'); bg.style.setProperty('--ty', (y * -8) + 'px'); }\n      });\n      card.addEventListener('mouseleave', function () {\n        card.style.transform = '';\n        var bg = card.querySelector('.db-card-bg');\n        if (bg) { bg.style.setProperty('--tx', '0px'); bg.style.setProperty('--ty', '0px'); }\n      });\n    });\n\n    \/\/ filtros con indicador deslizante\n    var buttons = root.querySelectorAll('.db-filter-btn');\n    var indicator = root.querySelector('.db-filter-indicator');\n\n    function moveIndicator(btn) {\n      indicator.style.width = btn.offsetWidth + 'px';\n      indicator.style.transform = 'translateX(' + btn.offsetLeft + 'px)';\n    }\n    moveIndicator(buttons[0]);\n\n    buttons.forEach(function (btn) {\n      btn.addEventListener('click', function () {\n        buttons.forEach(function (b) { b.classList.remove('db-active'); });\n        btn.classList.add('db-active');\n        moveIndicator(btn);\n        var filter = btn.getAttribute('data-filter');\n        cards.forEach(function (card) {\n          var match = filter === 'todos' || card.getAttribute('data-category') === filter;\n          card.classList.toggle('db-hidden', !match);\n        });\n      });\n    });\n    window.addEventListener('resize', function () {\n      var active = root.querySelector('.db-filter-btn.db-active');\n      if (active) moveIndicator(active);\n    });\n  })();\n<\/script><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Galer\u00eda de dise\u00f1osManicurePedicureHecho a mano Galer\u00eda de dise\u00f1osManicurePedicureHecho a mano Deymi_bellas \u00b7 Galer\u00eda Dise\u00f1os que enamoran Lo \u00faltimo en tendencia para el cuidado de tus manos y pies. Todos Manicure Pedicure Manicure Almendradas Dise\u00f1o sofisticado que alarga tus manos de forma natural. Acabado pulido, delicado y duradero. Manicure Acr\u00edlico Consigue [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/template-pagebuilder-full-width.php","meta":{"footnotes":""},"class_list":["post-453","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/pages\/453","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/comments?post=453"}],"version-history":[{"count":14,"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/pages\/453\/revisions"}],"predecessor-version":[{"id":469,"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/pages\/453\/revisions\/469"}],"wp:attachment":[{"href":"https:\/\/deymibellas.online\/index.php\/wp-json\/wp\/v2\/media?parent=453"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}