
/* WorkLane 2.18 - Fondo global para todo el sitio */
:root{
  --wlbg-page:#f7f4ff;
  --wlbg-lilac:rgba(96,57,192,.10);
  --wlbg-turquoise:rgba(24,166,177,.10);
  --wlbg-coral:rgba(255,108,76,.09);
  --wlbg-gold:rgba(244,188,67,.08);
  --wlbg-line:rgba(74,39,132,.08);
}
html{background:var(--wlbg-page)}
body{
  background-color:var(--wlbg-page)!important;
  background-image:
    radial-gradient(circle at 12% 10%, rgba(101,71,196,.16) 0 22px, rgba(101,71,196,.08) 22px 78px, transparent 79px),
    radial-gradient(circle at 86% 14%, rgba(19,163,175,.15) 0 28px, rgba(19,163,175,.07) 28px 96px, transparent 97px),
    radial-gradient(circle at 18% 78%, rgba(255,110,72,.11) 0 16px, rgba(255,110,72,.06) 16px 88px, transparent 89px),
    radial-gradient(circle at 86% 82%, rgba(247,197,76,.10) 0 18px, rgba(247,197,76,.06) 18px 108px, transparent 109px),
    linear-gradient(144deg, transparent 0 41%, rgba(18,168,181,.08) 41% 45%, transparent 45% 100%),
    linear-gradient(28deg, transparent 0 69%, rgba(101,71,196,.08) 69% 73%, transparent 73% 100%),
    linear-gradient(90deg, rgba(255,255,255,.55), rgba(255,255,255,.55));
  background-attachment: fixed!important;
  background-repeat:no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, repeat!important;
  background-size:220px 220px, 280px 280px, 260px 260px, 320px 320px, 100% 100%, 100% 100%, auto!important;
  color:#23324a;
}
/* Líneas y puntos decorativos suaves */
body::before,
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
}
body::before{
  background:
    radial-gradient(circle at 15% 26%, rgba(255,255,255,.65) 0 2px, transparent 3px) 0 0/46px 46px,
    radial-gradient(circle at 70% 65%, rgba(255,255,255,.55) 0 2px, transparent 3px) 0 0/52px 52px,
    linear-gradient(120deg, transparent 0 24%, rgba(74,39,132,.06) 24% 24.6%, transparent 24.6%),
    linear-gradient(150deg, transparent 0 76%, rgba(18,168,181,.06) 76% 76.5%, transparent 76.5%);
  opacity:.95;
}
body::after{
  background:
    radial-gradient(1000px 300px at -10% 52%, rgba(95,195,212,.16), transparent 55%),
    radial-gradient(900px 240px at 105% 26%, rgba(96,57,192,.10), transparent 55%),
    radial-gradient(700px 240px at 50% 100%, rgba(255,108,76,.08), transparent 60%);
  opacity:.9;
}
/* Elevar el contenido sobre el fondo */
body .site,
body #page,
body .site-content,
body .ast-site-identity,
body .site-primary-container,
body .content-area,
body main,
body #content{
  position:relative;
  z-index:1;
}
/* Transparencia suave en contenedores generales de Astra / WordPress */
body .site,
body #page,
body #content{
  background:transparent!important;
}
body .ast-container,
body .entry-content,
body .page-content,
body .site-content > .ast-container,
body .comments-area,
body .widget-area,
body .wp-block-group,
body .ast-archive-description,
body .archive main,
body .single main,
body .page main{
  position:relative;
  z-index:1;
}
/* tarjetas, artículos y contenedores blancos para legibilidad */
body article,
body .post,
body .page .entry-content > .wp-block-group,
body .archive .ast-article-post,
body .search .ast-article-post,
body .widget,
body .comment-respond,
body .comments-area,
body .ast-separate-container #primary,
body .ast-separate-container .ast-article-single,
body .ast-separate-container .ast-archive-description,
body .ast-single-post .entry-content,
body .ast-page-builder-template .entry-content > *{
  backdrop-filter:saturate(110%);
}
/* Mantener fondo suave en cabecera y pie si el tema los deja transparentes */
body header.site-header,
body .main-header-bar,
body footer.site-footer,
body .site-footer-primary-section-1,
body .site-footer-primary-section-2,
body .site-footer-primary-section-3,
body .site-footer-primary-section-4{
  position:relative;
  z-index:2;
}
/* Compatibilidad con el plugin WorkLane */
.wlps-home,
.wlps-section-pages{
  background:transparent!important;
  position:relative;
  z-index:1;
}
.wlps-home .wlps-shell,
.wlps-section-pages__container{position:relative;z-index:1}
/* reducir intensidad en móvil */
@media(max-width:780px){
  body{background-size:160px 160px, 180px 180px, 170px 170px, 200px 200px, 100% 100%, 100% 100%, auto!important}
  body::before{opacity:.65}
  body::after{opacity:.6}
}
