/*!
 * Weekbe Design — estilos de marca y efectos para Elementor
 * Paleta: lavanda #B2A3E7 · menta #75FBB9 · rosa #F0A1C8 · carbón #13161C · niebla #F7F7F7
 * Tipografía: Poppins
 */
:root{
  --wb-lavanda:#b2a3e7; --wb-lavanda-40:#e0daf5; --wb-lavanda-60:#d1c8f1;
  --wb-menta:#75fbb9;   --wb-menta-40:#c8fde3;   --wb-menta-80:#91fcc7;
  --wb-rosa:#f0a1c8;    --wb-rosa-40:#f9d9e9;
  --wb-carbon:#13161c;  --wb-carbon-80:#424549;  --wb-gris:#5a5d63; --wb-gris-claro:#717377;
  --wb-niebla:#f7f7f7;  --wb-linea:#dedfe1;
}
body{-webkit-font-smoothing:antialiased;}
.wb-mute{color:var(--wb-gris-claro);}

/* ---------- Header translúcido y fijo ---------- */
#masthead{position:sticky;top:0;z-index:999;}
.wb-header{background:rgba(255,255,255,.82)!important;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(19,22,28,.08);}
.wb-header .elementor-heading-title a{transition:color .2s ease;}
.wb-header .elementor-heading-title a:hover{color:var(--wb-gris)!important;}
.admin-bar #masthead{top:32px;}
@media (max-width:782px){.admin-bar #masthead{top:46px;}}

/* ---------- Fondo interactivo (añade la clase wb-hero-fx a un contenedor) ---------- */
.wb-hero-fx{position:relative;overflow:hidden;}
.wb-hero-fx > .e-con-inner,
.wb-hero-fx > .elementor-element{position:relative;z-index:1;}
.wb-fx-layer{position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;z-index:0;overflow:hidden;}
.wb-fx-petal{position:absolute;border-radius:999px;filter:blur(90px);will-change:transform;}
.wb-fx-petal.p1{width:540px;height:540px;left:4%;top:10px;background:var(--wb-lavanda);opacity:.55;}
.wb-fx-petal.p2{width:450px;height:450px;right:4%;top:70px;background:var(--wb-menta);opacity:.45;}
.wb-fx-petal.p3{width:390px;height:390px;left:38%;top:300px;background:var(--wb-rosa);opacity:.45;}
.wb-fx-grid{position:absolute;inset:0;background-image:radial-gradient(rgba(19,22,28,.28) 1.1px,transparent 1.6px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(circle 300px at var(--mx,50%) var(--my,240px),#000 0%,rgba(0,0,0,.35) 45%,transparent 100%);
          mask-image:radial-gradient(circle 300px at var(--mx,50%) var(--my,240px),#000 0%,rgba(0,0,0,.35) 45%,transparent 100%);}
.wb-hero-fx.wb-fx-dark .wb-fx-grid{background-image:radial-gradient(rgba(247,247,247,.3) 1.1px,transparent 1.6px);}
.wb-hero-fx.wb-fx-dark .wb-fx-petal{opacity:.28;}
@media (max-width:767px){.wb-fx-petal.p1{width:340px;height:340px;}.wb-fx-petal.p2{width:300px;height:300px;}.wb-fx-petal.p3{width:260px;height:260px;}}

/* ---------- Carrusel infinito (clase wb-marquee; wb-marquee-reverse para invertir) ---------- */
.wb-marquee{overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.wb-marquee.is-running > .e-con-inner,
.wb-marquee.is-running{flex-wrap:nowrap!important;}
.wb-mq-track{display:flex;width:max-content;animation:wb-marquee var(--wb-mq-speed,34s) linear infinite;}
.wb-marquee-reverse .wb-mq-track{animation-direction:reverse;}
.wb-marquee:hover .wb-mq-track{animation-play-state:paused;}
.wb-mq-group{display:flex;align-items:center;flex-shrink:0;gap:var(--wb-mq-gap,56px);padding-right:var(--wb-mq-gap,56px);}
.wb-mq-group > .elementor-element{flex:0 0 auto!important;width:auto!important;max-width:none!important;}
.wb-mq-group .elementor-heading-title{white-space:nowrap;}
@keyframes wb-marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.wb-mq-track{animation:none;}}

/* ---------- Video con botón de pausa (clase wb-video en el contenedor del video) ---------- */
.wb-video{position:relative;overflow:hidden;}
.wb-video .elementor-wrapper,.wb-video video{display:block;}
.wb-video video{width:100%;height:100%;object-fit:cover;}
.wb-vbtn{position:absolute;right:20px;bottom:20px;z-index:5;width:44px;height:44px;border-radius:999px;border:0;cursor:pointer;
  background:rgba(247,247,247,.18);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:0;}
.wb-vbtn svg{width:16px;height:16px;fill:#f7f7f7;}
.wb-vbtn:focus-visible{outline:2px solid var(--wb-menta);outline-offset:2px;}

/* ---------- Etiquetas (chips) dentro de un Editor de texto ---------- */
.wb-chips{display:flex;flex-wrap:wrap;gap:6px;}
.wb-chips p{display:flex;flex-wrap:wrap;gap:6px;margin:0;}
.wb-chip{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:500;line-height:1.2;color:var(--wb-carbon)!important;text-decoration:none!important;background:var(--wb-lavanda-40);transition:box-shadow .15s ease;}
.wb-chip.menta{background:var(--wb-menta-40);} .wb-chip.rosa{background:var(--wb-rosa-40);} .wb-chip.blanco{background:#fff;} .wb-chip.verde{background:var(--wb-menta);}
a.wb-chip:hover{box-shadow:inset 0 0 0 1.5px var(--wb-carbon);}

/* ---------- Tarjetas con enlace ---------- */
.wb-card-hover{transition:border-color .2s ease,transform .2s ease;border:1.5px solid transparent;}
.wb-card-hover:hover{border-color:var(--wb-carbon);transform:translateY(-2px);}

/* ---------- Círculo numerado / ícono ---------- */
.wb-num .elementor-heading-title{width:44px;height:44px;border-radius:999px;background:var(--wb-menta);display:flex;align-items:center;justify-content:center;}

/* ---------- Resaltado de texto ---------- */
.wb-hl{background:var(--wb-lavanda-60);border-radius:12px;padding:0 10px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.wb-hl.menta{background:var(--wb-menta-40);}

/* ---------- Preguntas frecuentes (Acordeón con clase wb-faq) ---------- */
.wb-faq .elementor-accordion-item{border:0!important;border-bottom:1px solid var(--wb-linea)!important;}
.wb-faq .elementor-accordion-item:first-child{border-top:1px solid var(--wb-linea)!important;}
.wb-faq .elementor-tab-title{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;gap:24px;padding:24px 0!important;}
.wb-faq .elementor-tab-title a{color:var(--wb-carbon)!important;}
.wb-faq .elementor-tab-content{border:0!important;padding:0 0 26px!important;}

/* ---------- Filtros del portafolio (botones con clase wb-filter y enlace #categoria) ---------- */
.wb-filter .elementor-button{transition:background .2s ease,color .2s ease;}
.wb-filter.is-active .elementor-button{background:var(--wb-carbon)!important;color:#f7f7f7!important;border-color:var(--wb-carbon)!important;}
.wb-case.wb-hidden{display:none!important;}

/* ---------- Tablas ---------- */
.wb-table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5;}
.wb-table th,.wb-table td{padding:18px 24px;text-align:left;vertical-align:top;border-bottom:1px solid var(--wb-linea);}
.wb-table tr:last-child td,.wb-table tr:last-child th{border-bottom:0;}
.wb-table-wrap{overflow-x:auto;border-radius:28px;background:#fff;}
.wb-table-wrap.gris{background:var(--wb-niebla);}

/* ---------- Footer ---------- */
.wb-footer a{color:var(--wb-gris);text-decoration:none;}
.wb-footer a:hover{color:var(--wb-carbon);text-decoration:underline;}

/* ---------- Enlaces dentro de textos (migas de pan, notas) ---------- */
.elementor-widget-text-editor a{color:inherit;}

/* ---------- Conexión con los Colores globales de Elementor ----------
   Si cambias un color en Sitio > Colores globales, también cambian los efectos y estilos del plugin. */
body{
  --wb-lavanda:var(--e-global-color-wblavanda,#b2a3e7); --wb-lavanda-40:var(--e-global-color-wblav40,#e0daf5); --wb-lavanda-60:var(--e-global-color-wblav60,#d1c8f1);
  --wb-menta:var(--e-global-color-wbmenta,#75fbb9); --wb-menta-40:var(--e-global-color-wbmenta40,#c8fde3); --wb-menta-80:var(--e-global-color-wbmenta80,#91fcc7);
  --wb-rosa:var(--e-global-color-wbrosa,#f0a1c8); --wb-rosa-40:var(--e-global-color-wbrosa40,#f9d9e9);
  --wb-carbon:var(--e-global-color-wbcarbon,#13161c); --wb-carbon-80:var(--e-global-color-wbcarbon80,#424549);
  --wb-gris:var(--e-global-color-wbgris,#5a5d63); --wb-gris-claro:var(--e-global-color-wbgris2,#717377);
  --wb-niebla:var(--e-global-color-wbniebla,#f7f7f7); --wb-linea:var(--e-global-color-wblinea,#dedfe1);
}
.wb-ink{color:var(--wb-carbon);}
.wb-meta{font-size:13px;color:var(--wb-gris);}
.wb-th-rosa{background:var(--wb-rosa-40);} .wb-th-menta{background:var(--wb-menta-40);} .wb-th-lav{background:var(--wb-lavanda-40);}
.wb-th-dark{background:var(--wb-carbon);color:var(--wb-niebla);}
.wb-td-mute{color:var(--wb-gris);}

/* ---------- Menú en celular (hamburguesa automática para el contenedor .wb-nav del header) ---------- */
.wb-burger{display:none;width:44px;height:44px;border:0;border-radius:999px;background:transparent;cursor:pointer;padding:0;align-items:center;justify-content:center;color:var(--wb-carbon);}
.wb-burger:focus-visible{outline:2px solid var(--wb-carbon);outline-offset:2px;}
.wb-burger span{position:relative;display:block;width:20px;height:2px;border-radius:2px;background:currentColor;transition:background .2s ease;}
.wb-burger span::before,.wb-burger span::after{content:"";position:absolute;left:0;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .25s ease;}
.wb-burger span::before{top:-6px;} .wb-burger span::after{top:6px;}
.wb-nav-open .wb-burger span{background:transparent;}
.wb-nav-open .wb-burger span::before{transform:translateY(6px) rotate(45deg);}
.wb-nav-open .wb-burger span::after{transform:translateY(-6px) rotate(-45deg);}
@media (max-width:900px){
  .wb-header{position:relative;}
  .wb-burger{display:inline-flex;order:3;}
  .wb-header .wb-nav{display:none!important;}
  .wb-header.wb-nav-open .wb-nav{display:flex!important;position:absolute;left:0;right:0;top:100%;z-index:50;flex-direction:column!important;align-items:stretch!important;gap:0!important;
    padding:8px 20px 20px!important;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(19,22,28,.08);box-shadow:0 24px 40px -24px rgba(19,22,28,.25);}
  .wb-header.wb-nav-open .wb-nav > .elementor-element{width:100%!important;}
  .wb-header.wb-nav-open .wb-nav .elementor-heading-title{font-size:18px!important;}
  .wb-header.wb-nav-open .wb-nav .elementor-heading-title a{display:block;padding:14px 0;border-bottom:1px solid var(--wb-linea);}
}
@media (max-width:900px){
  .wb-nav-bar{justify-content:flex-start!important;gap:8px!important;position:static!important;}
  .wb-header > .e-con-inner{position:static!important;}
  .wb-nav-bar > .elementor-widget-image{margin-right:auto;}
}