/*
Theme Name: Aplitec Child
Theme URI: www.aplitecinformatica.com
Template: hello-elementor
Author: Aplitec Informàtica
Author URI: www.aplitecinformatica.com
Description: hehe
Tags: hehe
Version: 3.4.4.1756979451
Updated: 2025-09-04 11:50:51
*/

html, body { overflow-x: clip; }

html {
  scroll-behavior: smooth;
}

/* Offset per anchors amb header sticky */
#serv {
  scroll-margin-top: 140px;
}


/* ==========================================
   DESKTOP (≥1025px)
========================================== */
@media (min-width: 1401px) {
  .ekit-template-content-markup.ekit-template-content-header {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 10000;
      background: rgba(255, 255, 255, 0.0);
      transform: translate3d(0, var(--hdr-nudge, 0), 0);
      transition:
          backdrop-filter 250ms ease,
          -webkit-backdrop-filter 250ms ease,
          transform 320ms ease;
      will-change: transform, backdrop-filter;
      pointer-events: auto !important;
      
      
  }
  .ekit-template-content-markup.ekit-template-content-header.blur-active {
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
  }
  
  /* Assegura que tots els elements del menú estiguin per sobre */
  .elementskit-nav-link-container,
  .elementskit-navbar-nav,
  .elementskit-navbar-nav > li {
      z-index: inherit !important;
      pointer-events: auto !important;
  }
  
  /* CRÍTIC: Bloqueja la interacció amb elements per sota del header */
  .ekit-template-content-markup.ekit-template-content-header::before {
      content: "" !important;
      position: absolute !important;
      inset: 0 !important;
      background: transparent !important;
      pointer-events: auto !important;
      z-index: -1 !important;
  }
}


/* ==========================================
   MÒBIL (≤1024px)
========================================== */
@media (max-width: 1400px) {
  
  .ekit-template-content-markup.ekit-template-content-header {
      position: fixed !important; 
      top: 0;
      left: 0;
      width: 100%;
      z-index: 1000 !important;
      background: rgba(255, 255, 255, 0.0);
      transform: translate3d(0, var(--hdr-nudge, 0), 0);
      transition:
          backdrop-filter 250ms ease,
          -webkit-backdrop-filter 250ms ease,
          transform 320ms ease;
  }
  
  .ekit-template-content-markup.ekit-template-content-header.blur-active {
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
  }
  
  body {
      padding-top: var(--mobile-header-height);
  }
  
  /* ==========================================
     ARREGLA EL MENÚ OFFCANVAS (HAMBURGUESA)
  ========================================== */
  
  /* El contenidor del menú lateral */
  .elementskit-menu-container.elementskit-menu-offcanvas-elements {
      position: fixed !important;
      top: 0 !important;
      left: 0 !important;
      height: 100vh !important;
      width: 100% !important;
      max-width: 700px !important;
      overflow-y: auto !important;
      overflow-x: hidden !important;
      transform: translateX(-100%) !important;
      transition: transform 0.3s ease !important;
  }
  
  /* Quan el menú està obert */
  .elementskit-menu-container.elementskit-menu-offcanvas-elements.active {
      transform: translateX(0) !important;
  }
  
  /* Panel d'identitat (logo + botó tancar) */
  .elementskit-nav-identity-panel {
      position: relative !important;
      top: 0 !important;
      left: 0 !important;
      width: 100% !important;
      display: flex !important;
      justify-content: space-between !important;
      align-items: center !important;
      padding: 20px !important;
      box-sizing: border-box !important;
  }
  
  /* Logo dins el menú */
  .elementskit-nav-logo {
      position: relative !important;
      margin: 0 !important;
  }
  
  /* Botó de tancar */
  .elementskit-menu-close {
      position: relative !important;
      right: 0 !important;
      top: 0 !important;
  }
  
  /* Llista del menú */
  .elementskit-navbar-nav {
      position: relative !important;
      top: 0 !important;
      left: 0 !important;
      width: 100% !important;
      padding: 20px !important;
      box-sizing: border-box !important;
  }
  
  /* Items del menú */
  .elementskit-navbar-nav > li {
      position: relative !important;
      width: 100% !important;
  }
  
  
/* Tamanys logos topbar - Desktop */
@media (min-width: 1025px) {
  .header-logo img {
    height: 40px !important;
    width: 40px !important;
    object-fit: contain !important;
  }
  .header-logo.ofertes #cr-img {
    display: none !important;
  }
  .header-logo.ofertes lottie-player {
    display: flex !important;
    height: 40px !important;
    width: 40px !important;
    align-items: center;
  }
}

/* Tamanys logos topbar - Mobile/Tablet */
@media (max-width: 1024px) {
  .header-logo img {
    height: 36px !important;
    width: 36px !important;
    object-fit: contain !important;
  }
  .header-logo.ofertes lottie-player {
    display: none !important;
  }
  .header-logo.ofertes #cr-img {
    display: block !important;
    height: 36px !important;
    width: 36px !important;
  }
}

/* Centrat vertical del botó */
.header-logo.ofertes {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}


  /* ==========================================
     ARREGLA ELS SUBMENÚS (DESPLEGABLES)
  ========================================== */
  
  /* Indicador de submenú (fletxa) - permet que es cliqui */
  .elementskit-submenu-indicator {
      pointer-events: auto !important;
      cursor: pointer !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      padding: 10px !important;
  }
  
  /* Submenús ocults per defecte */
  .elementskit-dropdown.elementskit-submenu-panel {
      display: none !important;
      position: relative !important;
      width: 100% !important;
      left: 0 !important;
      opacity: 1 !important;
      visibility: visible !important;
      transform: none !important;
      padding-left: 20px !important;
      background: transparent !important;
      box-shadow: none !important;
      max-height: 0 !important;
      overflow: hidden !important;
      transition: max-height 0.3s ease !important;
  }
  
  /* Submenús visibles amb la classe 'elementskit-dropdown-open' */
  .elementskit-dropdown.elementskit-submenu-panel.elementskit-dropdown-open {
      display: block !important;
      max-height: 2000px !important;
  }
  
  /* Per si de cas també mantenim la classe 'active' al pare */
  .elementskit-dropdown-has.active > .elementskit-dropdown.elementskit-submenu-panel {
      display: block !important;
      max-height: 2000px !important;
  }
  
  /* Items dins dels submenús */
  .elementskit-dropdown.elementskit-submenu-panel > li {
      position: relative !important;
      width: 100% !important;
  }
  
  /* Opcional: Rota la fletxa quan està obert */
  .elementskit-dropdown-open > a .elementskit-submenu-indicator {
      transform: rotate(180deg);
      transition: transform 0.3s ease;
  }
  
  /* ==========================================
     ELIMINA L'OVERLAY DEL MENÚ COMPLETAMENT
  ========================================== */
  .elementskit-menu-overlay {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      pointer-events: none !important;
  }

}

/* ==========================================================
   FORÇA SUBMENÚS ELEMENTKIT A MOSTRAR-SE (ULTRA-ESPECÍFIC)
========================================================== */

/* Per a MÒBIL: Força els submenús oberts */
@media (max-width: 1024px) {
  
  /* Selector ultra-específic que coincideix exactament amb l'HTML */
  ul.elementskit-dropdown.elementskit-submenu-panel.elementskit-dropdown-open,
  ul#menu-menu-mobile .elementskit-dropdown.elementskit-dropdown-open,
  .elementskit-menu-offcanvas-elements ul.elementskit-dropdown-open {
      display: block !important;
      position: relative !important;
      opacity: 1 !important;
      visibility: visible !important;
      height: auto !important;
      max-height: none !important;
      overflow: visible !important;
      transform: none !important;
      left: 0 !important;
      top: 0 !important;
  }
  
  /* Assegura que els <li> dins dels submenús també es veuen */
  ul.elementskit-dropdown-open > li {
      display: list-item !important;
      opacity: 1 !important;
      visibility: visible !important;
  }
  
  /* Per si de cas, també amb la classe 'active' */
  .elementskit-dropdown-has.active > ul.elementskit-dropdown {
      display: block !important;
      height: auto !important;
      max-height: none !important;
  }
  
}

/* ==========================================
   FIX NOMÉS PER AL DROPDOWN "DISSENY"
========================================== */
@media (min-width: 1025px) {

  /* Referència correcta */
  #menu-item-5080 {
    position: relative !important;
  }

  /* SOLUCIÓ: Pont invisible per mantenir el hover */
  #menu-item-5080::after {
    content: "" !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    height: 40px !important; /* Espai entre menú i megamenú */
    background: transparent !important;
    pointer-events: auto !important;
    z-index: 9999 !important; /* Per sobre dels logos */
  }

  #menu-item-5080 > .elementskit-submenu-panel {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    top: calc(100% + 25px) !important;
    max-width: min(1200px, 96vw) !important;
    width: max-content !important;
    margin-top:13px!important;
    padding: 50px 70px !important;
    box-sizing: border-box !important;
    z-index: 99999 !important;
  }

}


:root{ --hdr:#D3033B; }
.elementor-location-header,
.elementor-section,
.elementor-container,
.elementor-element[data-id="e93b488"]{
  overflow: visible !important;
}

.elementor-element[data-id="e93b488"]{
  position: relative;
  z-index: 1;
  isolation: isolate;
}
.elementor-element[data-id="e93b488"]::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
 width:100vw; 
 left: calc(50% - 50vw);
  background:var(--hdr);
  clip-path: polygon(0 0, 61% 0, 58% 100%, 0 100%);
  z-index:-1;
  pointer-events:none;
} 

.elementor-location-header,
.elementor-section,
.elementor-container,
.elementor-element[data-id="1c86f9f5"]{
  overflow: visible !important;
}

.elementor-element[data-id="1c86f9f5"]{
  position: relative;
}
.elementor-element[data-id="1c86f9f5"]::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
  width:100vw;
  right: 0;
left: 71%;
transform: translateX(-50%);

  background: var(--hdr);
  clip-path: polygon(7% 0%, 85% 0%, 85% 100%, 4% 100%);
  z-index:-1;
}

/* MÒBIL - Valors per a pantalles petites */
@media (max-width: 767px) {
  .elementor-element[data-id="e93b488"]::before {
    clip-path: polygon(0 0, 78% 0, 68% 100%, 0 100%);
  }

  .elementor-element[data-id="1c86f9f5"]::before {
    clip-path: polygon(15% 0%, 85% 0%, 85% 100%, 5% 100%);
  }
}
.ekit-template-content-markup.ekit-template-content-header
  .elementor-element.hdr-subrow > .e-con-inner{
  margin-left: auto !important;
  margin-right:-75px !important;
}

.elementor-element[data-id="633f55b"]{
  transition: opacity 300ms ease;
  opacity: 1;
}
.elementor-element[data-id="633f55b"].is-hidden{
  opacity: 0;
  pointer-events: none;
}

#header-main-nav .hs-wrap,
#header-main-nav .hs-line,
#header-main-nav .hs-char{
  font: inherit;
  line-height: inherit;
  color: currentColor;
  text-transform: inherit;
}
#header-main-nav .hs-wrap{
  display:inline-flex;
  flex-direction:column;
  overflow:hidden;
  vertical-align:middle;
  white-space:nowrap;
  position:relative;
}
#header-main-nav .hs-line{ display:flex; gap: var(--hs-gap, 0); }
#header-main-nav .hs-char{ display:inline-block; will-change:transform; }
#header-main-nav .hs-bottom{ position:absolute; inset:0 auto auto 0; width:100%; }
#header-main-nav :is(> ul > li > .ekit-menu-dropdown-toggle, > ul > li > a){
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  color: inherit;
  text-transform: inherit;
}

.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"]{
  position: sticky;
  top: 0;
  z-index: 9999;
  will-change: transform, opacity;
  transform: translate3d(0,0,0);
  opacity: 1;
  transition: transform 400ms ease, opacity 400ms ease;
}

.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"]:not(.is-hidden){
  transform: translate3d(0,0,0);
  opacity: 1;
}

.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"].is-hidden.dir-down{
  transform: translate3d(16px, -120%, 0);
  opacity: 0; pointer-events: none;
}

.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"].is-hidden.dir-up{
  transform: translate3d(-16px, -120%, 0);
  opacity: 0; pointer-events: none;
}

@media (prefers-reduced-motion: reduce){
  .ekit-template-content-markup.ekit-template-content-header
    .elementor-element[data-id="eaa1bb1"]{
    transition: none !important;
  }
}

.elementskit-navbar-nav > li {
  position: relative !important;
}

@media (min-width: 1025px) {
  .elementskit-navbar-nav-default .elementskit-navbar-nav > li > a,
  .elementskit-navbar-nav-default .elementskit-navbar-nav > li > .ekit-menu-dropdown-toggle,
  .elementskit-navbar-nav > li > a,
  .elementskit-navbar-nav > li > .ekit-menu-dropdown-toggle {
    text-transform: capitalize !important;
  }
}

.elementskit-megamenu-panel {
  left: 50% !important;
  transform: translateX(-50%) !important;
  right: auto !important;
  top: 100% !important;
  margin-top: 0 !important;
  z-index: 10000 !important; /* Assegura que el megamenú estigui per sobre */
}

:root{
  --apli-red:#D3033B;
  --apli-tri:14px;
  --apli-gap:8px;
  --apli-ease:cubic-bezier(.2,.7,.2,1);
}

.eKit-megamenu-container .menu-item,
.ekit-menu-nav .menu-item,
.elementskit-navbar .menu-item,
.elementskit-megamenu-wrapper .menu-item{
  position: relative;
  overflow: visible;
}
.menu-item-has-children > a,
.elementskit-dropdown-has > a,
.elementskit-megamenu-has > a{
  position: relative;
}

.menu-item-has-children > a::after,
.elementskit-dropdown-has > a::after,
.elementskit-megamenu-has > a::after{
  content:"";
  position:absolute;
  left:50%;
  bottom: calc(-1 * var(--apli-gap) - var(--apli-tri));
  width:0; height:0;
  border-left: var(--apli-tri) solid transparent;
  border-right: var(--apli-tri) solid transparent;
  border-top: var(--apli-tri) solid var(--apli-red);
  opacity:0;
  transform: translate(-50%, -8px);
  transition: transform .22s var(--apli-ease), opacity .18s var(--apli-ease);
  pointer-events:none;
  z-index:10001;
}

/* NOMÉS amb clic / element actiu */
.elementskit-navbar-nav > li.elementskit-dropdown-has > a::after,
.elementskit-navbar-nav > li.elementskit-megamenu-has > a::after {
  /* per defecte ja opacity:0 — no cal res aquí */
}

/* Quan el submenú fill té la classe d'obert */
.elementskit-navbar-nav > li > ul.ekit-dropdown-open-onclick ~ .dummy-never,
.elementskit-navbar-nav > li:has(> .ekit-dropdown-open-onclick) > a::after,
.elementskit-navbar-nav > li:has(> [style*="visibility: visible"]) > a::after,
.elementskit-navbar-nav > li.ekit-dropdown-open > a::after,
.elementskit-navbar-nav > li.active > a::after,
.elementskit-navbar-nav > li[aria-expanded="true"] > a::after,
.elementskit-navbar-nav.apl-menu-open > li:has(> .elementskit-dropdown[style*="visible"]) > a::after,
.elementskit-navbar-nav.apl-menu-open > li:has(> .elementskit-megamenu-panel[style*="visible"]) > a::after,
/* Pàgina actual o ancestral (classes natives de WordPress) */
.elementskit-navbar-nav li.current-menu-item > a::after,
.elementskit-navbar-nav li.current-menu-parent > a::after,
.elementskit-navbar-nav li.current-menu-ancestor > a::after,
.elementskit-navbar-nav li.current-page-ancestor > a::after {
  opacity: 1;
  transform: translate(-50%, 0);
}

@media (max-width:1024px){
  .menu-item-has-children > a::after,
  .elementskit-dropdown-has > a::after,
  .elementskit-megamenu-has > a::after{
    display:none;
  }
}

/* --- VIDEO HOVER CARDS --- */
/* --- VIDEO HOVER CARDS (FIX DEFINITIU) --- */

.card-hover{
  position: relative;
  overflow: hidden;
}

/* Contenidor ÚNIC que governa mida i ratio */
.card-hover .media-stack{
  position: relative;
  display: block;
  width: 100%;
  line-height: 0;
  border-radius: inherit;
  overflow: hidden;
  aspect-ratio: 16 / 9; /* ajusta si cal */
}

/* Forcem el widget d’imatge a ocupar tot el contenidor */
.card-hover .media-stack .elementor-widget-image,
.card-hover .media-stack .elementor-widget-image .elementor-widget-container{
  width: 100%;
  height: 100%;
}

/* Imatge */
.card-hover .media-stack .elementor-widget-image img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 1;
}

/* Wrapper del vídeo */
.card-hover .media-stack .preview-wrap{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}

/* Vídeo */
.card-hover .media-stack .preview-video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .25s ease;
}

/* Hover */
.card-hover:hover .media-stack .preview-video{
  opacity: 1;
}

/* Widget HTML (Elementor) */
.card-hover .media-stack .elementor-widget-html{
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
  z-index: 2 !important;
  pointer-events: none;
}

.card-hover .media-stack .elementor-widget-html .elementor-widget-container{
  width: 100%;
  height: 100%;
}


/* BOTÓ TRAPEZOÏDAL — classe posada al WIDGET: .btn-trapezi */
.card-hover .elementor-element.btn-trapezi .elementor-button,
.card-hover .elementor-element.btn-trapezi .elementor-button-link{
  --btn-color:#D3033B;
  --py: 20px;
  --pl: 20px;
  --pr: 36px;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  box-sizing:border-box;
  background:transparent;
  color:var(--btn-color);
  border:0;
  font-weight:600;
  line-height:1.2;
  text-align:center;
  position:relative;
  transition:background-image .25s ease, color .25s ease;

  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 50'%3E%3Cpath d='M1,1 L199,1 L179,49 L1,49 Z' fill='none' stroke='%23D3033B' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
  background-size:100% 100%;
  background-repeat:no-repeat;

  padding: var(--py) var(--pr) var(--py) var(--pl) !important;
}

.card-hover .elementor-element.btn-trapezi .elementor-button-text{
  padding:0 !important;
  display:inline-block;
}

.card-hover .elementor-element.btn-trapezi .elementor-button-icon{
  display:inline-flex;
  align-items:center;
  transition:transform .25s ease;
}
.card-hover .elementor-element.btn-trapezi .elementor-button-icon i,
.card-hover .elementor-element.btn-trapezi .elementor-button-icon svg{
  color:currentColor !important;
  fill:currentColor !important;
  stroke:currentColor !important;
  transition: color .25s ease, fill .25s ease, stroke .25s ease;
}

.card-hover:hover .elementor-element.btn-trapezi .elementor-button,
.card-hover:hover .elementor-element.btn-trapezi .elementor-button-link{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 50'%3E%3Cpath d='M1,1 L199,1 L179,49 L1,49 Z' fill='%23D3033B' stroke='%23D3033B' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
  color:#fff;
}

.card-hover:hover .elementor-element.btn-trapezi .elementor-button-icon{
  transform: translateX(7px);
}

/* =====================================================
   BOTÓ TRAPEZOÏDAL BLANC — stroke blanc
   Hover: fill vermell corporatiu
===================================================== */

.card-hover .elementor-element.btn-trapezi-white .elementor-button,
.card-hover .elementor-element.btn-trapezi-white .elementor-button-link{
  --btn-color:#ffffff;
  --btn-hover:#D3033B;
  --py: 20px;
  --pl: 20px;
  --pr: 36px;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  box-sizing:border-box;

  background:transparent;
  color:var(--btn-color);
  border:0;
  font-weight:600;
  line-height:1.2;
  text-align:center;
  position:relative;

  transition:
    background-image .25s ease,
    color .25s ease;

  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 50'%3E%3Cpath d='M1,1 L199,1 L179,49 L1,49 Z' fill='none' stroke='%23ffffff' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
  background-size:100% 100%;
  background-repeat:no-repeat;

  padding: var(--py) var(--pr) var(--py) var(--pl) !important;
}

/* Text */
.card-hover .elementor-element.btn-trapezi-white .elementor-button-text{
  padding:0 !important;
  display:inline-block;
}

/* Icona */
.card-hover .elementor-element.btn-trapezi-white .elementor-button-icon{
  display:inline-flex;
  align-items:center;

  margin-top: 1.5px;              /* ajust òptic FIX */
  transform: translateX(0) scale(1);
  transform-origin: center;

  transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.card-hover:hover .elementor-element.btn-trapezi-white .elementor-button-icon{
  transform: translateX(7px) scale(1.05);
}


.card-hover .elementor-element.btn-trapezi-white .elementor-button-icon i,
.card-hover .elementor-element.btn-trapezi-white .elementor-button-icon svg{
  color:currentColor !important;
  fill:currentColor !important;
  stroke:currentColor !important;
  transition: color .25s ease, fill .25s ease, stroke .25s ease;
}

/* Hover — FILL VERMELL */
.card-hover:hover .elementor-element.btn-trapezi-white .elementor-button,
.card-hover:hover .elementor-element.btn-trapezi-white .elementor-button-link{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 50'%3E%3Cpath d='M1,1 L199,1 L179,49 L1,49 Z' fill='%23D3033B' stroke='%23D3033B' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
  color:#ffffff;
}

/* Animació icona */
.card-hover:hover .elementor-element.btn-trapezi-white .elementor-button-icon{
  transform: translateX(7px);
}


/* Quan UNA card està hovered → les altres perden protagonisme */
.elementor-container:has(.card-hover:hover) .card-hover,
.e-con:has(.card-hover:hover) .card-hover,
.e-con-inner:has(.card-hover:hover) .card-hover {
  filter: grayscale(100%); 
    opacity: 0.9;
  transform: scale(0.98);
  transition:
    filter .25s ease,
    opacity .25s ease,
    transform .25s ease;
}

/* La card activa */
.elementor-container:has(.card-hover:hover) .card-hover:hover,
.e-con:has(.card-hover:hover) .card-hover:hover,
.e-con-inner:has(.card-hover:hover) .card-hover:hover {
  filter: none;
  opacity: 1;
  transform: scale(1);
  z-index: 5;
}

/* CONTADOR SUBHEADER (encara forma part del tema general, no del header principal) */
.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"]{
  position: sticky;
  top: 0;
  z-index: 9999;
  will-change: transform, opacity;
  transform: translate3d(0,0,0);
  opacity: 1;
  transition: transform 400ms ease, opacity 400ms ease;
}
.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"]:not(.is-hidden){
  transform: translate3d(0,0,0);
  opacity: 1;
}
.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"].is-hidden.dir-down{
  transform: translate3d(16px, -120%, 0);
  opacity: 0; pointer-events: none;
}
.ekit-template-content-markup.ekit-template-content-header
  .elementor-element[data-id="eaa1bb1"].is-hidden.dir-up{
  transform: translate3d(-16px, -120%, 0);
  opacity: 0; pointer-events: none;
}
@media (prefers-reduced-motion: reduce){
  .ekit-template-content-markup.ekit-template-content-header
    .elementor-element[data-id="eaa1bb1"]{
    transition: none !important;
  }
}


/* BTN TRAP */
.btn-trap{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  background: transparent;
  border: 0;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  isolation: isolate;
}

@media (max-width: 768px) {
  .btn-trap{
    white-space: normal;
    width: 100%;
    max-width: 100%;
    text-align: center;
  }

  .btn-trap .elementor-button-text{
    white-space: normal;
    word-break: break-word;
    hyphens: auto;
  }
}


.btn-trap::before{
  content:"";
  position:absolute;
  inset:0;
  background:#D3033B;
  border:2px solid #D3033B;
  transform:skewX(-20deg);
  z-index:-1;
  box-sizing:border-box;
  transition: all .25s ease;
}
.btn-trap:hover,
.btn-trap:focus{
  color:#D3033B; transition: color .2s ease;
}
.btn-trap:hover::before,
.btn-trap:focus::before{
  background:transparent; border:1px solid #D3033B;
}
.btn-trap:hover .elementor-button-text,
.btn-trap:focus .elementor-button-text{ color:#D3033B !important; }
.btn-trap:focus-visible{ outline:2px dashed #D3033B; outline-offset:3px; }

.btn-trap .elementor-button-icon i,
.btn-trap .elementor-button-icon svg{
  transition: color .25s ease, fill .25s ease, stroke .25s ease, transform .25s ease;
  color: #fff; fill: #fff; stroke: #fff;
}
.btn-trap:hover .elementor-button-icon i,
.btn-trap:focus .elementor-button-icon i,
.btn-trap:hover .elementor-button-icon svg,
.btn-trap:focus .elementor-button-icon svg{
  color: #D3033B !important; fill: #D3033B !important; stroke: #D3033B !important;
  transform: translateX(7px);
}

/* --- Botó trap blanc (text i icona vermells de base) --- */
.btn-trap-white{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  background: transparent;
  border: 0;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  isolation: isolate;
  color: #D3033B !important; /* color text base */
}
.btn-trap-white::before{
  content:"";
  position:absolute;
  inset:0;
  background:#F9F9F9;
  border:2px solid #F9F9F9;
  transform:skewX(-20deg);
  z-index:-1;
  box-sizing:border-box;
  transition: all .25s ease;
}

/* Text intern d’Elementor → vermell de base */
.btn-trap-white .elementor-button-text{
  color:#D3033B !important;
  transition: color .25s ease;
}

/* Hover/focus → només contorn i text blanc */
.btn-trap-white:hover,
.btn-trap-white:focus{
  color:#F9F9F9 !important;
}
.btn-trap-white:hover::before,
.btn-trap-white:focus::before{
  background:transparent; 
  border:1px solid #F9F9F9;
}
.btn-trap-white:hover .elementor-button-text,
.btn-trap-white:focus .elementor-button-text{ 
  color:#F9F9F9 !important; 
}

/* Accessibilitat */
.btn-trap-white:focus-visible{ 
  outline:2px dashed #F9F9F9; 
  outline-offset:3px; 
}

/* Icona trap → vermella per defecte */
.btn-trap-white .elementor-button-icon i,
.btn-trap-white .elementor-button-icon svg{
  transition: color .25s ease, fill .25s ease, stroke .25s ease, transform .25s ease;
  color: #D3033B; 
  fill: #D3033B; 
  stroke: #D3033B;
}

/* Icona trap en hover → blanca */
.btn-trap-white:hover .elementor-button-icon i,
.btn-trap-white:focus .elementor-button-icon i,
.btn-trap-white:hover .elementor-button-icon svg,
.btn-trap-white:focus .elementor-button-icon svg{
  color: #F9F9F9 !important; 
  fill: #F9F9F9 !important; 
  stroke: #F9F9F9 !important;
  transform: translateX(7px);
}

/* ===== FIX: btn-trap-white multilinea a mòbil ===== */
@media (max-width: 768px) {
  .btn-trap-white {
    white-space: normal;
    width: 100%;
    max-width: 100%;
    text-align: center;
  }

  .btn-trap-white .elementor-button-text {
    white-space: normal;
    word-break: break-word;
    hyphens: auto;
  }
}

/* ============================================================
   WPML LANGUAGE SWITCHER
============================================================ */
.lang-codes .wpml-ls .wpml-ls-native,
.lang-codes .wpml-ls .wpml-ls-display { 
    display:none !important; 
}

.lang-codes .wpml-ls-item-ca .wpml-ls-link::before {
    content:"";
    display:inline-block;
    width:24px; height:24px;
    margin-right:6px;
    background:url('https://aplitecinformatica.com/wp-content/uploads/2026/02/Lang-switcher.png')
        no-repeat center/contain;
}

.lang-codes .wpml-ls-item-es .wpml-ls-link::before {
    content:"";
    display:inline-block;
    width:24px; height:24px;
    margin-right:6px;
    background:url('https://aplitecinformatica.com/wp-content/uploads/2026/02/Lang-switcher.png')
        no-repeat center/contain;
}
.lang-codes .wpml-ls-item-es .wpml-ls-link::after { content:"ESP"; }
.lang-codes .wpml-ls-item-ca .wpml-ls-link::after { content:"CAT"; }

/* Inline list */
.lang-codes .wpml-ls ul { 
    display:flex; gap:.35rem; align-items:center;
    margin:0; padding:0; list-style:none;
}
.lang-codes .wpml-ls-item + .wpml-ls-item::before { 
    content:"/"; margin:0 .25rem; opacity:.7;
}

/* Text styles */
.lang-codes .wpml-ls-link {
    text-decoration: none;
    color: #D3033B;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
}
.lang-codes .wpml-ls-current .wpml-ls-link { text-decoration:underline; }
.lang-codes .wpml-ls-item:not(.wpml-ls-current) .wpml-ls-link:hover { opacity:.75; }


/* ============================================================
   FAQS (EAEL Accordeon)
============================================================ */
.eael-adv-accordion .eael-accordion-list .eael-accordion-content {
    border: none !important;
}


/* ============================================================
   EMPRESA – TARGETA TRANSLÚCIDA
============================================================ */
.elementor-element-8889582 {
    background: rgba(249,249,249, 0.3)!important;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    position: relative;
    z-index: 2;
    overflow: hidden;
}

.elementor-element-8889582 > * {
    position: relative;
    z-index: 1;
}


/* ============================================================
   EMPRESA – IMATGE FIXA DECORATIVA (no recordo que es)
============================================================ 
.elementor-element-cbd5f4 {
    position: relative;
    z-index: 0;
    background: #F9F9F9;
    overflow: visible;
}

.elementor-element-cbd5f4::after {
    content:"";
    position: fixed;
    right: 6vw;
    top: 22vh;
    width: clamp(280px, 32vw, 520px);
    aspect-ratio: 1 / 1;
    background-image: url("URL-DE-LA-IMATGE");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    z-index: 1;
    pointer-events: none;
    opacity: 1;
}


/* ============================================================
   LOGO 3D
============================================================ */
#threejs-container {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: -1 !important;
}

#threejs-container canvas { 
    pointer-events: none; 
}


/* ============================================================
   POSICIÓ GENERAL DEL CONTINGUT DEL SITE
============================================================ 
.site-content,
.elementor {
    position: relative;
    z-index: 10;
}

*/

/* CONTENIDOR PRINCIPAL */
.cards-anim{
  position: relative;
  overflow: hidden !important;
  contain: paint;
}

/* FILLS */
.cards-anim > .e-con-inner,
.cards-anim > .elementor-container{
  overflow: hidden;
}

/* TARGETES */
.cards-anim .card-col{
  transition: transform 380ms cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}

/* ANIMACIÓ */
.cards-anim:hover .card-col:first-child{
  transform: translateY(50px);
}
.cards-anim:hover .card-col:last-child{
  transform: translateY(-50px);
}

/* ACCESSIBILITAT */
@media (hover:none){
  .cards-anim:hover .card-col{
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce){
  .cards-anim .card-col{
    transition: none;
  }
}


/* FONS CANVI AMB GIF */
.main-hover{ position: relative; }
.bg-image{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: none !important;
  transform: none !important;
}
.main-hover:hover .bg-image{
  background-image: url('https://aplitecinformatica.com/wp-content/uploads/2025/10/gif.gif') !important;
  transition: none !important;
  transform: none !important;
}


/* POSICIONAMENT SEO CARDS */
.escape-viewport{
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.escape-viewport.clip-hard{
  --inset: 0px;
  clip-path: inset(var(--inset));
}
.escape-viewport.clip-soft{
  --fade: 16px;
  -webkit-mask-image:
    radial-gradient(100% 100% at 50% 50%, #000 60%, transparent 100%);
  mask-image:
    linear-gradient( to right, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100% ),
    linear-gradient( to bottom, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100% );
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

.results-list .result-item{
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity .45s ease,
    transform .45s ease,
    background .35s ease,
    box-shadow .35s ease;
  will-change: opacity, transform;
}
.results-list.is-hovering .result-item{
  opacity: 1;
  transform: translateY(0);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.result-item{
  border-radius: 12px;
  padding: 14px 20px;
}
.result-item:hover{
  background: #fafafa;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  transform: translateY(-2px);
}
.result-item h3{
  position: relative;
  display: inline-block;
  transition: color .35s ease;
}
.result-item h3::after{
  content:"";
  position:absolute; left:0; bottom:-3px;
  width:0; height:2px; background:#1a73e8;
  transition: width .35s ease;
}
.result-item:hover h3{ color:#1a73e8; }
.result-item:hover h3::after{ width:100%; }

.result-item .result-domain,
.result-item .result-desc{
  opacity:.75; transition: opacity .35s ease;
}
.results-list.is-hovering .result-item .result-domain{ transition-delay: calc(var(--i,0)*90ms + 60ms); }
.results-list.is-hovering .result-item h3           { transition-delay: calc(var(--i,0)*90ms + 90ms); }
.results-list.is-hovering .result-item .result-desc { transition-delay: calc(var(--i,0)*90ms + 120ms); opacity:1; }


/* Fletxes hover? */
.mega-link .submenu-arrow .elementor-icon,
.mega-link .submenu-arrow .elementor-icon > *,
.mega-link .submenu-arrow i,
.mega-link .submenu-arrow svg {
  display: inline-block;
  transition: transform 180ms ease;
  will-change: transform;
}
.mega-link:hover .submenu-arrow .elementor-icon,
.mega-link:focus-within .submenu-arrow .elementor-icon,
.mega-link.is-active .submenu-arrow .elementor-icon {
  transform: translateX(6px);
}
.mega-link { -webkit-tap-highlight-color: transparent; }

@media (prefers-reduced-motion: reduce) {
  .mega-link .submenu-arrow .elementor-icon,
  .mega-link .submenu-arrow .elementor-icon > *,
  .mega-link .submenu-arrow i,
  .mega-link .submenu-arrow svg {
    transition: none;
  }
}

.elementor-widget-icon i,
.elementor-widget-icon svg {
    transform: none !important;
    transition: none !important;
}

.arrow-move i,
.arrow-move svg {
    transition: transform .3s ease;
}
.sector-item:hover .arrow-move i,
.sector-item:hover .arrow-move svg {
    transform: translateX(6px);
}

a { text-decoration: none !important; }

.sector-box:hover * {
    color: #F9F9F9 !important;
    fill:  #F9F9F9 !important;
}

/* ---------------------------------------------------
   FORÇAR OVERFLOW VISIBLE A TOT EL HEADER I MENU
----------------------------------------------------
.ekit-template-content-markup.ekit-template-content-header,
.elementor-location-header,
.elementor-section,
.elementor-container,
.elementskit-navbar,
.elementskit-menu-container,
.ekit-nav-menu,
.elementskit-navbar-nav,
.elementskit-navbar-nav > li,
.elementskit-menu-hamburger-menu,
.ekit-menu-nav {
    overflow: visible !important;
}


/* ---------------------------------------------------
   MEGAMENÚ - POSICIONAMENT I MIDA
---------------------------------------------------- */
.elementskit-navbar-nav .elementskit-submenu-panel.elementskit-dropdown {
    position: absolute !important;
    right: auto !important;
    top: calc(100% + 25px) !important;

    width: fit-content !important;
    max-width: 95vw !important;
    min-width: unset !important;

    padding: 50px 70px !important;
    box-sizing: border-box !important;
    z-index: 9999 !important;
    overflow: visible !important;
}

/* CENTRAR EL MEGAMENU RESPECTE AL BOTÓ PARE */
.elementskit-navbar-nav > li.menu-item-has-children {
    position: relative !important;
}

/* === FIX: Centrar megamenú a la pantalla, no al botó === */
.elementskit-navbar-nav > li.menu-item-has-children > .elementskit-submenu-panel {
    position: fixed !important;
    left: 50vw !important;
    transform: translateX(-50%) !important;
    top: calc(100% + 25px) !important;

    max-width: 100vw !important;
    width: max-content !important;

    overflow-x: hidden !important;
    padding: 50px 70px !important;
    box-sizing: border-box !important;
    z-index: 99999 !important;
}


/* ---------------------------------------------------
   CONTENIDOR PARE SEMPRE VISIBLE
---------------------------------------------------- */
.elementskit-navbar-nav > .menu-item-has-children,
.elementskit-navbar-nav > .elementskit-dropdown-has,
.elementskit-navbar-nav > .elementskit-megamenu-has {
    position: static !important;
    overflow: visible !important;
}

/* RESPONSIVE - adaptar a pantalles petites */
@media (max-width: 1500px) {
    ul.elementskit-submenu-panel.elementskit-dropdown[style],
    ul.elementskit-dropdown.elementskit-submenu-panel[style] {
        max-width: 90vw !important;
        min-width: 800px !important;
        padding: 45px 60px !important;
        left: 5vw !important;
        transform: none !important;
    }
}

@media (max-width: 1200px) {
    ul.elementskit-submenu-panel.elementskit-dropdown[style],
    ul.elementskit-dropdown.elementskit-submenu-panel[style] {
        max-width: 92vw !important;
        min-width: 700px !important;
        padding: 40px 50px !important;
        left: 4vw !important;
    }
}

@media (max-width: 992px) {
    ul.elementskit-submenu-panel.elementskit-dropdown[style],
    ul.elementskit-dropdown.elementskit-submenu-panel[style] {
        max-width: 94vw !important;
        min-width: auto !important;
        width: 94vw !important;
        left: 3vw !important;
        padding: 35px 40px !important;
    }
}

@media (max-width: 768px) {
    ul.elementskit-submenu-panel.elementskit-dropdown[style],
    ul.elementskit-dropdown.elementskit-submenu-panel[style] {
        max-width: 96vw !important;
        width: 96vw !important;
        left: 2vw !important;
        padding: 30px 25px !important;
        margin-top: 40px !important;
    }
}


/* ---------------------------------------------------
   LAYOUT INTERIOR - FLEXBOX
---------------------------------------------------- */

.mega-custom {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
    gap: 20px !important;
    font-family: "Eudoxus Sans", sans-serif !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.mega-custom .mega-col {
    flex: 0 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    align-self: flex-start !important;
}

/* Subcolumnes TPV per comerç */
.mega-custom .subcols {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px 15px !important;
    width: 100% !important;
}

.mega-custom .subcol {
    display: flex !important;
    flex-direction: column !important;
    gap: 0px !important;
}


/* ---------------------------------------------------
   TÍTOLS (DIV AMB CLASSE .mega-title)
---------------------------------------------------- */
.mega-custom .mega-title,
.mega-custom .mega-col > div:first-child {
    /* Tipografia */
    font-family: "Eudoxus Sans", sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #060000 !important;
    line-height: 1.2 !important;
    
    /* Spacing - RESET ABSOLUT */
    margin: 0 !important;
    margin-bottom: 28px !important;
    padding: 0 !important;
    
    /* Display */
    display: block !important;
    white-space: nowrap !important;
    
    /* Posicionament */
    position: relative !important;
    top: 0 !important;
}

.mega-custom a.mega-title[href*="calaixos"] {
  margin-top: 28px !important;
}
/* ---------------------------------------------------
   ENLLAÇOS
---------------------------------------------------- */
.mega-custom a {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 15px 20px !important;
    margin: 0 !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    color: #6C6C6C !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: color 0.25s ease !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.mega-custom a:hover {
    color: #060000 !important;
    background: #F2F2F2 !important;
}

/* Icones */
.mega-custom a .icon {
    width: 22px !important;
    height: 22px !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    display: block !important;
}

/* Text */
.mega-custom a .text {
    flex: 1 !important;
    display: block !important;
}

/* Fletxa amb animació */
.mega-custom a .arrow {
    opacity: 0.3 !important;
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
                opacity 0.35s ease !important;
    flex-shrink: 0 !important;
    font-size: 16px !important;
    display: inline-block !important;
    will-change: transform !important;
}

.mega-custom a:hover .arrow {
    transform: translateX(8px) !important;
    opacity: 0.7 !important;
}

/* ---------------------------------------------------
   RESPONSIVE GAPS
---------------------------------------------------- */
@media (max-width: 1400px) {
    .mega-custom {
        gap: 60px !important;
    }
}

@media (max-width: 1200px) {
    .mega-custom {
        gap: 50px !important;
    }
}

@media (max-width: 992px) {
    .mega-custom {
        flex-direction: column !important;
        gap: 35px !important;
    }
}

@media (max-width: 768px) {
    .mega-custom {
        gap: 30px !important;
    }
    
    .mega-custom .mega-title,
    .mega-custom h4 {
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }
    
    .mega-custom a {
        font-size: 15px !important;
        padding: 9px 0 !important;
    }
}


/* ======================================================
   WPForms – ESTIL GLOBAL
====================================================== */

/* ===== 1. RESET DELS CAMPS ===== */
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="number"],
.wpforms-field input[type="url"],
.wpforms-field textarea,
.wpforms-field select {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid #6C6C6C !important;
    padding: 12px !important;
    color: #000 !important;
    width: 100%;
    box-sizing: border-box;
}

/* Placeholder */
.wpforms-field input::placeholder,
.wpforms-field textarea::placeholder {
    color: #666 !important;
}

/* Focus */
.wpforms-field input:focus,
.wpforms-field textarea:focus {
    outline: none !important;
    border-color: #D3033B !important;
}

/* ===== 2. CONTENIDORS ===== */
.wpforms-field {
    margin-bottom: 20px !important;
}

/* ===== 3. CENTRAR EL BOTÓ ===== */
.wpforms-submit-container {
    text-align: center !important;
}

/* ======================================================
   BOTÓ TRAP WPForms — MÉS AMPLE ALS COSTATS
====================================================== */

.wpforms-form button.wpforms-submit {
    cursor: pointer !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 12px 60px !important;
    min-height: 42px !important;
    box-sizing: border-box !important;
    position: relative;
    z-index: 0;

    color: #fff !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    white-space: nowrap;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    line-height: 1.2;
    isolation: isolate;
}

/* Desktop: padding més ample */
@media (min-width: 1025px) {
    .wpforms-form button.wpforms-submit {
        padding: 12px 300px !important;
    }
}

/* Tablet: padding moderat */
@media (min-width: 769px) and (max-width: 1024px) {
    .wpforms-form button.wpforms-submit {
        padding: 12px 100px !important;
    }
}

/* Mòbil: padding reduït */
@media (max-width: 768px) {
    .wpforms-form button.wpforms-submit {
        padding: 12px 40px !important;
        font-size: 0.9rem !important;
    }
}

/* Pseudo-fons TRAP */
.wpforms-form button.wpforms-submit::before {
    content: "";
    position: absolute;
    inset: 0;

    background: #D3033B;
    border: 2px solid #D3033B;
    transform: skewX(-20deg);
    z-index: -1;
    pointer-events: none;
    transition: all .25s ease;
}

/* Hover */
.wpforms-form button.wpforms-submit:hover,
.wpforms-form button.wpforms-submit:focus {
    color: #D3033B !important;
}

.wpforms-form button.wpforms-submit:hover::before,
.wpforms-form button.wpforms-submit:focus::before {
    background: transparent;
    border: 1px solid #D3033B;
}

/* Focus accessible */
.wpforms-form button.wpforms-submit:focus-visible {
    outline: 2px dashed #D3033B !important;
    outline-offset: 3px !important;
}


/* HERO com a context */
.scroll-hero {
  position: relative;
  min-height: 300vh;
}
.scroll-canvas-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 1;
}
#scroll-canvas {
  width: 100%;
  height: 100%;
  display: block;
}
.hero-overlay{
  position: fixed;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  z-index: 10;
  animation: heroFadeUp 600ms cubic-bezier(.22,.61,.36,1) both;
}
@keyframes heroFadeUp{
  from{
    opacity: 0;
    transform: translateY(calc(-50% + 20px));
  }
  to{
    opacity: 1;
    transform: translateY(-50%);
  }
}

/* =====================================================
   BOTÓ TRAPEZOÏDAL INVERTIT
===================================================== */

.btn-trapezi-inv{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  isolation: isolate;
}

/* Base */
.btn-trapezi-inv .elementor-button,
.btn-trapezi-inv .elementor-button-link{
  --btn-color:#D3033B;        /* text base */
  --btn-border:#ffffff;      /* stroke hover */
  --py:20px;
  --pl:36px;                 /* padding gran a l'esquerra */
  --pr:20px;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  background:#ffffff;
  color:var(--btn-color);
  border:0;
  font-weight:600;
  line-height:1.2;
  text-align:center;
  position:relative;

  padding: var(--py) var(--pr) var(--py) var(--pl) !important;

  transition:
    background-image .25s ease,
    color .25s ease;
}

/* SVG TRAPEZI — diagonal invertida */
.btn-trapezi-inv .elementor-button::before,
.btn-trapezi-inv .elementor-button-link::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;

  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 50'%3E%3Cpath d='M21,1 L199,1 L199,49 L1,49 Z' fill='%23ffffff' stroke='%23ffffff' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
  background-size:100% 100%;
  background-repeat:no-repeat;

  transition: background-image .25s ease;
}

/* TEXT */
.btn-trapezi-inv .elementor-button-text{
  padding:0 !important;
  color:#D3033B !important;
  transition: color .25s ease;
}

/* ICONA */
.btn-trapezi-inv .elementor-button-icon{
  display:inline-flex;
  align-items:center;
  transition:transform .25s ease;
}

.btn-trapezi-inv .elementor-button-icon i,
.btn-trapezi-inv .elementor-button-icon svg{
  color:#D3033B !important;
  fill:#D3033B !important;
  stroke:#D3033B !important;
  transition: color .25s ease, fill .25s ease, stroke .25s ease;
}

/* =========================
   HOVER
========================= */

.btn-trapezi-inv:hover .elementor-button,
.btn-trapezi-inv:hover .elementor-button-link{
  color:#ffffff;
}

.btn-trapezi-inv:hover .elementor-button::before,
.btn-trapezi-inv:hover .elementor-button-link::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 50'%3E%3Cpath d='M21,1 L199,1 L199,49 L1,49 Z' fill='none' stroke='%23ffffff' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
}

.btn-trapezi-inv:hover .elementor-button-text{
  color:#ffffff !important;
}

.btn-trapezi-inv:hover .elementor-button-icon{
  transform: translateX(-7px); /* cap a l'esquerra */
}

.btn-trapezi-inv:hover .elementor-button-icon i,
.btn-trapezi-inv:hover .elementor-button-icon svg{
  color:#ffffff !important;
  fill:#ffffff !important;
  stroke:#ffffff !important;
}

.scroll-down-200 {
  cursor: pointer;
}

/* grey icon */
.icona-gris i,
.icona-gris svg,
.icona-gris svg path {
  color: #d8d8d8 !important;
  fill: #d8d8d8 !important;
}

/* Si l'icona està dins d'un contenidor */
.icona-gris .elementor-icon i,
.icona-gris .elementor-icon svg,
.icona-gris .elementor-icon svg path {
  color: #d8d8d8 !important;
  fill: #d8d8d8 !important;
}

/* =====================================================
   FIX CRÍTIC: BLOQUEJA CLICS A TRAVÉS DEL HEADER
===================================================== */
@media (min-width: 1025px) {
  
  .ekit-template-content-markup.ekit-template-content-header {
    pointer-events: auto !important;
  }
  
  .ekit-template-content-markup.ekit-template-content-header * {
    pointer-events: auto !important;
  }
  
  .elementskit-navbar-nav a,
  .elementskit-navbar-nav button,
  .elementskit-menu-toggle,
  .ekit-menu-nav a,
  .elementor-button,
  .elementor-button-link {
    pointer-events: auto !important;
  }
  
  .elementskit-megamenu-panel,
  .elementskit-megamenu-panel *,
  .elementskit-submenu-panel,
  .elementskit-submenu-panel * {
    pointer-events: auto !important;
  }
}

/* =====================================================
   MEGA HOLDER - Eliminar el link del pare
===================================================== */
.mega-holder > a.mega-holder.dropdown-item {
    display: none !important;
    pointer-events: none !important;
}

.mega-custom .mega-title {
    pointer-events: none !important;
    cursor: default !important;
}

/* =====================================================
   OCULTAR EL LINK INVISIBLE DEL MEGA-HOLDER
===================================================== */
.mega-custom > a.dropdown-item,
.mega-custom .mega-col > a.dropdown-item:not(.mega-title),
a.mega-holder.dropdown-item {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
}


/* =====================================================
 LIGHTBOX
===================================================== */
.elementor-lightbox,
.dialog-type-lightbox,
.elementor-lightbox-slideshow {
    z-index: 999999 !important;
}
.elementor-slideshow__title,
.elementor-slideshow__description,
.elementor-lightbox .dialog-lightbox-description,
.elementor-lightbox .elementor-slideshow__description {
    display: none !important;
}
.dialog-widget.dialog-type-lightbox {
    z-index: 999999 !important;
    position: fixed !important;
}
.elementor-lightbox-image {
    box-shadow: none !important;
    border-radius: 0 !important;
}


/* videocard home */
@media (max-width: 768px) {
  .preview-wrap,
  .elementor-element-3e3b627,
  .elementor-element-8f18100,
  .elementor-element-4706c24,
  .elementor-element-5252d5d,
  .elementor-element-c206a01 {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}
