/* ==========================================================
   WMP METALLIC ELEMENTOR EFFECTS
   Version 1.0.8

   IMPORTANT:
   - Fondos metálicos SOLO para:
     wmp-section-color
     wmp-container-color
     wmp-column-color

   - Los demás widgets NO pintan fondo de bloque.
     Heading = letras
     Text = letras
     Icon = icono nitido sin difuminado
     Icon Box = icono + título
     Gallery/Video/Map = bordes
     Counter = números
     Menu = links
     Button = botón como elemento propio

   - Para combinar fondo + widget:
     wmp-iconbox-cff103 wmp-container-cff103
     wmp-heading-cff103 wmp-container-black
   ========================================================== */

:root {
  --wmp-metal-speed: 5.5s;
  --wmp-metal-solid: #cff103;
  --wmp-metal-shadow: rgba(207, 241, 3, 0.45);
  --wmp-metal-gradient: linear-gradient(135deg, #263000, #6f8700, #cff103, #f5ff8a, #cff103, #90aa00, #263000);
  --wmp-metal-light: linear-gradient(105deg, transparent 0%, rgba(255,255,255,0) 30%, rgba(255,255,255,.88) 50%, rgba(255,255,255,0) 70%, transparent 100%);
}

@keyframes wmpMetalSweep {
  0% { background-position: -180% 0%, 0% 50%, 100% 50%; }
  50% { background-position: 180% 0%, 100% 50%, 0% 50%; }
  100% { background-position: -180% 0%, 0% 50%, 100% 50%; }
}

@keyframes wmpMetalTextSweep {
  0% { background-position: -180% 0%, 0% 50%; }
  50% { background-position: 180% 0%, 100% 50%; }
  100% { background-position: -180% 0%, 0% 50%; }
}

/* ==========================================================
   COLOR SYSTEM
   ========================================================== */

[class*="wmp-"][class*="-black"] {
  --wmp-metal-solid: #050505;
  --wmp-metal-shadow: rgba(0,0,0,.55);
  --wmp-metal-gradient: linear-gradient(135deg, #000000, #1a1a1a, #5b5b5b, #111111, #000000);
}

[class*="wmp-"][class*="-dark-gray"] {
  --wmp-metal-solid: #3b3b3b;
  --wmp-metal-shadow: rgba(80,80,80,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #111111, #2b2b2b, #727272, #242424, #090909);
}

[class*="wmp-"][class*="-silver"] {
  --wmp-metal-solid: #c7c7c7;
  --wmp-metal-shadow: rgba(210,210,210,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #777777, #f1f1f1, #9d9d9d, #ffffff, #6b6b6b);
}

[class*="wmp-"][class*="-white"] {
  --wmp-metal-solid: #ffffff;
  --wmp-metal-shadow: rgba(255,255,255,.55);
  --wmp-metal-gradient: linear-gradient(135deg, #ffffff, #e5e5e5, #ffffff, #bfbfbf, #f9f9f9);
}

[class*="wmp-"][class*="-gold"] {
  --wmp-metal-solid: #d4af37;
  --wmp-metal-shadow: rgba(212,175,55,.5);
  --wmp-metal-gradient: linear-gradient(135deg, #5f4300, #d4af37, #fff1a8, #b88716, #3d2800);
}

[class*="wmp-"][class*="-copper"] {
  --wmp-metal-solid: #b56a28;
  --wmp-metal-shadow: rgba(181,106,40,.5);
  --wmp-metal-gradient: linear-gradient(135deg, #4b1e05, #b56a28, #ffc58a, #8a3d0d, #2a1002);
}

[class*="wmp-"][class*="-red"] {
  --wmp-metal-solid: #ff3636;
  --wmp-metal-shadow: rgba(255,54,54,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #320000, #8b0000, #ff3636, #7a0000, #1a0000);
}

[class*="wmp-"][class*="-wine"] {
  --wmp-metal-solid: #8b1233;
  --wmp-metal-shadow: rgba(139,18,51,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #1b0008, #520018, #8b1233, #3b0012, #120004);
}

[class*="wmp-"][class*="-royal-blue"] {
  --wmp-metal-solid: #2d61ff;
  --wmp-metal-shadow: rgba(45,97,255,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #000b33, #002bff, #5fb7ff, #001a9e, #00051f);
}

[class*="wmp-"][class*="-blue"]:not([class*="-royal-blue"]) {
  --wmp-metal-solid: #26a8ff;
  --wmp-metal-shadow: rgba(38,168,255,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #00142e, #004a99, #26a8ff, #003c7a, #000b1c);
}

[class*="wmp-"][class*="-cyan"] {
  --wmp-metal-solid: #00c8e8;
  --wmp-metal-shadow: rgba(0,200,232,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #002b35, #00a6c8, #b7f6ff, #007c96, #00191f);
}

[class*="wmp-"][class*="-green"] {
  --wmp-metal-solid: #58ff96;
  --wmp-metal-shadow: rgba(88,255,150,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #001f0c, #047a2f, #58ff96, #026325, #001406);
}

[class*="wmp-"][class*="-emerald"] {
  --wmp-metal-solid: #7affdf;
  --wmp-metal-shadow: rgba(122,255,223,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #00241c, #008f72, #7affdf, #00604d, #00130f);
}

[class*="wmp-"][class*="-lime"],
[class*="wmp-"][class*="-cff103"] {
  --wmp-metal-solid: #cff103;
  --wmp-metal-shadow: rgba(207,241,3,.55);
  --wmp-metal-gradient: linear-gradient(135deg, #263000, #6f8700, #cff103, #f5ff8a, #cff103, #90aa00, #263000);
}

[class*="wmp-"][class*="-purple"] {
  --wmp-metal-solid: #c95cff;
  --wmp-metal-shadow: rgba(201,92,255,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #170021, #5a007e, #c95cff, #3b0054, #0b0010);
}

[class*="wmp-"][class*="-orange"] {
  --wmp-metal-solid: #ff8a2a;
  --wmp-metal-shadow: rgba(255,138,42,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #361100, #c94f00, #ffb066, #953300, #1f0900);
}

[class*="wmp-"][class*="-yellow"] {
  --wmp-metal-solid: #f2c900;
  --wmp-metal-shadow: rgba(242,201,0,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #5a4a00, #f2c900, #fff7a8, #c99d00, #2b2300);
}

[class*="wmp-"][class*="-pink"] {
  --wmp-metal-solid: #ff9ec8;
  --wmp-metal-shadow: rgba(255,158,200,.45);
  --wmp-metal-gradient: linear-gradient(135deg, #3b001f, #c2185b, #ff9ec8, #8e0d43, #1b000e);
}

/* ==========================================================
   SPEED
   ========================================================== */

.wmp-slow,
.wmp-metal-slow { --wmp-metal-speed: 9s; }

.wmp-normal,
.wmp-metal-normal { --wmp-metal-speed: 5.5s; }

.wmp-fast,
.wmp-metal-fast { --wmp-metal-speed: 3.2s; }

/* ==========================================================
   ONLY THESE CLASSES CREATE METALLIC BACKGROUND
   SOLO ESTAS CLASES CREAN FONDO METALICO
   ========================================================== */

[class*="wmp-section-"],
[class*="wmp-container-"],
[class*="wmp-column-"] {
  background-image:
    var(--wmp-metal-light),
    var(--wmp-metal-gradient),
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), transparent 36%) !important;
  background-size: 55% 100%, 300% 300%, 220% 220% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite;
}

/* ==========================================================
   HEADING - letras
   ========================================================== */

[class*="wmp-heading-"] .elementor-heading-title {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 14px var(--wmp-metal-shadow);
}

/* ==========================================================
   TEXT EDITOR - letras
   ========================================================== */

[class*="wmp-text-"] .elementor-widget-container,
[class*="wmp-text-"] .elementor-widget-container p,
[class*="wmp-text-"] .elementor-widget-container span,
[class*="wmp-text-"] .elementor-widget-container strong,
[class*="wmp-text-"] .elementor-widget-container em,
[class*="wmp-text-"] .elementor-widget-container li,
[class*="wmp-text-"] .elementor-widget-container a {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 10px var(--wmp-metal-shadow);
}

/* ==========================================================
   BUTTON - botón como elemento principal
   ========================================================== */

[class*="wmp-button-"] .elementor-button {
  background-image:
    var(--wmp-metal-light),
    var(--wmp-metal-gradient),
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), transparent 36%) !important;
  background-size: 55% 100%, 300% 300%, 220% 220% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite;
  border: 1px solid rgba(255,255,255,.25);
  box-shadow: 0 10px 28px var(--wmp-metal-shadow);
  transition: .3s ease;
}

[class*="wmp-button-"] .elementor-button:hover {
  filter: brightness(1.12) contrast(1.08);
  transform: translateY(-1px);
}

/* Button outline alternativo: no pinta fondo, solo borde/texto */
[class*="wmp-button-outline-"] .elementor-button {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid) !important;
  color: var(--wmp-metal-solid) !important;
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

/* ==========================================================
   ICON - icono nítido, sin difuminado
   ========================================================== */

[class*="wmp-icon-"] .elementor-icon {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  transition: .3s ease;
}

/* Icon fonts: Font Awesome / Elementor Icons */
[class*="wmp-icon-"] .elementor-icon i,
[class*="wmp-icon-"] .elementor-icon .fas,
[class*="wmp-icon-"] .elementor-icon .far,
[class*="wmp-icon-"] .elementor-icon .fab,
[class*="wmp-icon-"] .elementor-icon .eicon {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 45% 100%, 260% 260%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: none !important;
}

/* SVG icons: color sólido metálico para evitar blur */
[class*="wmp-icon-"] .elementor-icon svg,
[class*="wmp-icon-"] .elementor-icon svg path,
[class*="wmp-icon-"] .elementor-icon svg circle,
[class*="wmp-icon-"] .elementor-icon svg rect,
[class*="wmp-icon-"] .elementor-icon svg polygon,
[class*="wmp-icon-"] .elementor-icon svg line,
[class*="wmp-icon-"] .elementor-icon svg polyline {
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  color: var(--wmp-metal-solid) !important;
  filter: none !important;
}

[class*="wmp-icon-"] .elementor-icon:hover {
  transform: scale(1.06);
  filter: none !important;
}

/* Clase opcional si alguna vez quieres brillo suave en iconos */
[class*="wmp-icon-"].wmp-icon-soft-glow .elementor-icon i,
[class*="wmp-icon-"].wmp-icon-soft-glow .elementor-icon svg {
  text-shadow: 0 0 4px var(--wmp-metal-shadow) !important;
  filter: drop-shadow(0 0 3px var(--wmp-metal-shadow)) !important;
}

/* ==========================================================
   ICON BOX - icono + título, SIN fondo
   Iconos nítidos, sin difuminado
   ========================================================== */

[class*="wmp-iconbox-"] .elementor-icon-box-wrapper {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Icon fonts dentro del Icon Box */
[class*="wmp-iconbox-"] .elementor-icon i,
[class*="wmp-iconbox-"] .elementor-icon .fas,
[class*="wmp-iconbox-"] .elementor-icon .far,
[class*="wmp-iconbox-"] .elementor-icon .fab,
[class*="wmp-iconbox-"] .elementor-icon .eicon {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 45% 100%, 260% 260%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: none !important;
}

/* SVG dentro del Icon Box */
[class*="wmp-iconbox-"] .elementor-icon svg,
[class*="wmp-iconbox-"] .elementor-icon svg path,
[class*="wmp-iconbox-"] .elementor-icon svg circle,
[class*="wmp-iconbox-"] .elementor-icon svg rect,
[class*="wmp-iconbox-"] .elementor-icon svg polygon,
[class*="wmp-iconbox-"] .elementor-icon svg line,
[class*="wmp-iconbox-"] .elementor-icon svg polyline {
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  color: var(--wmp-metal-solid) !important;
  filter: none !important;
}

/* Título del Icon Box */
[class*="wmp-iconbox-"] .elementor-icon-box-title,
[class*="wmp-iconbox-"] .elementor-icon-box-title a {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 45% 100%, 260% 260%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: none !important;
}

[class*="wmp-iconbox-"] .elementor-icon {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}

[class*="wmp-iconbox-"] .elementor-icon:hover {
  transform: scale(1.06);
  filter: none !important;
}

/* Brillo suave opcional, solo si lo agregas manualmente */
[class*="wmp-iconbox-"].wmp-icon-soft-glow .elementor-icon i,
[class*="wmp-iconbox-"].wmp-icon-soft-glow .elementor-icon svg {
  text-shadow: 0 0 4px var(--wmp-metal-shadow) !important;
  filter: drop-shadow(0 0 3px var(--wmp-metal-shadow)) !important;
}

/* ==========================================================
   IMAGE BOX - título + borde de imagen, SIN fondo
   ========================================================== */

[class*="wmp-imagebox-"] .elementor-image-box-wrapper {
  background: transparent !important;
  box-shadow: none !important;
}

[class*="wmp-imagebox-"] .elementor-image-box-title {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 12px var(--wmp-metal-shadow);
}

[class*="wmp-imagebox-"] img {
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

/* ==========================================================
   CARD / BOX - SIN fondo, solo borde metálico
   Para fondo usa wmp-container-color en el mismo elemento
   ========================================================== */

[class*="wmp-card-"] {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 22px var(--wmp-metal-shadow);
  border-radius: inherit;
}

/* ==========================================================
   CTA - título + botón, SIN fondo de card
   ========================================================== */

[class*="wmp-cta-"] .elementor-cta {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 22px var(--wmp-metal-shadow);
}

[class*="wmp-cta-"] .elementor-cta__title {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

/* ==========================================================
   FORM - bordes + botón, SIN fondo de formulario
   ========================================================== */

[class*="wmp-form-"] input,
[class*="wmp-form-"] textarea,
[class*="wmp-form-"] select,
[class*="wmp-form-"] .elementor-field {
  background: transparent;
  border: 1px solid var(--wmp-metal-solid) !important;
  box-shadow: 0 0 14px var(--wmp-metal-shadow);
}

[class*="wmp-form-"] .elementor-button,
[class*="wmp-form-"] button[type="submit"] {
  background-image:
    var(--wmp-metal-light),
    var(--wmp-metal-gradient),
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), transparent 36%) !important;
  background-size: 55% 100%, 300% 300%, 220% 220% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite;
  box-shadow: 0 10px 28px var(--wmp-metal-shadow);
}

/* ==========================================================
   TABS - texto/borde, SIN fondo
   ========================================================== */

[class*="wmp-tabs-"] .elementor-tab-title,
[class*="wmp-tabs-"] .elementor-tab-title a {
  background: transparent !important;
  color: var(--wmp-metal-solid) !important;
  text-shadow: 0 0 10px var(--wmp-metal-shadow);
}

[class*="wmp-tabs-"] .elementor-tab-title.elementor-active,
[class*="wmp-tabs-"] .elementor-tab-content {
  border-color: var(--wmp-metal-solid) !important;
  box-shadow: 0 0 12px var(--wmp-metal-shadow);
}

/* ==========================================================
   ACCORDION / TOGGLE - texto/borde, SIN fondo
   ========================================================== */

[class*="wmp-accordion-"] .elementor-tab-title,
[class*="wmp-toggle-"] .elementor-tab-title {
  background: transparent !important;
  color: var(--wmp-metal-solid) !important;
  text-shadow: 0 0 10px var(--wmp-metal-shadow);
}

[class*="wmp-accordion-"] .elementor-accordion-item,
[class*="wmp-toggle-"] .elementor-toggle-item {
  border-color: var(--wmp-metal-solid) !important;
  box-shadow: 0 0 14px var(--wmp-metal-shadow);
}

/* ==========================================================
   MENU - links
   ========================================================== */

[class*="wmp-menu-"] .elementor-nav-menu a,
[class*="wmp-menu-"] .menu-item a {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 10px var(--wmp-metal-shadow);
}

[class*="wmp-menu-"] .elementor-menu-toggle {
  background: transparent !important;
  border: 1px solid var(--wmp-metal-solid);
  color: var(--wmp-metal-solid);
  box-shadow: 0 0 14px var(--wmp-metal-shadow);
}

/* ==========================================================
   SLIDER / CAROUSEL - flechas/dots/borde, SIN fondo de slide
   ========================================================== */

[class*="wmp-slider-"] .swiper-slide,
[class*="wmp-slider-"] .elementor-swiper,
[class*="wmp-slider-"] .elementor-main-swiper {
  background: transparent !important;
}

[class*="wmp-slider-"] .elementor-swiper-button,
[class*="wmp-slider-"] .swiper-button-prev,
[class*="wmp-slider-"] .swiper-button-next,
[class*="wmp-slider-"] .swiper-pagination-bullet {
  color: var(--wmp-metal-solid) !important;
  border-color: var(--wmp-metal-solid) !important;
  box-shadow: 0 0 12px var(--wmp-metal-shadow);
}

/* ==========================================================
   GALLERY - borde, SIN fondo
   ========================================================== */

[class*="wmp-gallery-"] .elementor-gallery-item,
[class*="wmp-gallery-"] .gallery-item,
[class*="wmp-gallery-"] .e-gallery-item {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

/* ==========================================================
   TESTIMONIAL - texto/nombre/borde, SIN fondo de card
   ========================================================== */

[class*="wmp-testimonial-"] .elementor-testimonial,
[class*="wmp-testimonial-"] .elementor-testimonial-wrapper,
[class*="wmp-testimonial-"] .elementor-testimonial__content {
  background: transparent !important;
  border-color: var(--wmp-metal-solid) !important;
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

[class*="wmp-testimonial-"] .elementor-testimonial__name {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

/* ==========================================================
   COUNTER - números
   ========================================================== */

[class*="wmp-counter-"] .elementor-counter-number,
[class*="wmp-counter-"] .elementor-counter-number-prefix,
[class*="wmp-counter-"] .elementor-counter-number-suffix {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 14px var(--wmp-metal-shadow);
}

/* ==========================================================
   PROGRESS BAR - barra
   ========================================================== */

[class*="wmp-progress-"] .elementor-progress-bar {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient) !important;
  background-size: 55% 100%, 300% 300% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite;
}

[class*="wmp-progress-"] .elementor-progress-wrapper {
  background: transparent;
  border: 1px solid var(--wmp-metal-solid);
  box-shadow: 0 0 14px var(--wmp-metal-shadow);
}

/* ==========================================================
   POSTS / BLOG / PORTFOLIO - borde + títulos, SIN fondo
   ========================================================== */

[class*="wmp-post-"] .elementor-post,
[class*="wmp-post-"] article,
[class*="wmp-post-"] .elementor-portfolio-item {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

[class*="wmp-post-"] .elementor-post__title,
[class*="wmp-post-"] .elementor-post__title a,
[class*="wmp-post-"] .entry-title,
[class*="wmp-post-"] .entry-title a {
  color: var(--wmp-metal-solid) !important;
  text-shadow: 0 0 10px var(--wmp-metal-shadow);
}

/* ==========================================================
   PRICE TABLE / PRICE LIST - precio + borde, SIN fondo
   ========================================================== */

[class*="wmp-price-"] .elementor-price-table,
[class*="wmp-price-"] .elementor-price-list,
[class*="wmp-price-"] .elementor-price-list-item {
  background: transparent !important;
  border-color: var(--wmp-metal-solid) !important;
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

[class*="wmp-price-"] .elementor-price-table__price {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

/* ==========================================================
   FLIP BOX - títulos/iconos/borde, SIN forzar fondo
   ========================================================== */

[class*="wmp-flipbox-"] .elementor-flip-box__front,
[class*="wmp-flipbox-"] .elementor-flip-box__back {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

[class*="wmp-flipbox-"] .elementor-flip-box__layer__title,
[class*="wmp-flipbox-"] .elementor-flip-box__layer__description {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

/* ==========================================================
   SEARCH - input borde + submit
   ========================================================== */

[class*="wmp-search-"] .elementor-search-form__input {
  background: transparent !important;
  border: 1px solid var(--wmp-metal-solid) !important;
  box-shadow: 0 0 14px var(--wmp-metal-shadow);
}

[class*="wmp-search-"] .elementor-search-form__submit {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient) !important;
  background-size: 55% 100%, 300% 300% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite;
}

/* ==========================================================
   SOCIAL ICONS - iconos, SIN fondo
   ========================================================== */

[class*="wmp-social-"] .elementor-social-icon {
  background: transparent !important;
  border: 1px solid var(--wmp-metal-solid);
  box-shadow: 0 0 12px var(--wmp-metal-shadow);
}

[class*="wmp-social-"] .elementor-social-icon i,
[class*="wmp-social-"] .elementor-social-icon svg,
[class*="wmp-social-"] .elementor-social-icon svg path {
  color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  filter: drop-shadow(0 0 8px var(--wmp-metal-shadow));
}

/* ==========================================================
   VIDEO / MAP - marco, SIN fondo
   ========================================================== */

[class*="wmp-video-"] .elementor-wrapper,
[class*="wmp-video-"] iframe,
[class*="wmp-video-"] video,
[class*="wmp-map-"] iframe,
[class*="wmp-map-"] .elementor-custom-embed {
  background: transparent !important;
  border: 3px solid var(--wmp-metal-solid);
  box-shadow: 0 0 25px var(--wmp-metal-shadow);
}

/* ==========================================================
   POPUP - borde, SIN fondo
   Para fondo usa una sección/container dentro del popup
   ========================================================== */

[class*="wmp-popup-"],
[class*="wmp-popup-"] .dialog-widget-content,
[class*="wmp-popup-"] .elementor-popup-modal .dialog-widget-content {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 25px var(--wmp-metal-shadow);
}

/* ==========================================================
   WOOCOMMERCE / PRODUCT - bordes/precio/botones, SIN fondo
   ========================================================== */

[class*="wmp-product-"] .product,
[class*="wmp-product-"] .woocommerce ul.products li.product,
[class*="wmp-product-"] .woocommerce div.product {
  background: transparent !important;
  border: 2px solid var(--wmp-metal-solid);
  box-shadow: 0 0 18px var(--wmp-metal-shadow);
}

[class*="wmp-product-"] .price,
[class*="wmp-product-"] .woocommerce-Price-amount {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient);
  background-size: 55% 100%, 300% 300%;
  background-repeat: no-repeat;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

[class*="wmp-product-"] .button,
[class*="wmp-product-"] .single_add_to_cart_button {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient) !important;
  background-size: 55% 100%, 300% 300% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite;
}

/* ==========================================================
   HOVER GENERAL - sin forzar fondos
   ========================================================== */

[class*="wmp-card-"]:hover,
[class*="wmp-cta-"] .elementor-cta:hover,
[class*="wmp-imagebox-"] img:hover,
[class*="wmp-post-"] article:hover,
[class*="wmp-product-"] .product:hover {
  filter: brightness(1.08) contrast(1.04);
  transform: translateY(-2px);
  transition: .3s ease;
}


/* ==========================================================
   SHARP ICON FIX - Version 1.0.8
   Evita difuminado en iconos, icon box y social icons.
   ========================================================== */

[class*="wmp-icon-"] .elementor-icon,
[class*="wmp-iconbox-"] .elementor-icon,
[class*="wmp-social-"] .elementor-social-icon {
  filter: none !important;
  box-shadow: none !important;
}

[class*="wmp-icon-"] .elementor-icon i,
[class*="wmp-iconbox-"] .elementor-icon i,
[class*="wmp-social-"] .elementor-social-icon i,
[class*="wmp-icon-"] .elementor-icon svg,
[class*="wmp-iconbox-"] .elementor-icon svg,
[class*="wmp-social-"] .elementor-social-icon svg {
  text-shadow: none !important;
  filter: none !important;
}


/* ==========================================================
   ICON VISIBILITY FIX - Version 1.0.8
   El icono nunca queda oculto.
   - Color solido visible como fallback.
   - Degradado + haz de luz para icon fonts compatibles.
   - SVG usa color solido metalico para no desaparecer.
   ========================================================== */

/* Reset seguro para iconos */
[class*="wmp-icon-"] .elementor-icon,
[class*="wmp-iconbox-"] .elementor-icon,
[class*="wmp-social-"] .elementor-social-icon {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  overflow: visible !important;
}

/* Icon fonts visibles por defecto */
[class*="wmp-icon-"] .elementor-icon i,
[class*="wmp-icon-"] .elementor-icon .fas,
[class*="wmp-icon-"] .elementor-icon .far,
[class*="wmp-icon-"] .elementor-icon .fab,
[class*="wmp-icon-"] .elementor-icon .eicon,
[class*="wmp-iconbox-"] .elementor-icon i,
[class*="wmp-iconbox-"] .elementor-icon .fas,
[class*="wmp-iconbox-"] .elementor-icon .far,
[class*="wmp-iconbox-"] .elementor-icon .fab,
[class*="wmp-iconbox-"] .elementor-icon .eicon {
  display: inline-block !important;
  line-height: 1 !important;
  color: var(--wmp-metal-solid) !important;
  -webkit-text-fill-color: var(--wmp-metal-solid) !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Degradado + haz de luz solo para icon fonts compatibles */
@supports (-webkit-background-clip: text) {
  [class*="wmp-icon-"] .elementor-icon i,
  [class*="wmp-icon-"] .elementor-icon .fas,
  [class*="wmp-icon-"] .elementor-icon .far,
  [class*="wmp-icon-"] .elementor-icon .fab,
  [class*="wmp-icon-"] .elementor-icon .eicon,
  [class*="wmp-iconbox-"] .elementor-icon i,
  [class*="wmp-iconbox-"] .elementor-icon .fas,
  [class*="wmp-iconbox-"] .elementor-icon .far,
  [class*="wmp-iconbox-"] .elementor-icon .fab,
  [class*="wmp-iconbox-"] .elementor-icon .eicon {
    background-image: var(--wmp-metal-light), var(--wmp-metal-gradient) !important;
    background-size: 55% 100%, 300% 300% !important;
    background-repeat: no-repeat !important;
    animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
  }
}

/* SVG icons: color solido visible, sin esconderse */
[class*="wmp-icon-"] .elementor-icon svg,
[class*="wmp-iconbox-"] .elementor-icon svg,
[class*="wmp-social-"] .elementor-social-icon svg {
  display: inline-block !important;
  overflow: visible !important;
  color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  filter: none !important;
}

[class*="wmp-icon-"] .elementor-icon svg *,
[class*="wmp-iconbox-"] .elementor-icon svg *,
[class*="wmp-social-"] .elementor-social-icon svg * {
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  color: var(--wmp-metal-solid) !important;
  filter: none !important;
}

/* Social icons visibles */
[class*="wmp-social-"] .elementor-social-icon i,
[class*="wmp-social-"] .elementor-social-icon .fab,
[class*="wmp-social-"] .elementor-social-icon .fas {
  color: var(--wmp-metal-solid) !important;
  -webkit-text-fill-color: var(--wmp-metal-solid) !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Clase extra para forzar icono solido sin degradado */
.wmp-icon-solid [class*="elementor-icon"] i,
.wmp-icon-solid [class*="elementor-icon"] svg,
.wmp-icon-solid [class*="elementor-icon"] svg * {
  background: none !important;
  animation: none !important;
  color: var(--wmp-metal-solid) !important;
  -webkit-text-fill-color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
}

/* Brillo suave opcional */
.wmp-icon-soft-glow .elementor-icon,
.wmp-icon-soft-glow .elementor-social-icon {
  filter: drop-shadow(0 0 4px var(--wmp-metal-shadow)) !important;
}

/* ==========================================================
   ICON DEFINITIVE FIX - Version 1.0.8
   Corrige iconos desaparecidos en Elementor / Font Awesome.

   Fondo sigue siendo EXCLUSIVO para:
   wmp-section-color
   wmp-container-color
   wmp-column-color

   Iconos:
   - Color solido visible como base.
   - Degradado + haz de luz aplicado al ::before real del icono.
   - SVG queda solido visible para no desaparecer.
   ========================================================== */

/* Base visible para Icon, Icon Box y Social Icons */
[class*="wmp-icon-"] .elementor-icon,
[class*="wmp-iconbox-"] .elementor-icon,
[class*="wmp-social-"] .elementor-social-icon {
  background: transparent !important;
  color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
}

/* El elemento i SIEMPRE visible como fallback */
[class*="wmp-icon-"] .elementor-icon i,
[class*="wmp-icon-"] .elementor-icon .fas,
[class*="wmp-icon-"] .elementor-icon .far,
[class*="wmp-icon-"] .elementor-icon .fab,
[class*="wmp-icon-"] .elementor-icon .eicon,
[class*="wmp-iconbox-"] .elementor-icon i,
[class*="wmp-iconbox-"] .elementor-icon .fas,
[class*="wmp-iconbox-"] .elementor-icon .far,
[class*="wmp-iconbox-"] .elementor-icon .fab,
[class*="wmp-iconbox-"] .elementor-icon .eicon,
[class*="wmp-social-"] .elementor-social-icon i,
[class*="wmp-social-"] .elementor-social-icon .fas,
[class*="wmp-social-"] .elementor-social-icon .far,
[class*="wmp-social-"] .elementor-social-icon .fab {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: var(--wmp-metal-solid) !important;
  -webkit-text-fill-color: var(--wmp-metal-solid) !important;
  background: none !important;
  text-shadow: none !important;
  filter: none !important;
  line-height: 1 !important;
}

/* Degradado aplicado al pseudo-elemento real del icono */
[class*="wmp-icon-"] .elementor-icon i::before,
[class*="wmp-icon-"] .elementor-icon .fas::before,
[class*="wmp-icon-"] .elementor-icon .far::before,
[class*="wmp-icon-"] .elementor-icon .fab::before,
[class*="wmp-icon-"] .elementor-icon .eicon::before,
[class*="wmp-iconbox-"] .elementor-icon i::before,
[class*="wmp-iconbox-"] .elementor-icon .fas::before,
[class*="wmp-iconbox-"] .elementor-icon .far::before,
[class*="wmp-iconbox-"] .elementor-icon .fab::before,
[class*="wmp-iconbox-"] .elementor-icon .eicon::before {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient) !important;
  background-size: 55% 100%, 300% 300% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Social icons: color solido visible, sin esconderse */
[class*="wmp-social-"] .elementor-social-icon i::before,
[class*="wmp-social-"] .elementor-social-icon .fas::before,
[class*="wmp-social-"] .elementor-social-icon .far::before,
[class*="wmp-social-"] .elementor-social-icon .fab::before {
  color: var(--wmp-metal-solid) !important;
  -webkit-text-fill-color: var(--wmp-metal-solid) !important;
  text-shadow: none !important;
  filter: none !important;
}

/* SVG: mantener visible. No se usa background-clip para evitar que desaparezca */
[class*="wmp-icon-"] .elementor-icon svg,
[class*="wmp-iconbox-"] .elementor-icon svg,
[class*="wmp-social-"] .elementor-social-icon svg {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  filter: none !important;
  overflow: visible !important;
}

[class*="wmp-icon-"] .elementor-icon svg *,
[class*="wmp-iconbox-"] .elementor-icon svg *,
[class*="wmp-social-"] .elementor-social-icon svg * {
  color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
  filter: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Icon Box sigue SIN fondo */
[class*="wmp-iconbox-"] .elementor-icon-box-wrapper {
  background: transparent !important;
  box-shadow: none !important;
}

/* Título Icon Box visible con degradado */
[class*="wmp-iconbox-"] .elementor-icon-box-title,
[class*="wmp-iconbox-"] .elementor-icon-box-title a {
  background-image: var(--wmp-metal-light), var(--wmp-metal-gradient) !important;
  background-size: 55% 100%, 300% 300% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalTextSweep var(--wmp-metal-speed) linear infinite !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Clase opcional: fuerza iconos completamente solidos */
.wmp-icon-solid .elementor-icon i,
.wmp-icon-solid .elementor-icon i::before,
.wmp-icon-solid .elementor-icon .fas,
.wmp-icon-solid .elementor-icon .fas::before,
.wmp-icon-solid .elementor-icon .far,
.wmp-icon-solid .elementor-icon .far::before,
.wmp-icon-solid .elementor-icon .fab,
.wmp-icon-solid .elementor-icon .fab::before,
.wmp-icon-solid .elementor-icon .eicon,
.wmp-icon-solid .elementor-icon .eicon::before,
.wmp-icon-solid .elementor-icon svg,
.wmp-icon-solid .elementor-icon svg *,
.wmp-icon-solid .elementor-social-icon i,
.wmp-icon-solid .elementor-social-icon i::before,
.wmp-icon-solid .elementor-social-icon svg,
.wmp-icon-solid .elementor-social-icon svg * {
  background: none !important;
  animation: none !important;
  color: var(--wmp-metal-solid) !important;
  -webkit-text-fill-color: var(--wmp-metal-solid) !important;
  fill: var(--wmp-metal-solid) !important;
  stroke: var(--wmp-metal-solid) !important;
}

/* Clase opcional: brillo suave, sin blur fuerte */
.wmp-icon-soft-glow .elementor-icon,
.wmp-icon-soft-glow .elementor-social-icon {
  filter: drop-shadow(0 0 3px var(--wmp-metal-shadow)) !important;
}


/* ==========================================================
   BACKGROUND COLOR INDEPENDENT FIX - Version 1.0.8
   Soluciona conflicto cuando se combinan clases:
   wmp-iconbox-cff103 wmp-container-black

   Ahora:
   - wmp-iconbox-cff103 controla icono/titulo.
   - wmp-container-black controla SOLO el fondo.
   - wmp-section-color / wmp-container-color / wmp-column-color
     tienen su propio color independiente.
   ========================================================== */

:root {
  --wmp-bg-gradient: linear-gradient(135deg, #263000, #6f8700, #cff103, #f5ff8a, #cff103, #90aa00, #263000);
  --wmp-bg-shadow: rgba(207,241,3,.35);
}

/* Background colors independientes */
.wmp-section-black,
.wmp-container-black,
.wmp-column-black {
  --wmp-bg-gradient: linear-gradient(135deg, #000000, #1a1a1a, #5b5b5b, #111111, #000000);
  --wmp-bg-shadow: rgba(0,0,0,.45);
}

.wmp-section-dark-gray,
.wmp-container-dark-gray,
.wmp-column-dark-gray {
  --wmp-bg-gradient: linear-gradient(135deg, #111111, #2b2b2b, #727272, #242424, #090909);
  --wmp-bg-shadow: rgba(80,80,80,.35);
}

.wmp-section-silver,
.wmp-container-silver,
.wmp-column-silver {
  --wmp-bg-gradient: linear-gradient(135deg, #777777, #f1f1f1, #9d9d9d, #ffffff, #6b6b6b);
  --wmp-bg-shadow: rgba(210,210,210,.35);
}

.wmp-section-white,
.wmp-container-white,
.wmp-column-white {
  --wmp-bg-gradient: linear-gradient(135deg, #ffffff, #e5e5e5, #ffffff, #bfbfbf, #f9f9f9);
  --wmp-bg-shadow: rgba(255,255,255,.35);
}

.wmp-section-gold,
.wmp-container-gold,
.wmp-column-gold {
  --wmp-bg-gradient: linear-gradient(135deg, #5f4300, #d4af37, #fff1a8, #b88716, #3d2800);
  --wmp-bg-shadow: rgba(212,175,55,.35);
}

.wmp-section-copper,
.wmp-container-copper,
.wmp-column-copper {
  --wmp-bg-gradient: linear-gradient(135deg, #4b1e05, #b56a28, #ffc58a, #8a3d0d, #2a1002);
  --wmp-bg-shadow: rgba(181,106,40,.35);
}

.wmp-section-red,
.wmp-container-red,
.wmp-column-red {
  --wmp-bg-gradient: linear-gradient(135deg, #320000, #8b0000, #ff3636, #7a0000, #1a0000);
  --wmp-bg-shadow: rgba(255,54,54,.35);
}

.wmp-section-wine,
.wmp-container-wine,
.wmp-column-wine {
  --wmp-bg-gradient: linear-gradient(135deg, #1b0008, #520018, #8b1233, #3b0012, #120004);
  --wmp-bg-shadow: rgba(139,18,51,.35);
}

.wmp-section-blue,
.wmp-container-blue,
.wmp-column-blue {
  --wmp-bg-gradient: linear-gradient(135deg, #00142e, #004a99, #26a8ff, #003c7a, #000b1c);
  --wmp-bg-shadow: rgba(38,168,255,.35);
}

.wmp-section-royal-blue,
.wmp-container-royal-blue,
.wmp-column-royal-blue {
  --wmp-bg-gradient: linear-gradient(135deg, #000b33, #002bff, #5fb7ff, #001a9e, #00051f);
  --wmp-bg-shadow: rgba(45,97,255,.35);
}

.wmp-section-cyan,
.wmp-container-cyan,
.wmp-column-cyan {
  --wmp-bg-gradient: linear-gradient(135deg, #002b35, #00a6c8, #b7f6ff, #007c96, #00191f);
  --wmp-bg-shadow: rgba(0,200,232,.35);
}

.wmp-section-green,
.wmp-container-green,
.wmp-column-green {
  --wmp-bg-gradient: linear-gradient(135deg, #001f0c, #047a2f, #58ff96, #026325, #001406);
  --wmp-bg-shadow: rgba(88,255,150,.35);
}

.wmp-section-emerald,
.wmp-container-emerald,
.wmp-column-emerald {
  --wmp-bg-gradient: linear-gradient(135deg, #00241c, #008f72, #7affdf, #00604d, #00130f);
  --wmp-bg-shadow: rgba(122,255,223,.35);
}

.wmp-section-lime,
.wmp-container-lime,
.wmp-column-lime,
.wmp-section-cff103,
.wmp-container-cff103,
.wmp-column-cff103 {
  --wmp-bg-gradient: linear-gradient(135deg, #263000, #6f8700, #cff103, #f5ff8a, #cff103, #90aa00, #263000);
  --wmp-bg-shadow: rgba(207,241,3,.35);
}

.wmp-section-purple,
.wmp-container-purple,
.wmp-column-purple {
  --wmp-bg-gradient: linear-gradient(135deg, #170021, #5a007e, #c95cff, #3b0054, #0b0010);
  --wmp-bg-shadow: rgba(201,92,255,.35);
}

.wmp-section-orange,
.wmp-container-orange,
.wmp-column-orange {
  --wmp-bg-gradient: linear-gradient(135deg, #361100, #c94f00, #ffb066, #953300, #1f0900);
  --wmp-bg-shadow: rgba(255,138,42,.35);
}

.wmp-section-yellow,
.wmp-container-yellow,
.wmp-column-yellow {
  --wmp-bg-gradient: linear-gradient(135deg, #5a4a00, #f2c900, #fff7a8, #c99d00, #2b2300);
  --wmp-bg-shadow: rgba(242,201,0,.35);
}

.wmp-section-pink,
.wmp-container-pink,
.wmp-column-pink {
  --wmp-bg-gradient: linear-gradient(135deg, #3b001f, #c2185b, #ff9ec8, #8e0d43, #1b000e);
  --wmp-bg-shadow: rgba(255,158,200,.35);
}

/* Fondo usando variable independiente.
   Esto pisa el fondo anterior para que el contenedor use SU color,
   no el color del widget.
*/
[class*="wmp-section-"],
[class*="wmp-container-"],
[class*="wmp-column-"] {
  background-image:
    var(--wmp-metal-light),
    var(--wmp-bg-gradient),
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), transparent 36%) !important;
  background-size: 55% 100%, 300% 300%, 220% 220% !important;
  background-repeat: no-repeat !important;
  animation: wmpMetalSweep var(--wmp-metal-speed) linear infinite !important;
}

/* Sombra independiente opcional para elementos con fondo */
[class*="wmp-section-"].wmp-bg-shadow,
[class*="wmp-container-"].wmp-bg-shadow,
[class*="wmp-column-"].wmp-bg-shadow {
  box-shadow: 0 0 24px var(--wmp-bg-shadow) !important;
}