{"id":40,"date":"2026-05-16T13:02:33","date_gmt":"2026-05-16T11:02:33","guid":{"rendered":"https:\/\/reloop.cat\/?page_id=40"},"modified":"2026-09-02T09:31:09","modified_gmt":"2026-09-02T07:31:09","slug":"inici","status":"publish","type":"page","link":"https:\/\/reloop.cat\/esp\/","title":{"rendered":"Inici"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"40\" class=\"elementor elementor-40\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a74c8e7 e-con-full e-flex e-con e-parent\" data-id=\"a74c8e7\" data-element_type=\"container\" data-e-type=\"container\" id=\"capcalera-gratis\">\n\t\t\t\t\t<a href=\"https:\/\/reloop.cat\" target=\"_self\" class=\"e-image-link-base e-default-a\" data-interaction-id=\"25680a3\"\n\t><img decoding=\"async\" class=\"e-image-base e-default-img e-25680a3-a9d8a67\" id=\"654\" src=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/06\/logooooooo.png?fit=225%2C150&amp;#038;ssl=1\" width=\"225\" height=\"150\" srcset=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/06\/logooooooo.png?w=225&amp;ssl=1 225w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/06\/logooooooo.png?resize=18%2C12&amp;ssl=1 18w\" alt=\"\"\/>\t<\/a>\t\t\t\t<div class=\"elementor-element elementor-element-8b07c86 elementor-hidden-desktop elementor-hidden-tablet elementor-widget elementor-widget-html\" data-id=\"8b07c86\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ===================================================\n     BOT\u00d3 DEL MEN\u00da M\u00d2BIL (SENSE SOMBRES - NET I MINIMAL)\n     =================================================== -->\n<div class=\"reloop-trigger-wrapper\">\n  <button type=\"button\" onclick=\"window.reloopToggleMenu(true)\" class=\"reloop-btn-trigger\">\n    [ men\u00fa ]\n  <\/button>\n<\/div>\n\n<!-- ===================================================\n     DESPLEGABLE \/ OVERLAY A PANTALLA COMPLETA\n     =================================================== -->\n<div id=\"reloop-mobile-overlay\" class=\"reloop-mobile-overlay\">\n  <div class=\"reloop-mobile-container\">\n    \n    <!-- Cap\u00e7alera del Men\u00fa -->\n    <div class=\"reloop-mobile-header\">\n      <span class=\"reloop-mobile-logo\">reloop_<\/span>\n      <button type=\"button\" class=\"reloop-btn-close\" onclick=\"window.reloopToggleMenu(false)\" aria-label=\"Tancar men\u00fa\">\n        \u2715\n      <\/button>\n    <\/div>\n\n    <!-- Navegaci\u00f3 amb enlla\u00e7os als teus serveis i contacte -->\n    <nav class=\"reloop-mobile-nav\">\n      <a href=\"https:\/\/reloop.cat\/\" class=\"reloop-mobile-link\" onclick=\"window.reloopToggleMenu(false)\">\n        <span class=\"reloop-link-num\">01.<\/span>\n        <span class=\"reloop-link-txt\">inici<\/span>\n      <\/a>\n      <a href=\"https:\/\/reloop.cat\/?page_id=57\" class=\"reloop-mobile-link\" onclick=\"window.reloopToggleMenu(false)\">\n        <span class=\"reloop-link-num\">02.<\/span>\n        <span class=\"reloop-link-txt\">nosaltres<\/span>\n      <\/a>\n      <a href=\"https:\/\/reloop.cat\/elementor-1468\/\" class=\"reloop-mobile-link\" onclick=\"window.reloopToggleMenu(false)\">\n        <span class=\"reloop-link-num\">03.<\/span>\n        <span class=\"reloop-link-txt\">serveis<\/span>\n      <\/a>\n      <a href=\"https:\/\/reloop.cat\/?page_id=162\" class=\"reloop-mobile-link\" onclick=\"window.reloopToggleMenu(false)\">\n        <span class=\"reloop-link-num\">04.<\/span>\n        <span class=\"reloop-link-txt\">portfoli<\/span>\n      <\/a>\n      <a href=\"https:\/\/reloop.cat\/contacte\/\" class=\"reloop-mobile-link\" onclick=\"window.reloopToggleMenu(false)\">\n        <span class=\"reloop-link-num\">05.<\/span>\n        <span class=\"reloop-link-txt\">contacte<\/span>\n      <\/a>\n    <\/nav>\n\n  <\/div>\n<\/div>\n\n<!-- ===================================================\n     ESTILS CSS NETS (SENSE SOMBRES - TONALITATS GRISES)\n     =================================================== -->\n<style>\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=Questrial&display=swap');\n\n  \/* Bot\u00f3 visible a la cap\u00e7alera *\/\n  .reloop-trigger-wrapper {\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    width: 100%;\n  }\n\n  .reloop-btn-trigger {\n    background: transparent !important;\n    border: none !important;\n    box-shadow: none !important;\n    outline: none !important;\n    color: #333333 !important; \/* Gris fosc discret *\/\n    font-family: 'Questrial', sans-serif !important;\n    font-size: 16px !important;\n    letter-spacing: -0.5px;\n    cursor: pointer;\n    padding: 8px 12px;\n    transition: color 0.2s ease;\n  }\n\n  .reloop-btn-trigger:hover,\n  .reloop-btn-trigger:active {\n    color: #7e150b !important; \/* Granat corporatiu al clicar *\/\n  }\n\n  \/* Overlay pantalla sencera *\/\n  .reloop-mobile-overlay {\n    position: fixed !important;\n    top: 0 !important;\n    left: 0 !important;\n    width: 100vw !important;\n    height: 100vh !important;\n    background-color: #fafafa !important; \/* Fons clar corporatiu *\/\n    z-index: 9999999 !important; \/* Surt per sobre de tot *\/\n    display: flex !important;\n    flex-direction: column !important;\n    opacity: 0;\n    visibility: hidden;\n    transition: opacity 0.3s ease, visibility 0.3s ease;\n  }\n\n  \/* Estat obert *\/\n  .reloop-mobile-overlay.is-active {\n    opacity: 1 !important;\n    visibility: visible !important;\n  }\n\n  .reloop-mobile-container {\n    width: 100%;\n    height: 100%;\n    max-width: 600px;\n    margin: 0 auto;\n    padding: 24px;\n    display: flex;\n    flex-direction: column;\n    box-sizing: border-box;\n  }\n\n  .reloop-mobile-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding-bottom: 20px;\n    border-bottom: 1px solid rgba(26, 26, 26, 0.15);\n  }\n\n  .reloop-mobile-logo {\n    font-family: 'Questrial', sans-serif;\n    font-size: 20px;\n    color: #1a1a1a;\n  }\n\n  .reloop-btn-close {\n    background: transparent !important;\n    border: none !important;\n    box-shadow: none !important;\n    font-size: 24px !important;\n    color: #333333 !important;\n    cursor: pointer;\n    padding: 5px 10px;\n  }\n\n  .reloop-mobile-nav {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    gap: 28px;\n  }\n\n  .reloop-mobile-link {\n    text-decoration: none !important;\n    display: flex;\n    align-items: baseline;\n    font-family: 'Questrial', sans-serif !important;\n    color: #333333 !important;\n    transition: transform 0.2s ease, color 0.2s ease;\n  }\n\n  .reloop-mobile-link:hover,\n  .reloop-mobile-link:active {\n    color: #7e150b !important;\n    transform: translateX(6px);\n  }\n\n  .reloop-link-num {\n    font-size: 13px;\n    color: #7e150b;\n    margin-right: 14px;\n    font-weight: bold;\n  }\n\n  .reloop-link-txt {\n    font-size: 32px;\n    letter-spacing: -1px;\n  }\n<\/style>\n\n<!-- ===================================================\n     SCRIPT INFAL\u00b7LIBLE PER OBRIR I TANCAR EL MEN\u00da\n     =================================================== -->\n<script>\n  (function() {\n    \/\/ Funci\u00f3 global d'obertura\/tancament\n    window.reloopToggleMenu = function(show) {\n      var overlay = document.getElementById('reloop-mobile-overlay');\n      if (!overlay) return;\n\n      if (show) {\n        overlay.classList.add('is-active');\n        document.body.style.overflow = 'hidden'; \/\/ Evita scroll de fons\n      } else {\n        overlay.classList.remove('is-active');\n        document.body.style.overflow = ''; \/\/ Restableix scroll\n      }\n    };\n\n    \/\/ Mou l'overlay al <body> autom\u00e0ticament per evitar que el contenidor d'Elementor el talli\n    function initReloopMenu() {\n      var overlay = document.getElementById('reloop-mobile-overlay');\n      if (overlay && overlay.parentNode !== document.body) {\n        document.body.appendChild(overlay);\n      }\n    }\n\n    if (document.readyState === 'loading') {\n      document.addEventListener('DOMContentLoaded', initReloopMenu);\n    } else {\n      initReloopMenu();\n    }\n  })();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7241133 elementor-icon-list--layout-inline elementor-hidden-tablet elementor-hidden-mobile elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"7241133\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items elementor-inline-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/reloop.cat\/elementor-1468\/\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Serveis<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/reloop.cat\/?page_id=162\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Portfoli<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/reloop.cat\/?page_id=57\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Nosaltres<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item elementor-inline-item\">\n\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/reloop.cat\/?page_id=59\">\n\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">Contacte<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cf38ff6 e-flex e-con-boxed e-con e-parent\" data-id=\"cf38ff6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cb3cc46 e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"cb3cc46\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"cb3cc46\" id=\"pantalla-text\">\n    \t\t\t<img fetchpriority=\"high\" decoding=\"async\" class=\"e-image-base e-default-img \" data-interaction-id=\"e1f0906\" id=\"text-animat\" id=\"77\" src=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?fit=1920%2C1080&amp;#038;ssl=1\" width=\"1920\" height=\"1080\" srcset=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?w=1920&amp;ssl=1 1920w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?resize=300%2C169&amp;ssl=1 300w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?resize=1024%2C576&amp;ssl=1 1024w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?resize=768%2C432&amp;ssl=1 768w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?resize=1536%2C864&amp;ssl=1 1536w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/lletres.png?w=1600&amp;ssl=1 1600w\" alt=\"\"\/>\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-b3b90b2 e-con e-atomic-element e-flexbox-base e-default-div e-b3b90b2-e9070b9 \" data-id=\"b3b90b2\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"b3b90b2\" id=\"pantalla-espiral\">\n    \t\t\t<img decoding=\"async\" class=\"e-image-base e-default-img \" data-interaction-id=\"d914f63\" id=\"imatge-espiral\" id=\"167\" src=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?fit=1920%2C1080&amp;#038;ssl=1\" width=\"1920\" height=\"1080\" srcset=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?w=1920&amp;ssl=1 1920w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?resize=300%2C169&amp;ssl=1 300w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?resize=1024%2C576&amp;ssl=1 1024w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?resize=768%2C432&amp;ssl=1 768w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?resize=1536%2C864&amp;ssl=1 1536w, https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/05\/espiralblanca.png?w=1600&amp;ssl=1 1600w\" alt=\"\"\/>\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-becc808 e-flex e-con-boxed e-con e-parent\" data-id=\"becc808\" 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-714b93f elementor-widget elementor-widget-html\" data-id=\"714b93f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n    let lastScrollTop = 0;\n    let introAcabada = false;\n\n    \/\/ 1. Bloquem l'scroll al principi\n    document.body.classList.add('bloquejar-scroll');\n\n    \/\/ 2. TIMING A ELS 3.5 SEGONS: El tel\u00f3 puja\n    setTimeout(function () {\n        const introSection = document.querySelector(\"#pantalla-espiral\");\n        if (introSection) introSection.classList.add('marxar');\n\n        const textAnimat = document.querySelector(\"#text-animat\");\n        if (textAnimat) textAnimat.classList.add('visible');\n    }, 3500); \n\n    \/\/ 3. TIMING A ELS 4.5 SEGONS: Intro eliminada i apareix el men\u00fa\n    setTimeout(function () {\n        const introSection = document.querySelector(\"#pantalla-espiral\");\n        if (introSection) introSection.style.display = \"none\"; \n        \n        \/\/ \ud83d\ude80 ENSENYEM LA CAP\u00c7ALERA AL MATEIX TEMPS QUE EL TEXT\n        const capcalera = document.querySelector(\"#capcalera-gratis\");\n        if (capcalera) {\n            capcalera.classList.add('visible');\n        }\n\n        document.body.classList.remove('bloquejar-scroll');\n        \n        \/\/ Activem el sistema d'scroll intel\u00b7ligent per a m\u00e9s tard\n        introAcabada = true;\n    }, 4500);\n\n    \/\/ 4. DETECTOR D'SCROLL UP \/ SCROLL DOWN\n    window.addEventListener(\"scroll\", function() {\n        if (!introAcabada) return; \n\n        let st = window.pageYOffset || document.documentElement.scrollTop;\n        const capcalera = document.querySelector(\"#capcalera-gratis\");\n        \n        if (!capcalera) return;\n\n        \/\/ Toler\u00e0ncia per evitar petits parpalleigs\n        if (Math.abs(lastScrollTop - st) <= 5) return;\n\n        if (st > lastScrollTop) {\n            \/\/ SCROLL DOWN: L'usuari baixa -> Amaguem la cap\u00e7alera\n            capcalera.classList.remove('visible');\n        } else {\n            \/\/ SCROLL UP: L'usuari puja -> Tornem a ensenyar la cap\u00e7alera\n            capcalera.classList.add('visible');\n        }\n        \n        lastScrollTop = st <= 0 ? 0 : st;\n    }, { passive: true });\n\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c3ffcf6 e-con-full e-flex e-con e-parent\" data-id=\"c3ffcf6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-44b5b99 elementor-widget elementor-widget-html\" data-id=\"44b5b99\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \ud83d\udda4 L\u00cdNIA SEPARADORA MINIMALISTA COHESIVA SENSE MARCS -->\n<div class=\"espaiador-separador\">\n  <hr class=\"linia-negra-agencia\">\n<\/div>\n\n<style>\n.espaiador-separador {\n  width: 100% !important;\n  display: flex !important;\n  justify-content: center !important;\n  \n  \/* \ud83c\udf1f CANVI CLAU: Eliminem el blanc i el fem transparent. \n     Ara l'ombra del v\u00eddeo respira i es dissoldr\u00e0 de forma fluida sense talls *\/\n  background-color: transparent !important; \n  \n  padding-top: 90px !important;    \n  padding-bottom: 0px !important; \n  box-sizing: border-box !important;\n}\n\n.linia-negra-agencia {\n  width: 97% !important;           \n  max-width: 100% !important;       \n  border: none !important;\n  \n  \/* \ud83c\udf1f CANVI CLAU: En lloc de #000000 pur, fem servir un negre al 15% d'opacitat (rgba).\n     Aix\u00f2 fa que la l\u00ednia adopti el mateix to elegant i suau que la ombra del v\u00eddeo *\/\n  border-top: 1px solid rgba(0, 0, 0, 0.8) !important; \n  margin: 0 !important;\n  opacity: 1 !important;\n}\n\n\/* M\u00f2bils *\/\n@media (max-width: 767px) {\n  .espaiador-separador {\n    padding-top: 70px !important;\n    padding-bottom: 50px !important;\n  }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3e12481 e-con-full e-flex e-con e-parent\" data-id=\"3e12481\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<h2 data-interaction-id=\"c53ff02\" class=\"e-c53ff02-9c8160a e-heading-base e-default-h2\">SERVEIS<\/h2>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fd07b35 e-con-full e-flex e-con e-parent\" data-id=\"fd07b35\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<h2 data-interaction-id=\"cd0bb50\" class=\"e-cd0bb50-c88275a e-heading-base e-default-h2\"><strong>Donem la volta a all\u00f2 de sempre. <\/strong>Som l'ag\u00e8ncia creativa que necessites. Transformem idees atrevides en estrat\u00e8gies reals.<\/h2>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-66282f5 e-con-full e-flex e-con e-parent\" data-id=\"66282f5\" data-element_type=\"container\" data-e-type=\"container\" id=\"serveis\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dfa247f elementor-widget elementor-widget-html\" data-id=\"dfa247f\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"els-serveis\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \ud83d\udce6 MOTOR DEL CARRUSEL (Swiper 11) -->\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.css\" \/>\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.js\"><\/script>\n\n<!-- \ud83c\udfdb\ufe0f ESTRUCTURA AMB GRADIENTS DE COLORS PERSONALITZATS -->\n<div class=\"swiper carrusel-infinit\">\n  <div class=\"swiper-wrapper\">\n    \n    <!-- Targeta 1 - \ud83d\udd35 BLAU MAR\u00cd ELEGANT -->\n    <a href=\"https:\/\/reloop.cat\/?page_id=226\" class=\"swiper-slide targeta-premium\" style=\"background-image: linear-gradient(to top, rgba(128, 4, 18, 0.85) 0%, rgba(128, 4, 18, 0.3) 100%), url('URL_DE_LA_IMATGE_1');\">\n      <span class=\"num-servei\">01<\/span>\n      <h3>Gesti\u00f3 XXSS<\/h3>\n    <\/a>\n\n    <!-- Targeta 2 - \ud83d\udc9c VIOLETA \/ PURPURA DE MARCA -->\n    <a href=\"https:\/\/reloop.cat\/?page_id=225\" class=\"swiper-slide targeta-premium\" style=\"background-image: linear-gradient(to top, rgba(128, 4, 18, 0.85) 0%, rgba(128, 4, 18, 0.3) 100%), url('URL_DE_LA_IMATGE_2');\">\n      <span class=\"num-servei\">02<\/span>\n      <h3>Creaci\u00f3 de contingut<\/h3>\n    <\/a>\n\n    <!-- Targeta 3 - \ud83d\udfe2 VERD MARAGDA OBSCUR -->\n    <a href=\"https:\/\/reloop.cat\/?page_id=232\" class=\"swiper-slide targeta-premium\" style=\"background-image: linear-gradient(to top, rgba(128, 4, 18, 0.85) 0%, rgba(128, 4, 18, 0.3) 100%), url('URL_DE_LA_IMATGE_3');\">\n      <span class=\"num-servei\">03<\/span>\n      <h3>Disseny web<\/h3>\n    <\/a>\n\n    <!-- Targeta 4 - \ud83d\udd34 BURDEUS \/ VI REIAL -->\n    <a href=\"https:\/\/reloop.cat\/?page_id=230\" class=\"swiper-slide targeta-premium\" style=\"background-image: linear-gradient(to top, rgba(128, 4, 18, 0.85) 0%, rgba(128, 4, 18, 0.3) 100%), url('URL_DE_LA_IMATGE_4');\">\n      <span class=\"num-servei\">04<\/span>\n      <h3>Comunicaci\u00f3 esdeveniments<\/h3>\n    <\/a>\n\n    <!-- Targeta 5 - \u26ab GRAFIT \/ NEGRE PREMIUM -->\n    <a href=\"https:\/\/reloop.cat\/?page_id=228\" class=\"swiper-slide targeta-premium\" style=\"background-image: linear-gradient(to top, rgba(128, 4, 18, 0.85) 0%, rgba(128, 4, 18, 0.3) 100%), url('URL_DE_LA_IMATGE_5');\">\n      <span class=\"num-servei\">05<\/span>\n      <h3>Branding<\/h3>\n    <\/a>\n\n  <\/div>\n\n  <!-- \ud83c\udf9b\ufe0f FLETXES NAVEGACI\u00d3 -->\n  <div class=\"swiper-button-prev\"><\/div>\n  <div class=\"swiper-button-next\"><\/div>\n<\/div>\n\n<!-- \ud83c\udfa8 ESTILS (Mantenim l'esfumat de sota i els blurs protectors intactes) -->\n<style>\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@600&family=Questrial&display=swap');\n\n.carrusel-infinit {\n  position: relative; \n  width: 100% !important;\n  max-width: 100% !important;\n  padding: 80px 0 140px 0 !important; \n  overflow: hidden;\n}\n\n\/* El vel invisible inferior cap al blanc *\/\n.carrusel-infinit::after {\n  content: '';\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 110px; \n  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);\n  pointer-events: none; \n  z-index: 10;\n}\n\n\/* BASE TARGETES (Aqu\u00ed est\u00e0 el difuminat intocable de fons) *\/\n.targeta-premium {\n  height: 340px !important; \n  border-radius: 28px !important;            \n  padding: 40px !important;\n  box-sizing: border-box !important;\n  display: flex !important;\n  flex-direction: column !important;\n  justify-content: space-between !important;\n  text-decoration: none !important; \n  \n  background-size: cover !important;\n  background-position: center !important;\n  background-repeat: no-repeat !important;\n  \n  opacity: 0.25;                  \n  filter: blur(6px); \/* \ud83d\udc48 Aix\u00f2 mant\u00e9 les de darrere difuminades *\/\n  transform: scale(0.85); \n  transition: all 0.5s ease-in-out !important; \n}\n\n\/* TARGETA CENTRAL ACTIVA *\/\n.targeta-premium.swiper-slide-active {\n  opacity: 1 !important;          \n  filter: blur(0px) !important; \n  transform: scale(1.05) !important; \n  box-shadow: 0 35px 70px rgba(0,0,0,0.22) !important; \n}\n\n\/* Textos interiors *\/\n.targeta-premium h3 {\n  font-family: 'Questrial', sans-serif; \n  font-size: 32px; \n  font-weight: 800;\n  margin: 0;\n  color: #ffffff; \n  letter-spacing: -0.5px;\n  line-height: 1.1;\n}\n\n.num-servei {\n  font-family: 'Plus Jakarta Sans', sans-serif;\n  font-size: 13px;\n  font-weight: 600;\n  color: #ffffff;\n  opacity: 0.6;\n  letter-spacing: 3px;\n}\n\n\/* Fletxes de navegaci\u00f3 *\/\n.swiper-button-next, .swiper-button-prev {\n  color: #1a1a1a !important;\n  background: rgba(255, 255, 255, 0.95);\n  width: 55px;\n  height: 55px;\n  border-radius: 50%;\n  box-shadow: 0 8px 24px rgba(0,0,0,0.12);\n  z-index: 20; \n}\n.swiper-button-prev { left: 4% !important; }\n.swiper-button-next { right: 4% !important; }\n\n.swiper-button-next::after, .swiper-button-prev::after {\n  font-size: 18px !important;\n  font-weight: bold;\n}\n\n\/* M\u00f2bils *\/\n@media (max-width: 767px) {\n  .carrusel-infinit { padding: 60px 0 100px 0 !important; }\n  .targeta-premium { height: 280px !important; }\n  .targeta-premium h3 { font-size: 24px; }\n .swiper-button-next, .swiper-button-prev {\n    display: flex !important;\n    width: 42px !important;\n    height: 42px !important;\n  }\n  .swiper-button-prev { left: 8px !important; }\n  .swiper-button-next { right: 8px !important; }\n  \n  .swiper-button-next::after, .swiper-button-prev::after {\n    font-size: 14px !important;\n<\/style>\n\n<!-- \ud83d\ude80 PROGRAMACI\u00d3 INDESTRUCTIBLE -->\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n  new Swiper('.carrusel-infinit', {\n    loop: true, \n    centeredSlides: true, \n    slidesPerView: 1, \n    spaceBetween: 20,\n    breakpoints: {\n      768: { slidesPerView: 3, spaceBetween: 40, }\n    },\n    navigation: {\n      nextEl: '.swiper-button-next',\n      prevEl: '.swiper-button-prev',\n    },\n  });\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6431b7a e-con-full e-flex e-con e-parent\" data-id=\"6431b7a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-53643e1 elementor-widget elementor-widget-html\" data-id=\"53643e1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"separador-marquesina-scroll\">\n  \n  <div class=\"fila-marquesina linia-superior\">\n    <div class=\"marquesina-interior cap-a-dreta\" id=\"marquesina-dalt\">\n      <div class=\"bloc-text\">PORTFOLI   \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI<\/div>\n      <div class=\"bloc-text\" aria-hidden=\"true\">PORTFOLI   \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOL<\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"fila-marquesina linia-inferior\">\n    <div class=\"marquesina-interior cap-a-esquerra\" id=\"marquesina-abaix\">\n      <div class=\"bloc-text\">\/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI<\/div>\n      <div class=\"bloc-text\" aria-hidden=\"true\">\/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI \/ PORTFOLI<\/div>\n    <\/div>\n  <\/div>\n\n<\/div>\n\n<script>\n\/\/ \ud83c\udfc3\u200d\u2642\ufe0f JAVASCRIPT MATEM\u00c0TIC PER AL BUCLE INFINIT\nwindow.addEventListener('scroll', () => {\n  const despla\u00e7ament = window.scrollY;\n  const velocitat = 0.35; \/\/ Pots canviar aquest n\u00famero per fer-ho m\u00e9s r\u00e0pid (ex: 0.5) o m\u00e9s lent (ex: 0.2)\n  \n  const mDalt = document.getElementById('marquesina-dalt');\n  const mAbaix = document.getElementById('marquesina-abaix');\n  \n  if (mDalt && mAbaix) {\n    \/\/ Calculem l'amplada real d'un sol bloc de text (la meitat del contenidor interior)\n    const ampladaBlocDalt = mDalt.scrollWidth \/ 2;\n    const ampladaBlocAbaix = mAbaix.scrollWidth \/ 2;\n    \n    \/\/ \ud83e\uddee L'operador '%' (m\u00f2dul) fa que el valor torni a zero quan arriba a l'amplada del bloc\n    let xDalt = (despla\u00e7ament * velocitat) % ampladaBlocDalt;\n    let xAbaix = (-despla\u00e7ament * velocitat) % ampladaBlocAbaix;\n    \n    \/\/ Apliquem el moviment (la de dalt comen\u00e7a despla\u00e7ada a l'esquerra per moure's a la dreta)\n    mDalt.style.transform = `translateX(${-ampladaBlocDalt + xDalt}px)`;\n    mAbaix.style.transform = `translateX(${xAbaix}px)`;\n  }\n});\n<\/script>\n\n<style>\n\/* \ud83d\udcd0 ESTRUCTURA S\u00daPER FINETA I CONTROLADA *\/\n.separador-marquesina-scroll {\n  width: 100% !important;\n  overflow: hidden !important;\n  background-color: transparent !important;\n  padding-top: 90px !important;\n  padding-bottom: 90px !important;\n  box-sizing: border-box !important;\n}\n\n.fila-marquesina {\n  width: 100% !important;\n  overflow: hidden !important;\n  white-space: nowrap !important;\n  padding: 8px 0 !important; \n}\n\n\/* L\u00ednies negres estilitzades *\/\n.linia-superior {\n  border-top: 1px solid #000000 !important;\n  border-bottom: 1px solid #000000 !important;\n}\n\n.linia-inferior {\n  border-bottom: 1px solid #000000 !important;\n  margin-top: -1px; \/* Evita doble gruix al mig *\/\n}\n\n\/* \ud83e\uddf1 DISPOSICI\u00d3 DELS BLOCS EN HORITZONTAL *\/\n.marquesina-interior {\n  display: flex !important;\n  width: max-content !important; \/* Imprescindible per calcular b\u00e9 els blocs *\/\n  will-change: transform !important;\n}\n\n.bloc-text {\n  display: inline-block !important;\n  white-space: nowrap !important;\n  padding-right: 20px !important; \/* Un p\u00e8l d'aire abans de connectar amb el seg\u00fcent bloc *\/\n}\n\n\/* \u270d\ufe0f TIPOGRAFIA PREMIUM (FINA I DISCRETA) *\/\n.bloc-text {\n  font-family: 'Helvetica Neue', Arial, sans-serif !important;\n  font-weight: 500 !important; \n  font-size: 22px !important;  \n  text-transform: uppercase !important;\n  color: #000000 !important;\n  letter-spacing: 2px !important;\n}\n\n\/* M\u00f2bils *\/\n@media (max-width: 767px) {\n  .bloc-text {\n    font-size: 16px !important;\n  }\n  .separador-marquesina-scroll {\n    padding-top: 60px !important;\n    padding-bottom: 60px !important;\n  }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5b10ce3 e-con e-atomic-element e-flexbox-base e-default-div e-8f5d5dc \" data-id=\"5b10ce3\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"5b10ce3\">\n    \t\t<div class=\"elementor-element elementor-element-46c4e90 elementor-widget elementor-widget-html\" data-id=\"46c4e90\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.css\" \/>\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.js\"><\/script>\n\n<div class=\"reloop-portfolio\">\n  \n  <div class=\"portfolio-card\" onclick=\"openReloopPopup('projecte1')\">\n    <img data-recalc-dims=\"1\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/06\/DSC09952.jpg?w=800&#038;ssl=1\" alt=\"Projecte 1\">\n    <div class=\"portfolio-text\">\n      <h3>Mateos Legal<\/h3>\n      <p>Fotografia d'esdeveniments \/ Gesti\u00f3 XXSS<\/p>\n    <\/div>\n  <\/div>\n\n  <div class=\"portfolio-card\" onclick=\"openReloopPopup('projecte2')\">\n    <img data-recalc-dims=\"1\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/06\/PHOTO-2026-01-15-20-22-42-4.jpg?w=800&#038;ssl=1\" alt=\"Projecte 2\">\n    <div class=\"portfolio-text\">\n      <h3>The Cyclery<\/h3>\n      <p>Fotografia de producte<\/p>\n    <\/div>\n  <\/div>\n\n  <div class=\"portfolio-card\" onclick=\"openReloopPopup('projecte3')\">\n    <img data-recalc-dims=\"1\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/reloop.cat\/wp-content\/uploads\/2026\/06\/Neus-brioix-6.png?w=800&#038;ssl=1\" alt=\"Projecte 3\">\n    <div class=\"portfolio-text\">\n      <h3>Brioix Girona<\/h3>\n      <p>Branding \/ Gesti\u00f3 XXSS<\/p>\n    <\/div>\n  <\/div>\n\n<\/div>\n\n<div id=\"reloop-lightbox\" class=\"reloop-lightbox\" onclick=\"closeReloopPopup()\">\n  <span class=\"close-popup\">&times;<\/span>\n  <div class=\"popup-content\" onclick=\"event.stopPropagation()\">\n    <div class=\"swiper mySwiper\">\n      <div class=\"swiper-wrapper\" id=\"swiper-container-inner\"><\/div>\n      <div class=\"swiper-button-next\"><\/div>\n      <div class=\"swiper-button-prev\"><\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<style>\n.reloop-portfolio {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 25px;\n  width: 100%;\n  padding: 0 40px;\n  box-sizing: border-box;\n}\n\n@media (max-width: 768px) {\n  .reloop-portfolio {\n    grid-template-columns: 1fr;\n    padding: 0 20px;\n  }\n}\n\n.portfolio-card {\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  aspect-ratio: 4 \/ 3;\n  cursor: pointer;\n  background-color: #000;\n}\n\n.portfolio-card img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  transition: transform 0.6s ease, filter 0.6s ease;\n  filter: brightness(0.4); \n}\n\n.portfolio-card:hover img {\n  transform: scale(1.06);\n  filter: brightness(0.8);\n}\n\n.portfolio-text {\n  position: absolute;\n  bottom: 20px;\n  left: 20px;\n  right: 20px;\n  z-index: 10;\n  pointer-events: none;\n}\n\n.portfolio-text h3 {\n    font-family: 'Questrial', sans-serif !important;\n  margin: 0 0 4px 0;\n  color: #ffffff !important;\n  font-size: 20px !important;\n  font-weight: bold !important;\n  text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.9);\n}\n\n.portfolio-text p {\n    font-family: 'Questrial', sans-serif !important;\n  margin: 0;\n  color: #d1d1d1 !important;\n  font-size: 14px !important;\n  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.9);\n}\n\n.reloop-lightbox {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: rgba(0, 0, 0, 0.9);\n  z-index: 999999;\n  justify-content: center;\n  align-items: center;\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n.reloop-lightbox.active {\n  display: flex;\n  opacity: 1;\n}\n\n\/* \ud83d\udd0e BUSCA AIX\u00d2 AL TEU CSS I SUBSTITUEIX-HO: *\/\n.popup-content {\n  position: relative;\n  width: 95%;           \/* Abans 85%. Ara aprofita gaireb\u00e9 tota l'amplada de la pantalla *\/\n  max-width: 1400px;    \/* Abans 900px. Ara permet que les fotos creixin molt m\u00e9s en ordinadors *\/\n  height: 85vh;         \/* En lloc de for\u00e7ar un 16:9, fem que ocupi el 85% de l'al\u00e7ada de la pantalla *\/\n  background: transparent; \/* Treiem la caixa negra fixa perqu\u00e8 la foto floti lliure sobre el fons *\/\n  border-radius: 6px;\n  overflow: hidden;\n}\n\n.close-popup {\n  position: absolute;\n  top: 20px;\n  right: 35px;\n  color: #fff;\n  font-size: 45px;\n  cursor: pointer;\n  z-index: 1000000;\n  transition: color 0.2s;\n}\n\n.close-popup:hover { color: #bbb; }\n\n.swiper { width: 100%; height: 100%; }\n.swiper-slide { display: flex; justify-content: center; align-items: center; background: #000; }\n.swiper-slide img, .swiper-slide video { width: 100%; height: 100%; object-fit: contain; }\n\n.swiper-button-next, .swiper-button-prev { color: #ffffff !important; }\n<\/style>\n\n<script>\nconst projectData = {\n  \n  \/\/ \ud83c\udf9e\ufe0f POP-UP 1 (Mateos Legal)\n  'projecte1': [\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/IMG_4416.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/DSC09770.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/IMG_4418.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/IMG_4420.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/IMG_4421.jpg' },\n    \n  ],\n  \n  \/\/ \ud83c\udf9e\ufe0f POP-UP 2 (The Cyclery)\n  'projecte2': [\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/PHOTO-2026-01-15-20-22-41-3.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/PHOTO-2026-01-15-20-22-44.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/PHOTO-2026-01-15-20-22-46-2.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/PHOTO-2026-01-15-20-22-40.jpg' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/PHOTO-2026-01-15-20-22-42.jpg' },\n    \n  ],\n  \n  \/\/ \ud83c\udf9e\ufe0f POP-UP 3 (Brioix Girona)\n  'projecte3': [\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/Neus-brioix-6-1.png' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/Neus-brioix-6-3.png' },\n    { type: 'image', src: 'https:\/\/reloop.cat\/wp-content\/uploads\/2026\/06\/Neus-brioix-6-4.png' },\n    \n  ]\n  \n};\n\nlet swiperInstance = null;\n\nfunction openReloopPopup(id) {\n  const lightbox = document.getElementById('reloop-lightbox');\n  const container = document.getElementById('swiper-container-inner');\n  container.innerHTML = ''; \n  \n  if (!projectData[id]) return;\n\n  projectData[id].forEach(item => {\n    const slide = document.createElement('div');\n    slide.className = 'swiper-slide';\n    \n    \/\/ \ud83d\udee1\ufe0f FILTRE ANTIFANTASMES: Destrueix qualsevol car\u00e0cter invisible o estrany del link\n    const linkNet = item.src.replace(\/[^\\x20-\\x7E]\/g, '').trim(); \n    \n    if (item.type === 'image') {\n      slide.innerHTML = `<img decoding=\"async\" src=\"${linkNet}\">`;\n    } else if (item.type === 'video') {\n      slide.innerHTML = `<video controls playsinline src=\"${linkNet}\"><\/video>`;\n    }\n    \n    container.appendChild(slide);\n  });\n\n  lightbox.classList.add('active');\n  document.body.style.overflow = 'hidden';\n\n  swiperInstance = new Swiper(\".mySwiper\", {\n    navigation: { nextEl: \".swiper-button-next\", prevEl: \".swiper-button-prev\" },\n    loop: true,\n    keyboard: { enabled: true },\n    observer: true,\n    observeParents: true\n  });\n}\n\nfunction closeReloopPopup() {\n  document.getElementById('reloop-lightbox').classList.remove('active');\n  document.body.style.overflow = '';\n  \n  const videos = document.querySelectorAll('.swiper-slide video');\n  videos.forEach(v => v.pause());\n\n  if (swiperInstance) {\n    swiperInstance.destroy(true, true);\n    swiperInstance = null;\n  }\n}\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-1958524 e-con e-atomic-element e-flexbox-base e-default-div e-3cab4ec \" data-id=\"1958524\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"1958524\">\n    \t\t<div class=\"elementor-element elementor-element-5b52646 elementor-widget elementor-widget-spacer\" data-id=\"5b52646\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-88e7081 e-con e-atomic-element e-flexbox-base e-default-div e-1836c60 \" data-id=\"88e7081\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"88e7081\">\n    \t\t<div class=\"elementor-element elementor-element-5e9ac0c elementor-widget elementor-widget-html\" data-id=\"5e9ac0c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"portfolio-btn-container\">\n  <a href=\"https:\/\/reloop.cat\/?page_id=162\" class=\"portfolio-redirect-btn\">Veure tot el portfoli<\/a>\n<\/div>\n\n<style>\n.portfolio-btn-container {\n  display: flex;\n  justify-content: center;\n  width: 100%;\n  \/* Nota: Ara pots controlar els marges de dalt i abaix \n     directament des de la pestanya \"Avan\u00e7at\" d'Elementor si ho prefereixes! *\/\n}\n\n.portfolio-redirect-btn {\n    font-family: 'Questrial', sans-serif !important;\n  display: inline-block;\n  background-color: #7e150b;    \/* Fons blanc *\/\n  color: #ffffff !important;    \/* Text negre *\/\n  text-decoration: none;\n  padding: 14px 36px;\n  font-size: 15px !important;\n  font-weight: bold !important;\n  letter-spacing: 0.5px;\n  border-radius: 50px;          \/* Costats arrodonits *\/\n  border: 2px solid #ffffff;    \/* Vora blanca *\/\n  transition: all 0.3s ease;\n  cursor: pointer;\n}\n\n\/* Efecte Hover *\/\n.portfolio-redirect-btn:hover {\n background-color: #7e150b; \/* 1. Aqu\u00ed posa el color que vols que agafi el FONS quan passis el ratol\u00ed *\/\n  color: #ffffff !important;     \n  transform: translateY(-3px);   \n  box-shadow: 0 10px 20px rgba(0,0,0,0.2);\n}\n\/* \ud83d\udd76\ufe0f Vaporitzar la cap\u00e7alera i el men\u00fa per defecte del tema *\/\nheader, .site-header, #masthead, .main-navigation, #site-navigation {\n  display: none !important;\n}\n\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-21bf540 e-con e-atomic-element e-flexbox-base e-default-div e-0f7bbd1 \" data-id=\"21bf540\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"21bf540\">\n    \t\t<div class=\"elementor-element elementor-element-97121c8 elementor-widget elementor-widget-html\" data-id=\"97121c8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ===================================================\n     BLOC CRIDA A L'ACCI\u00d3 (CTA) PER A LA P\u00c0GINA D'INICI\n     ESTIL: MINIMAL FANZINE \/ EDITORIAL\n     =================================================== -->\n<div class=\"cta-inici-contenidor\">\n  \n  <!-- L\u00ednia decorativa fina superior tipus diari -->\n  <div class=\"cta-linia-separadora\"><\/div>\n\n  <!-- Caixa de contingut amb fons granat de marca -->\n  <div class=\"cta-inici-contingut\">\n    <!-- Etiqueta fanzine petita superior en un color crema suau molt premium -->\n    <span class=\"cta-etiqueta\"><\/span>\n    \n    <!-- T\u00edtol de gran format en blanc pur -->\n    <h2 class=\"cta-titol\">Tens una idea al cap? Parlem!<\/h2>\n    \n    <!-- Text de lectura agradable en to trencat -->\n    <p class=\"cta-subtitol\">\n      No necessites tenir-ho tot definit. Explica'ns qu\u00e8 tens al cap, quins s\u00f3n els teus objectius i les teves aspiracions o, simplement, saluda'ns.\n    <\/p>\n\n    <!-- Bot\u00f3 de contrast blanc pur amb l'ombra fanzine de la marca -->\n    <div class=\"cta-boto-wrapper\">\n      <a href=\"https:\/\/reloop.cat\/?page_id=59\" class=\"cta-boto-enllac\">\n        Inicia la conversa \u2197\n      <\/a>\n    <\/div>\n  <\/div>\n\n  <!-- L\u00ednia decorativa fina inferior -->\n  <div class=\"cta-linia-separadora\"><\/div>\n\n<\/div>\n\n<!-- ===================================================\n     ESTILS CSS COHERENTS AMB LA RESTA DE LA WEB\n     =================================================== -->\n<style>\n\/* Forcem que utilitzi la teva font de marca 'Questrial' *\/\n.cta-inici-contenidor, \n.cta-inici-contenidor * {\n  font-family: 'Questrial', sans-serif !important;\n  box-sizing: border-box;\n}\n\n\/* Contenidor general amb bona separaci\u00f3 de seguretat *\/\n.cta-inici-contenidor {\n  width: 100%;\n  max-width: 1100px;\n  margin: 60px auto;\n  padding: 0 20px;\n  text-align: center;\n}\n\n\/* L\u00ednies fines de diari de 1px amb el negre de la marca *\/\n.cta-linia-separadora {\n  width: 100%;\n  height: 1px;\n  background-color: rgba(26, 26, 26, 0.15);\n  margin: 20px 0;\n}\n\n\/* Caixa granat de la marca amb ombra negra tipus fanzine *\/\n.cta-inici-contingut {\n  background-color: #7e150b; \/* Granat corporatiu *\/\n  border: 2px solid #1a1a1a;  \/* Contorn negre s\u00f2lid *\/\n  box-shadow: 8px 8px 0px #1a1a1a; \/* Ombra s\u00f2lida robusta de marca *\/\n  padding: 60px 40px;\n  border-radius: 16px; \/* Cantonades arrodonides de marca *\/\n}\n\n\/* Etiqueta en un to sorra\/crema suau *\/\n.cta-etiqueta {\n  display: block;\n  font-size: 12px;\n  color: #f5ebe6; \n  text-transform: uppercase;\n  letter-spacing: 1.5px;\n  margin-bottom: 25px;\n}\n\n\/* T\u00edtol principal en blanc *\/\n.cta-titol {\n  font-size: 52px;\n  color: #ffffff;\n  margin: 0 0 20px 0;\n  font-weight: normal;\n  letter-spacing: -1.5px;\n  line-height: 1.1;\n}\n\n\/* Text descriptiu en un blanc amb opacitat per a una lectura relaxada *\/\n.cta-subtitol {\n  font-size: 16px;\n  color: rgba(255, 255, 255, 0.85);\n  line-height: 1.7;\n  max-width: 600px;\n  margin: 0 auto 40px auto;\n}\n\n\/* Contenidor del bot\u00f3 per centrar-lo *\/\n.cta-boto-wrapper {\n  display: flex;\n  justify-content: center;\n}\n\n\/* \ud83c\udfaf EL BOT\u00d3 PREMIUM EN BLANC AMB OMBRA S\u00d2LIDA *\/\n.cta-boto-enllac {\n  display: inline-block;\n  background-color: #ffffff; \/* Fons blanc pur per contrastar *\/\n  color: #1a1a1a !important; \/* Text en negre de marca *\/\n  font-size: 15px !important;\n  font-weight: bold !important;\n  text-decoration: none;\n  padding: 16px 42px;\n  border-radius: 50px;\n  border: 2px solid #1a1a1a; \/* Contorn fosc molt fi *\/\n  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);\n  cursor: pointer;\n  box-shadow: 4px 4px 0px #1a1a1a; \/* Ombra s\u00f2lida de marca *\/\n}\n\n\/* EFECTE HOVER: El bot\u00f3 s'inverteix a negre s\u00f2lid de forma elegant *\/\n.cta-boto-enllac:hover {\n  transform: translate(-2px, -2px);\n  background-color: #1a1a1a; \/* Canvia a negre de cop *\/\n  color: #ffffff !important; \/* Text a blanc *\/\n  box-shadow: 6px 6px 0px #1a1a1a; \/* L'ombra s\u00f2lida creix *\/\n}\n\n\/* ---------------------------------\n   RESPONSIVE (ADAPTACI\u00d3 M\u00d2BIL I TABLETS)\n   --------------------------------- *\/\n@media (max-width: 768px) {\n  .cta-inici-contingut {\n    padding: 40px 20px;\n  }\n  .cta-titol {\n    font-size: 36px;\n    letter-spacing: -0.5px;\n  }\n  .cta-subtitol {\n    font-size: 14px;\n    margin-bottom: 30px;\n  }\n  .cta-boto-enllac {\n    padding: 14px 32px;\n    font-size: 14px !important;\n    width: 100%;\n    max-width: 280px;\n  }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>[ men\u00fa ] reloop_ \u2715 01. inici 02. nosaltres 03. serveis 04. portfoli 05. contacte Serveis Portfoli Nosaltres Contacte SERVEIS Donem la volta a all\u00f2 de sempre. Som l&#8217;ag\u00e8ncia creativa que necessites. Transformem idees atrevides en estrat\u00e8gies reals. 01 Gesti\u00f3 XXSS 02 Creaci\u00f3 de contingut 03 Disseny web 04 Comunicaci\u00f3 esdeveniments 05 Branding PORTFOLI \/ [&hellip;]<\/p>\n","protected":false},"author":278304783,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_wpcom_ai_launchpad_about_page":false,"_wpcom_ai_launchpad_gallery_page":false,"_wpcom_ai_launchpad_contact_page":false,"_wpcom_ai_launchpad_events_page":false,"_wpcom_ai_launchpad_video_page":false,"_wpcom_ai_launchpad_portfolio_piece":false,"_jetpack_hide_featured_image":false,"_jetpack_featured_image_duplicate_dismissed":0,"footnotes":""},"class_list":["post-40","page","type-page","status-publish","hentry"],"jetpack_likes_enabled":true,"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/Ph8Fsp-E","jetpack-related-posts":[{"id":228,"url":"https:\/\/reloop.cat\/esp\/branding\/","url_meta":{"origin":40,"position":0},"title":"Branding","author":"N\u00faria Pons","date":"31 de julio de 2026","format":false,"excerpt":"BRANDING BRANDING BRANDING BRANDING BRANDING BRANDING Dissenyem identitats visuals amb \u00e0nima, estrat\u00e8gia i un prop\u00f2sit clar per a marques que busquen fer soroll i liderar el seu sector. \u2022 ESTRAT\u00c8GIA DE MARCA \u2022 IDENTITAT VISUAL \u2022 TARGET \u2022 LOGOTIP \u2022 MARCA GR\u00c0FICA \u2022 VALORS El concepte L'identitat visual de la\u2026","rel":"","context":"Entrada similar","block_context":{"text":"Entrada similar","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/pages\/40","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/users\/278304783"}],"replies":[{"embeddable":true,"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/comments?post=40"}],"version-history":[{"count":100,"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/pages\/40\/revisions"}],"predecessor-version":[{"id":1504,"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/pages\/40\/revisions\/1504"}],"wp:attachment":[{"href":"https:\/\/reloop.cat\/esp\/wp-json\/wp\/v2\/media?parent=40"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}