/*
Theme Name: Virtual 23
Theme URI: https://virtual23.com
Author: Virtual 23
Author URI: https://virtual23.com
Description: Tema para Virtual 23 — Soluciones Tecnológicas. Landing de una sola página con modo claro/oscuro, controlable desde Apariencia → Personalizar → Virtual23 (paleta de cada modo, efectos de scroll, menú, topbar, columna lateral y botón de llamada a la acción), sección de servicios y una sección de demos "Explora nuestras soluciones" totalmente editable desde el panel (Soluciones) para mostrar tus propios diseños de aplicaciones (imagen o HTML/iframe) sin perder la plantilla por defecto.
Version: 1.13.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: virtual23
*/

:root{
  /* Valores por defecto. Apariencia → Personalizar → Virtual23 → Apariencia general
     los sobrescribe (ver v23_customizer_css() en inc/customizer.php), y de ellos se
     derivan automáticamente el resto de tonos (tarjetas, bordes, sombras, iconos). */
  --bg:#07091a;
  --bg2:#0b0f2e;
  --bg3:#0f1340;
  --accent:#7c5cff;
  --accent2:#22d3ee;
  --accent3:#ff4ecd;
  --text:#e7e9ff;
  --muted:#9aa0c7;
  --bg-rgb:7,9,26;
  --text-rgb:231,233,255;
  --accent-rgb:124,92,255;
  --accent2-rgb:34,211,238;
  --accent3-rgb:255,78,205;
  --accent-soft:#a792ff;
  --on-accent:#ffffff;
  --card:rgba(231,233,255,.04);
  --card-hover:rgba(231,233,255,.06);
  --border:rgba(231,233,255,.08);
  --border-strong:rgba(231,233,255,.15);
  --nav-bg:rgba(7,9,26,.7);
  --shadow-color:rgba(0,0,0,.6);
  --deep-1:#231a47;
  --deep-2:#3e2e80;
  --deep-3:#5740b3;
  /* Colores por servicio (modo oscuro) */
  --svc-1:#a78bfa;
  --svc-2:#22d3ee;
  --svc-3:#ff4ecd;
  --svc-4:#fbbf24;
  --svc-5:#34d399;
  --svc-6:#f472b6;
  /* Fondos para iconos/botones */
  --icon-bg:linear-gradient(135deg,rgba(124,92,255,.25),rgba(34,211,238,.15));
}
body.light{
  --bg:#f5f6fb;
  --bg2:#ffffff;
  --bg3:#eef0f8;
  --accent:#6d4aff;
  --accent2:#0891b2;
  --accent3:#8b5cf6;
  --text:#0f1130;
  --muted:#5a5f80;
  --bg-rgb:245,246,251;
  --text-rgb:15,17,48;
  --accent-rgb:109,74,255;
  --accent2-rgb:8,145,178;
  --accent3-rgb:139,92,246;
  --accent-soft:#6d4aff;
  --on-accent:#ffffff;
  --card:rgba(255,255,255,.8);
  --card-hover:rgba(255,255,255,1);
  --border:rgba(15,17,48,.08);
  --border-strong:rgba(15,17,48,.15);
  --nav-bg:rgba(245,246,251,.75);
  --shadow-color:rgba(15,17,48,.12);
  --deep-1:#1f1547;
  --deep-2:#372580;
  --deep-3:#4c34b3;
  /* Colores por servicio (modo claro): solo azules y morados, para que no se pierda el contraste */
  --svc-1:#6d4aff;
  --svc-2:#0891b2;
  --svc-3:#8b5cf6;
  --svc-4:#4f46e5;
  --svc-5:#6366f1;
  --svc-6:#a855f7;
  --icon-bg:linear-gradient(135deg,rgba(109,74,255,.25),rgba(8,145,178,.15));
}
*{font-family:'Inter',system-ui,sans-serif;box-sizing:border-box}
h1,h2,h3,.display{font-family:'Space Grotesk','Inter',sans-serif;letter-spacing:-.02em}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  transition:background .5s ease,color .5s ease;
  margin:0;
}
img{max-width:100%;height:auto}
a{text-decoration:none}

/* Animated gradient background (aurora). Colores, velocidad e intensidad se pueden
   cambiar con --fx-1…3, --fx-s y --fx-i (ver «Fondos animados» más abajo). */
.aurora{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.aurora::before,.aurora::after{
  content:"";position:absolute;width:60vmax;height:60vmax;border-radius:50%;
  filter:blur(120px);opacity:calc(.55 * var(--fx-i,1));mix-blend-mode:screen;
  animation:v23float calc(18s / var(--fx-s,1)) ease-in-out infinite;
}
.aurora::before{background:radial-gradient(circle,var(--fx-1,var(--accent)) 0%,transparent 60%);top:-20%;left:-10%}
.aurora::after{background:radial-gradient(circle,var(--fx-2,var(--accent2)) 0%,transparent 60%);bottom:-20%;right:-10%;animation-delay:-6s}
.aurora span{
  position:absolute;width:50vmax;height:50vmax;border-radius:50%;
  background:radial-gradient(circle,var(--fx-3,var(--accent3)) 0%,transparent 60%);
  filter:blur(120px);opacity:calc(.35 * var(--fx-i,1));mix-blend-mode:screen;
  top:30%;left:30%;animation:v23float calc(22s / var(--fx-s,1)) ease-in-out infinite reverse;
}
body.light .aurora::before,body.light .aurora::after{opacity:calc(.35 * var(--fx-i,1))}
body.light .aurora span{opacity:calc(.3 * var(--fx-i,1))}
@keyframes v23float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(8%,-6%) scale(1.15)}}

/* Hero cursor glow */
.hero-cursor{
  position:absolute;width:600px;height:600px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(var(--accent-rgb),.35) 0%,rgba(var(--accent2-rgb),.15) 35%,transparent 70%);
  filter:blur(40px);transform:translate(-50%,-50%);transition:opacity .3s;z-index:1;mix-blend-mode:screen;
}
body.light .hero-cursor{
  background:radial-gradient(circle,rgba(var(--accent-rgb),.28) 0%,rgba(var(--accent2-rgb),.15) 35%,transparent 70%);
  mix-blend-mode:multiply;
}

/* Grid pattern (también la usan las demos). Tamaño, color e intensidad se pueden
   cambiar con --pt-s, --pt-rgb y --pt-m (ver «Fondos animados» más abajo). */
.grid-pattern{
  pointer-events:none;
  background-image:linear-gradient(rgba(var(--pt-rgb,var(--accent-rgb)),calc(.08 * var(--pt-m,1))) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--pt-rgb,var(--accent-rgb)),calc(.08 * var(--pt-m,1))) 1px,transparent 1px);
  background-size:var(--pt-s,48px) var(--pt-s,48px);
  mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);
}
body.light .grid-pattern{
  background-image:linear-gradient(rgba(var(--pt-rgb,var(--accent-rgb)),calc(.1 * var(--pt-m,1))) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--pt-rgb,var(--accent-rgb)),calc(.1 * var(--pt-m,1))) 1px,transparent 1px);
}

/* Glass card */
.glass{background:var(--card);border:1px solid var(--border);backdrop-filter:blur(10px);transition:background .5s,border-color .3s}
.glass:hover{border-color:rgba(var(--accent-rgb),.5)}
body.light .glass:hover{border-color:rgba(var(--accent-rgb),.4)}

/* Gradient text */
.grad-text{background:linear-gradient(90deg,var(--accent-soft) 0%,var(--accent2) 50%,var(--accent3) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Buttons */
.btn-primary{background:linear-gradient(90deg,var(--accent),var(--accent2));color:var(--on-accent);font-weight:700;box-shadow:0 10px 30px -10px rgba(var(--accent-rgb),.6);transition:transform .2s,box-shadow .2s;display:inline-block}
body.light .btn-primary{box-shadow:0 10px 30px -10px rgba(var(--accent-rgb),.5)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 40px -10px rgba(var(--accent-rgb),.8);color:var(--on-accent)}
body.light .btn-primary:hover{box-shadow:0 18px 40px -10px rgba(var(--accent-rgb),.7)}
.btn-ghost{border:1px solid var(--border-strong);color:var(--text);transition:all .2s;background:transparent;display:inline-block}
.btn-ghost:hover{border-color:var(--accent);background:rgba(var(--accent-rgb),.1);color:var(--text)}
body.light .btn-ghost{background:linear-gradient(135deg,var(--deep-1),var(--deep-2));color:#fff;border-color:rgba(var(--accent-rgb),.35)}
body.light .btn-ghost:hover{background:linear-gradient(135deg,var(--deep-2),var(--deep-3));border-color:var(--accent);color:#fff}

/* Service card */
.service-card{position:relative;transition:transform .3s ease,background .5s,border-color .3s;background:var(--card);border:1px solid var(--border);overflow:hidden}
.service-card::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .3s;background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),rgba(var(--accent-rgb),.15),transparent 40%)}
.service-card:hover::before{opacity:1}
.service-card:hover{transform:translateY(-6px);border-color:rgba(var(--accent-rgb),.4)}
.service-icon{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:var(--icon-bg);border:1px solid rgba(var(--accent-rgb),.3);transition:background .5s,border-color .3s}
.service-icon svg{transition:stroke .3s}
body.light .service-icon{background:linear-gradient(135deg,var(--deep-1),var(--deep-2));border-color:rgba(var(--accent-rgb),.45);box-shadow:0 8px 20px -8px rgba(var(--accent-rgb),.4)}
body.light .service-icon svg{stroke:#ffffff !important}
.svc-link{transition:filter .2s,color .3s}
.svc-link:hover{filter:brightness(1.3)}

/* Soluciones a tu medida
   Personalizar → Virtual23 → «Soluciones · Contenido / Diseño y carrusel / Colores».
   Variables de la sección: --sv-pad --sv-radius --sv-cpad --sv-icon --sv-cols --sv-gap
   (en línea, desde PHP) y --sv-bg --sv-card-bg --sv-title --sv-txt (por modo; «initial» =
   sin elegir, se usa el respaldo del var()). --svc-c es el color de cada solución. */
.v23-svc{position:relative;padding-block:var(--sv-pad,6rem);background:var(--sv-bg,transparent);transition:background .5s;--sv-bc:var(--border)}
.v23-svc-head{margin-bottom:4rem;text-align:center}
.v23-svc-head.is-left{text-align:left}
.v23-svc-pill{display:inline-block;padding:.375rem 1rem;border-radius:999px;font-size:.75rem;line-height:1rem;margin-bottom:1rem;color:var(--muted)}
.v23-svc-title{margin:0 0 1rem;font-size:2.25rem;line-height:2.5rem;color:var(--sv-title,var(--text))}
.v23-svc-title--sm{font-size:1.875rem;line-height:2.25rem}
.v23-svc-title--lg{font-size:3rem;line-height:1}
@media (min-width:768px){
  .v23-svc-title{font-size:3rem;line-height:1}
  .v23-svc-title--sm{font-size:2.25rem;line-height:2.5rem}
  .v23-svc-title--lg{font-size:3.75rem;line-height:1}
}
.v23-svc-lead{max-width:42rem;margin:0 auto;color:var(--sv-txt,var(--muted))}
.v23-svc-head.is-left .v23-svc-lead{margin-left:0}
.v23-svc-empty,.v23-dm-empty{padding:1.25rem;border-radius:1rem;text-align:center;font-size:.875rem;color:var(--muted)}

/* Tarjeta */
.v23-svc .service-card{--sv-bc:var(--border);padding:var(--sv-cpad,1.75rem);border-radius:var(--sv-radius,16px);background:var(--sv-card-bg,var(--card));border-color:var(--sv-bc)}
.v23-svc--card-contorno .service-card{--sv-bc:var(--border-strong);background:var(--sv-card-bg,transparent)}
.v23-svc--card-elevada .service-card{--sv-bc:transparent;box-shadow:0 24px 48px -24px var(--shadow-color)}
.v23-svc--hover-brillo .service-card:hover,.v23-svc--hover-ninguno .service-card:hover{transform:none}
.v23-svc--hover-ninguno .service-card:hover{border-color:var(--sv-bc)}
.v23-svc--hover-ninguno .service-card:hover::before{opacity:0}
.v23-svc--accent-linea .service-card::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--svc-c)}
.v23-svc .service-icon{width:var(--sv-icon,56px);height:var(--sv-icon,56px);border-radius:calc(var(--sv-icon,56px) / 4);margin-bottom:1.25rem}
.v23-svc .service-icon svg{width:calc(var(--sv-icon,56px) / 2);height:calc(var(--sv-icon,56px) / 2)}
.v23-svc--icon-circulo .service-icon{border-radius:50%}
.v23-svc--icon-sin_caja .service-icon{width:auto;height:auto;border:0;background:none;box-shadow:none;display:block}
body.light .v23-svc--icon-sin_caja .service-icon svg{stroke:currentColor !important}
.v23-svc-card-title{margin:0 0 .5rem;font-size:1.25rem;line-height:1.75rem;font-weight:700;color:var(--sv-title,var(--text))}
.v23-svc-card-desc{margin:0 0 1rem;font-size:.875rem;line-height:1.25rem;color:var(--sv-txt,var(--muted))}
.v23-svc-feats{margin:0 0 1.25rem;padding:0;list-style:none;font-size:.75rem;line-height:1rem;color:var(--sv-txt,var(--muted))}
.v23-svc-feats li+li{margin-top:.375rem}
.v23-svc-feats li::before{content:"✓ ";content:"✓ " / ""}
.v23-svc--mark-punto .v23-svc-feats li::before{content:"• ";content:"• " / ""}
.v23-svc--mark-flecha .v23-svc-feats li::before{content:"→ ";content:"→ " / ""}
.v23-svc-link{display:inline-block;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration:none}
.v23-svc-card>:last-child{margin-bottom:0}
.v23-svc--align-centrado .v23-svc-card{text-align:center}
.v23-svc--align-centrado .service-icon{margin-inline:auto}
.v23-svc--link-bottom .v23-svc-card{display:flex;flex-direction:column}
.v23-svc--link-bottom .v23-svc-link{margin-top:auto;align-self:flex-start}
.v23-svc--link-bottom.v23-svc--align-centrado .v23-svc-link{align-self:center}
.v23-svc-foot{margin-top:3rem;text-align:center}
.v23-svc-foot-text{margin:0 0 1.25rem;font-size:1.125rem;color:var(--sv-txt,var(--muted))}
.v23-svc-foot .btn-primary{display:inline-block}

/* Carrusel / cuadrícula de tarjetas (.v23-car)
   Cuadrícula: filas que se envuelven; carrusel: una sola fila que se desliza con
   «scroll-snap». Las tarjetas por fila salen de --sv-cols (2–4) y bajan solas a 3, 2 y 1
   según el ancho. theme.js añade flechas, puntos, arrastre con ratón y avance automático. */
.v23-car-track{display:flex;flex-wrap:wrap;gap:var(--sv-gap,1.5rem);--cols:1}
@media (min-width:768px){.v23-car-track{--cols:min(var(--sv-cols,3),2)}}
@media (min-width:1024px){.v23-car-track{--cols:min(var(--sv-cols,3),3)}}
@media (min-width:1280px){.v23-car-track{--cols:var(--sv-cols,3)}}
.v23-car-item{flex:0 0 calc((100% - (var(--cols) - 1) * var(--sv-gap,1.5rem)) / var(--cols) - .01px);min-width:0}
.v23-svc--center .v23-car:not(.is-slider) .v23-car-track{justify-content:center}
.v23-car.is-slider .v23-car-track{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin;padding:.75rem 0 1.25rem;margin:-.75rem 0 -1.25rem}
.v23-car.is-slider .v23-car-item{scroll-snap-align:start}
@media (max-width:767px){.v23-car.is-slider .v23-car-item{flex-basis:85%}}
.v23-car.is-enhanced .v23-car-track{scrollbar-width:none;cursor:grab}
.v23-car.is-enhanced .v23-car-track::-webkit-scrollbar{display:none}
.v23-car-track.is-dragging{scroll-snap-type:none!important;scroll-behavior:auto!important;cursor:grabbing!important;user-select:none}
.v23-car-nav{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-top:1.5rem}
.v23-car.is-static .v23-car-nav{display:none}
.v23-car-btn{display:grid;place-items:center;width:2.5rem;height:2.5rem;padding:0;border-radius:50%;background:var(--card);border:1px solid var(--border-strong);color:var(--text);cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.v23-car-btn:hover{border-color:var(--accent);background:rgba(var(--accent-rgb),.1)}
.v23-car-btn:focus-visible,.v23-car-dot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.v23-car-btn .v23-ico{width:18px;height:18px}
.v23-car-btn .v23-car-ico-play{display:none}
.v23-car-btn[aria-pressed="true"] .v23-car-ico-pause{display:none}
.v23-car-btn[aria-pressed="true"] .v23-car-ico-play{display:block}
.v23-car-dots{display:flex;align-items:center}
.v23-car-dot{position:relative;width:1.5rem;height:1.5rem;padding:0;border:0;background:none;cursor:pointer}
.v23-car-dot::before{content:"";position:absolute;left:50%;top:50%;width:.625rem;height:.625rem;border-radius:50%;background:var(--border-strong);transform:translate(-50%,-50%);transition:background .2s,transform .2s}
.v23-car-dot:hover::before{background:var(--muted)}
.v23-car-dot.is-active::before{background:var(--accent);transform:translate(-50%,-50%) scale(1.25)}
.v23-car-nav{flex-wrap:wrap}
.v23-car-dots{flex-wrap:wrap;justify-content:center}
.v23-car-btn[disabled]{opacity:.35;cursor:default;pointer-events:none}
@media (prefers-reduced-motion:reduce){.v23-car.is-slider .v23-car-track{scroll-behavior:auto}.v23-car-pause,.v23-dm-pause{display:none!important}}

/* Tabs */
.tab-btn{padding:10px 18px;border-radius:999px;color:var(--muted);border:1px solid transparent;transition:all .2s;font-weight:500;background:transparent;cursor:pointer}
.tab-btn.active{color:var(--on-accent);background:linear-gradient(90deg,var(--accent-soft),var(--accent2));box-shadow:0 8px 24px -8px rgba(var(--accent-rgb),.6)}
body.light .tab-btn.active{box-shadow:0 8px 24px -8px rgba(var(--accent-rgb),.5)}
.tab-btn:not(.active):hover{color:var(--text);border-color:var(--border-strong)}

/* Mockup */
.mockup{background:linear-gradient(180deg,var(--bg3),var(--bg2));border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -20px var(--shadow-color),0 0 0 1px rgba(var(--accent-rgb),.2) inset;transition:background .5s,border-color .5s}
.mockup-dots{display:flex;gap:6px}
.mockup-dots span{width:10px;height:10px;border-radius:50%;background:#2a2f55}
.mockup-dots span:nth-child(1){background:#ff5f57}
.mockup-dots span:nth-child(2){background:#febc2e}
.mockup-dots span:nth-child(3){background:#28c840}

/* Demos en vivo
   Personalizar → Virtual23 → «Demos · Contenido / Pestañas y panel / Colores».
   Variables de la sección: --dm-pad-y --dm-radius --dm-pad --dm-pad-md --dm-tab-py
   --dm-tab-px --dm-tab-fs --dm-cols --dm-pattern (en línea, desde PHP) y --dm-bg
   --dm-panel --dm-title --dm-txt --dm-tab (por modo; «initial» = sin elegir, se
   usa el respaldo del var()). --svc-c es el color de cada solución. */
.v23-dm{position:relative;padding-block:var(--dm-pad-y,6rem);background:var(--dm-bg,transparent);transition:background .5s}
.v23-dm-pattern{position:absolute;top:0;right:0;bottom:0;left:0;opacity:var(--dm-pattern,.5)}
.v23-dm-head{margin-bottom:3rem;text-align:center}
.v23-dm-head.is-left{text-align:left}
.v23-dm-pill{display:inline-block;padding:.375rem 1rem;border-radius:999px;font-size:.75rem;line-height:1rem;margin-bottom:1rem;color:var(--muted)}
.v23-dm-title{margin:0 0 1rem;font-size:2.25rem;line-height:2.5rem;color:var(--dm-title,var(--text))}
.v23-dm-title--sm{font-size:1.875rem;line-height:2.25rem}
.v23-dm-title--lg{font-size:3rem;line-height:1}
@media (min-width:768px){
  .v23-dm-title{font-size:3rem;line-height:1}
  .v23-dm-title--sm{font-size:2.25rem;line-height:2.5rem}
  .v23-dm-title--lg{font-size:3.75rem;line-height:1}
}
.v23-dm-lead{max-width:42rem;margin:0 auto;color:var(--dm-txt,var(--muted))}
.v23-dm-head.is-left .v23-dm-lead{margin-left:0}

/* Pestañas */
.v23-dm-tabsbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.75rem;margin-bottom:2.5rem}
.v23-dm-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;min-width:0}
.v23-dm--tabsalign-izquierda .v23-dm-tabsbar,.v23-dm--tabsalign-izquierda .v23-dm-tabs{justify-content:flex-start}
.v23-dm .tab-btn{padding:var(--dm-tab-py,10px) var(--dm-tab-px,18px);font-size:var(--dm-tab-fs,1rem);line-height:1.5}
.v23-dm .tab-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.v23-dm .tab-btn.active{background:var(--dm-tab,linear-gradient(90deg,var(--accent-soft),var(--accent2)))}
.v23-dm.v23-dm--tabcolor-solucion .tab-btn.active{background:color-mix(in srgb,var(--svc-c) 18%,transparent);border-color:color-mix(in srgb,var(--svc-c) 45%,transparent);color:var(--svc-c);box-shadow:0 8px 24px -10px color-mix(in srgb,var(--svc-c) 60%,transparent)}
.v23-dm.v23-dm--tabs-subrayado .v23-dm-tabs{gap:0 1.5rem;border-bottom:1px solid var(--border)}
.v23-dm.v23-dm--tabs-subrayado .tab-btn{border-radius:0;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding-inline:.25rem}
.v23-dm.v23-dm--tabs-subrayado .tab-btn:not(.active):hover{border-color:transparent;border-bottom-color:var(--border-strong)}
.v23-dm.v23-dm--tabs-subrayado .tab-btn.active{background:none;box-shadow:none;color:var(--dm-title,var(--text));border-bottom-color:var(--dm-tab,var(--accent))}
.v23-dm.v23-dm--tabs-subrayado.v23-dm--tabcolor-solucion .tab-btn.active{border-bottom-color:var(--svc-c);color:var(--svc-c)}
.v23-dm.v23-dm--tabs-segmentado .v23-dm-tabs{gap:.25rem;padding:.375rem;border-radius:1.5rem;background:var(--card);border:1px solid var(--border)}
.v23-dm-pause{flex:0 0 auto}
.v23-dm-pause[hidden]{display:none}
@media (max-width:767px){
  .v23-dm--tabsmobile-deslizar .v23-dm-tabsbar{flex-wrap:nowrap}
  .v23-dm--tabsmobile-deslizar .v23-dm-tabs{flex:1 1 auto;flex-wrap:nowrap;overflow-x:auto;justify-content:safe center;padding-bottom:.5rem;margin-bottom:-.5rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .v23-dm--tabsmobile-deslizar .v23-dm-tabs::-webkit-scrollbar{display:none}
  .v23-dm--tabsmobile-deslizar.v23-dm--tabsalign-izquierda .v23-dm-tabs{justify-content:flex-start}
  .v23-dm--tabsmobile-deslizar .tab-btn{flex:0 0 auto;white-space:nowrap}
  .v23-dm--tabsmobile-deslizar.v23-dm--tabs-segmentado .v23-dm-tabs{border-radius:999px}
}

/* Panel */
.v23-dm-frame{padding:var(--dm-pad,1.5rem);border-radius:var(--dm-radius,18px);background:var(--dm-panel,linear-gradient(180deg,var(--bg3),var(--bg2)))}
@media (min-width:768px){.v23-dm-frame{padding:var(--dm-pad-md,2rem)}}
.v23-dm--frame-cristal .v23-dm-frame{background:var(--dm-panel,var(--card));backdrop-filter:blur(10px);box-shadow:none}
.v23-dm--frame-sin .v23-dm-frame{background:var(--dm-panel,transparent);border-color:transparent;box-shadow:none;overflow:visible;padding-inline:0}
.v23-demo-panel[hidden]{display:none}
.v23-dm-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem;align-items:center}
.v23-dm-copy{min-width:0}
.v23-dm-visual{min-width:0}
.v23-dm-grid.is-single .v23-dm-copy{max-width:44rem;margin-inline:auto;width:100%}
@media (min-width:768px){
  .v23-dm-grid:not(.is-single){grid-template-columns:var(--dm-cols,minmax(0,1fr) minmax(0,1fr))}
  .v23-dm--layout-lado_inv .v23-dm-visual{order:-1}
  .v23-dm--layout-apilado .v23-dm-grid:not(.is-single){grid-template-columns:minmax(0,1fr)}
}
.v23-dm--layout-apilado .v23-dm-copy{max-width:44rem;margin-inline:auto;width:100%;text-align:center}
.v23-dm--layout-apilado .v23-dm-copy ul{display:inline-block;vertical-align:top;text-align:left}
.v23-dm--layout-apilado .v23-dm-visual{max-width:44rem;width:100%;margin-inline:auto}
.v23-dm-actions{display:flex;flex-wrap:wrap;gap:.75rem}
.v23-dm--layout-apilado .v23-dm-actions{justify-content:center}
@keyframes v23dm-fade{from{opacity:0}to{opacity:1}}
@keyframes v23dm-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.v23-dm--anim-fundido .v23-demo-panel.is-entering{animation:v23dm-fade .35s ease both}
.v23-dm--anim-subir .v23-demo-panel.is-entering{animation:v23dm-rise .45s ease both}
@media (prefers-reduced-motion:reduce){.v23-demo-panel.is-entering{animation:none!important}}

/* Cómo trabajamos
   Personalizar → Virtual23 → «Proceso · Contenido / Pasos / Diseño / Colores».
   Variables de la sección: --pr-pad-y --pr-gap --pr-radius --pr-pad --pr-cols --pr-num-fs
   --pr-mk --pr-mk-fs (en línea, desde PHP) y --pr-bg --pr-card --pr-title --pr-txt --pr-line
   --pr-num --pr-num-bg --pr-num-fg (por modo; «initial» = sin elegir, se usa el respaldo
   del var()). --pr-w / --pr-h son el ancho y el alto del marcador (número, círculo o
   icono) y sirven para trazar la línea que une los pasos. */
.v23-pr{position:relative;padding-block:var(--pr-pad-y,6rem);background:var(--pr-bg,transparent);transition:background .5s;--pr-bc:var(--border);--pr-w:calc(var(--pr-num-fs,3rem) * 1.5);--pr-h:var(--pr-num-fs,3rem)}
.v23-pr--card-contorno{--pr-bc:var(--border-strong)}
.v23-pr--card-elevada{--pr-bc:transparent}
.v23-pr--num-circulo,.v23-pr--num-contorno,.v23-pr--num-icono{--pr-w:var(--pr-mk,3.5rem);--pr-h:var(--pr-mk,3.5rem)}
.v23-pr--num-ninguno{--pr-w:.875rem;--pr-h:.875rem}
.v23-pr-head{margin-bottom:4rem;text-align:center}
.v23-pr-head.is-left{text-align:left}
.v23-pr-pill{display:inline-block;padding:.375rem 1rem;border-radius:999px;font-size:.75rem;line-height:1rem;margin-bottom:1rem;color:var(--muted)}
.v23-pr-title{margin:0 0 1rem;font-size:2.25rem;line-height:2.5rem;color:var(--pr-title,var(--text))}
.v23-pr-title--sm{font-size:1.875rem;line-height:2.25rem}
.v23-pr-title--lg{font-size:3rem;line-height:1}
@media (min-width:768px){
  .v23-pr-title{font-size:3rem;line-height:1}
  .v23-pr-title--sm{font-size:2.25rem;line-height:2.5rem}
  .v23-pr-title--lg{font-size:3.75rem;line-height:1}
}
.v23-pr-lead{max-width:42rem;margin:0 auto;color:var(--pr-txt,var(--muted))}
.v23-pr-head.is-left .v23-pr-lead{margin-left:0}
.v23-pr-empty{padding:1.25rem;border-radius:1rem;text-align:center;font-size:.875rem;color:var(--muted)}
.v23-pr-cta{margin-top:2.5rem;text-align:center}
.v23-pr-cta.is-left{text-align:left}

/* Pasos */
.v23-pr-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--pr-gap,1.5rem)}
.v23-pr-step{position:relative;min-width:0;margin:0;list-style:none}
.v23-pr-body{min-width:0}
.v23-pr--single .v23-pr-list{max-width:32rem;margin-inline:auto}
.v23-pr-name{margin:0 0 .5rem;font-size:1rem;line-height:1.5;font-weight:700;color:var(--pr-title,var(--text))}
.v23-pr-name:last-child{margin-bottom:0}
.v23-pr-desc{margin:0;font-size:.875rem;line-height:1.25rem;color:var(--pr-txt,var(--muted))}
.v23-pr-link{color:inherit;text-decoration:none}
.v23-pr-link:hover{text-decoration:underline}
.v23-pr-link::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--pr-radius,16px)}
.v23-pr-link:focus-visible{outline:none}
.v23-pr-link:focus-visible::after{outline:2px solid var(--accent);outline-offset:2px}
.v23-pr--align-centrado .v23-pr-step,.v23-pr--align-centrado .v23-pr-body{text-align:center}

/* Tarjeta (en «tarjetas» es el paso entero; en línea de tiempo y lista, solo el texto) */
.v23-pr-card{padding:var(--pr-pad,1.5rem);border-radius:var(--pr-radius,16px)}
.v23-pr-card.glass{background:var(--pr-card,var(--card))}
.v23-pr--card-contorno .v23-pr-card{background:var(--pr-card,transparent);border:1px solid var(--pr-bc);transition:background .5s,border-color .3s}
.v23-pr--card-elevada .v23-pr-card{background:var(--pr-card,var(--card));border:1px solid var(--pr-bc);box-shadow:0 24px 48px -24px var(--shadow-color);transition:background .5s,border-color .3s}
.v23-pr--card-contorno .v23-pr-card:hover,.v23-pr--card-elevada .v23-pr-card:hover{border-color:rgba(var(--accent-rgb),.5)}
.v23-pr--card-sin .v23-pr-card{padding:0;border-radius:0}
.v23-pr--hover-elevar .v23-pr-card,.v23-pr--hover-brillo .v23-pr-card{transition:transform .3s ease,box-shadow .3s ease,background .5s,border-color .3s}
.v23-pr--hover-elevar .v23-pr-card:hover{transform:translateY(-6px)}
.v23-pr--hover-brillo .v23-pr-card:hover{border-color:rgba(var(--accent-rgb),.6);box-shadow:0 0 0 1px rgba(var(--accent-rgb),.35),0 18px 44px -18px rgba(var(--accent-rgb),.6)}
.v23-pr--hover-ninguno .v23-pr-card:hover{border-color:var(--pr-bc)}
.v23-pr--card-sin .v23-pr-card:hover{border-color:transparent;box-shadow:none;transform:none}
@media (prefers-reduced-motion:reduce){.v23-pr--hover-elevar .v23-pr-card:hover{transform:none}}

/* Números, círculos e iconos */
.v23-pr-num{margin:0 0 .75rem;font-weight:900;line-height:1}
.v23-pr--num-grande .v23-pr-num{font-size:var(--pr-num-fs,3rem);background-image:var(--pr-num-bg,linear-gradient(90deg,var(--accent-soft) 0%,var(--accent2) 50%,var(--accent3) 100%));-webkit-background-clip:text;background-clip:text;color:var(--pr-num-fg,transparent)}
.v23-pr--num-circulo .v23-pr-num,.v23-pr--num-contorno .v23-pr-num,.v23-pr--num-icono .v23-pr-num{display:grid;place-items:center;width:var(--pr-mk,3.5rem);height:var(--pr-mk,3.5rem);margin-bottom:1rem;border-radius:50%;font-size:var(--pr-mk-fs,1.25rem)}
.v23-pr--num-circulo .v23-pr-num{background:var(--pr-num,linear-gradient(135deg,var(--accent),var(--accent2)));color:var(--on-accent);box-shadow:0 8px 20px -8px rgba(var(--accent-rgb),.6)}
.v23-pr--num-contorno .v23-pr-num{border:2px solid var(--pr-num,var(--accent));color:var(--pr-num,var(--accent))}
.v23-pr--num-icono .v23-pr-num{border-radius:calc(var(--pr-mk,3.5rem) / 4);font-size:calc(var(--pr-mk,3.5rem) * .46);font-weight:400;background:color-mix(in srgb,var(--pr-num,var(--accent)) 14%,transparent);border:1px solid color-mix(in srgb,var(--pr-num,var(--accent)) 35%,transparent);color:var(--pr-num,var(--accent))}
.v23-pr--num-icono .v23-pr-num.is-text{font-size:var(--pr-mk-fs,1.25rem);font-weight:900}
.v23-pr-num.is-dot{display:block;width:.875rem;height:.875rem;margin:0;border-radius:50%;background:var(--pr-num,linear-gradient(135deg,var(--accent),var(--accent2)))}
.v23-pr--layout-tarjetas.v23-pr--align-centrado .v23-pr-num{margin-inline:auto}

/* Disposición: tarjetas en cuadrícula */
@media (min-width:768px){.v23-pr--layout-tarjetas .v23-pr-list{grid-template-columns:repeat(var(--pr-cols,4),minmax(0,1fr))}}
@media (min-width:768px) and (max-width:1023px){.v23-pr--layout-tarjetas.v23-pr--tablet-dos .v23-pr-list{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Disposición: lista vertical (y línea de tiempo en pantallas pequeñas) */
.v23-pr--layout-lista .v23-pr-list{max-width:48rem;margin-inline:auto}
.v23-pr--layout-lista .v23-pr-step,.v23-pr--layout-linea .v23-pr-step{display:grid;grid-template-columns:var(--pr-w) minmax(0,1fr);column-gap:1rem;align-items:start}
.v23-pr--layout-lista .v23-pr-num,.v23-pr--layout-linea .v23-pr-num{display:grid;place-items:center;width:var(--pr-w);height:var(--pr-h);margin:0}
.v23-pr--layout-lista .v23-pr-num.is-dot,.v23-pr--layout-linea .v23-pr-num.is-dot{display:block}
.v23-pr--layout-lista .v23-pr-step:not(:last-child)::before,.v23-pr--layout-linea .v23-pr-step:not(:last-child)::before{content:"";position:absolute;left:calc(var(--pr-w) / 2 - 1px);top:calc(var(--pr-h) + .5rem);bottom:calc(var(--pr-gap,1.5rem) * -1 + .5rem);width:2px;border-radius:1px;background:var(--pr-line,var(--border-strong))}

/* Disposición: línea de tiempo horizontal */
@media (min-width:768px){
  .v23-pr--layout-linea .v23-pr-list{grid-template-columns:repeat(var(--pr-cols,4),minmax(0,1fr));row-gap:calc(var(--pr-gap,1.5rem) + 1rem)}
  .v23-pr--layout-linea .v23-pr-step{display:flex;flex-direction:column}
  .v23-pr--layout-linea .v23-pr-body{flex:1 1 auto}
  .v23-pr--layout-linea .v23-pr-num{margin:0 0 1rem}
  .v23-pr--layout-linea.v23-pr--align-centrado .v23-pr-num{margin-inline:auto}
  .v23-pr--layout-linea .v23-pr-step:not(:last-child)::before{left:calc(var(--pr-w) + .75rem);right:calc(var(--pr-gap,1.5rem) * -1 + .75rem);top:calc(var(--pr-h) / 2 - 1px);bottom:auto;width:auto;height:2px}
  .v23-pr--layout-linea.v23-pr--align-centrado .v23-pr-step:not(:last-child)::before{left:calc(50% + var(--pr-w) / 2 + .75rem);right:calc(var(--pr-gap,1.5rem) * -1 - 50% + var(--pr-w) / 2 + .75rem)}
  .v23-pr--layout-linea .v23-pr-step.is-row-end::before{display:none}
}

/* Aparición escalonada (con el efecto de «Apariencia general → Efectos de scroll») */
body .v23-pr--stagger .v23-pr-step.reveal.visible{animation-delay:calc(var(--i,0) * 90ms)}

/* Estadísticas
   Personalizar → Virtual23 → «Estadísticas · Contenido / Cifras / Diseño / Colores».
   Variables de la sección: --st-pad-y --st-gap --st-radius --st-pad --st-cols --st-num-fs
   --st-lbl-fs --st-lbl-lh (en línea, desde PHP) y --st-bg --st-card --st-title --st-label
   --st-line --st-num --st-num-bg --st-num-fg (por modo; «initial» = sin elegir, se usa el
   respaldo del var()). Las cifras van en una fila que se parte (flex-wrap) para que la
   última fila quede centrada aunque no esté completa. */
.v23-st{position:relative;padding-block:var(--st-pad-y,4rem);background:var(--st-bg,transparent);transition:background .5s}
.v23-st-head{margin-bottom:3rem;text-align:center}
.v23-st-head.is-left{text-align:left}
.v23-st-pill{display:inline-block;padding:.375rem 1rem;border-radius:999px;font-size:.75rem;line-height:1rem;margin-bottom:1rem;color:var(--muted)}
.v23-st-title{margin:0 0 1rem;font-size:2.25rem;line-height:2.5rem;color:var(--st-title,var(--text))}
.v23-st-title--sm{font-size:1.875rem;line-height:2.25rem}
.v23-st-title--lg{font-size:3rem;line-height:1}
@media (min-width:768px){
  .v23-st-title{font-size:3rem;line-height:1}
  .v23-st-title--sm{font-size:2.25rem;line-height:2.5rem}
  .v23-st-title--lg{font-size:3.75rem;line-height:1}
}
.v23-st-lead{max-width:42rem;margin:0 auto;color:var(--st-label,var(--muted))}
.v23-st-head.is-left .v23-st-lead{margin-left:0}
.v23-st-empty{padding:1.25rem;border-radius:1rem;text-align:center;font-size:.875rem;color:var(--muted)}

/* Cifras */
.v23-st-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--st-gap,2rem)}
.v23-st-item{position:relative;flex:0 0 100%;min-width:0;margin:0;text-align:center}
.v23-st--align-izquierda .v23-st-item{text-align:left}
@media (min-width:768px){.v23-st-item{flex-basis:calc((100% - (var(--st-cols,4) - 1) * var(--st-gap,2rem)) / var(--st-cols,4))}}
.v23-st-ico{margin-bottom:.5rem;font-size:1.75rem;line-height:1}
.v23-st-num{margin-bottom:.25rem;font-size:var(--st-num-fs,3rem);font-weight:900;line-height:1}
.v23-st--num-degradado .v23-st-num{background-image:var(--st-num-bg,linear-gradient(180deg,var(--text),var(--accent-soft)));-webkit-background-clip:text;background-clip:text;color:var(--st-num-fg,transparent)}
.v23-st--num-marca .v23-st-num{background-image:var(--st-num-bg,linear-gradient(90deg,var(--accent-soft) 0%,var(--accent2) 50%,var(--accent3) 100%));-webkit-background-clip:text;background-clip:text;color:var(--st-num-fg,transparent)}
.v23-st--num-liso .v23-st-num{color:var(--st-num,var(--text))}
.v23-st-label{font-size:var(--st-lbl-fs,.875rem);line-height:var(--st-lbl-lh,1.25rem);color:var(--st-label,var(--muted))}
.v23-st--caps .v23-st-label{text-transform:uppercase;letter-spacing:.06em}

/* Caja (en «panel» es una sola; en «tarjetas», una por cifra; en «línea», ninguna) */
.v23-st-card{padding:var(--st-pad,2.5rem);border-radius:var(--st-radius,24px)}
.v23-st-card.glass{background:var(--st-card,var(--card))}
.v23-st--card-contorno .v23-st-card{background:var(--st-card,transparent);border:1px solid var(--border-strong);transition:background .5s,border-color .3s}
.v23-st--card-elevada .v23-st-card{background:var(--st-card,var(--card));border:1px solid transparent;box-shadow:0 24px 48px -24px var(--shadow-color);transition:background .5s,border-color .3s}
.v23-st--card-contorno .v23-st-card:hover,.v23-st--card-elevada .v23-st-card:hover{border-color:rgba(var(--accent-rgb),.5)}
.v23-st--card-sin .v23-st-card{padding:0;border-radius:0}

/* Separadores verticales (solo en pantallas anchas) */
@media (min-width:768px){
  .v23-st--dividers .v23-st-item:not(.is-row-start)::before{content:"";position:absolute;top:12%;bottom:12%;left:calc(var(--st-gap,2rem) / -2);width:1px;background:var(--st-line,var(--border-strong))}
}

/* Móvil: dos cifras por fila */
@media (max-width:767px){
  .v23-st--mobile-dos .v23-st-item{flex-basis:calc((100% - var(--st-gap,2rem)) / 2)}
  .v23-st--mobile-dos .v23-st-num{font-size:calc(var(--st-num-fs,3rem) * .75)}
  .v23-st--mobile-dos .v23-st-card{padding:min(var(--st-pad,2.5rem),1.5rem)}
}

/* Contacto
   Personalizar → Virtual23 → «Contacto · Contenido / Datos / Formulario / Diseño / Colores».
   Variables de la sección: --ct-pad-y --ct-gap --ct-radius --ct-pad --ct-pad-md --ct-maxw --ct-cols
   --ct-field-r --ct-ico --ct-ico-fs (en línea, desde PHP) y --ct-bg --ct-card --ct-title --ct-txt
   --ct-label --ct-field --ct-field-txt --ct-icon (por modo; «initial» = sin elegir, se usa el
   respaldo del var()). */
.v23-ct{position:relative;padding-block:var(--ct-pad-y,6rem);background:var(--ct-bg,transparent);transition:background .5s}
.v23-ct-in{position:relative;z-index:2;max-width:var(--ct-maxw,64rem);margin-inline:auto;padding-inline:1.5rem}
.v23-ct-card{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ct-gap,2.5rem);padding:var(--ct-pad,2rem);border-radius:var(--ct-radius,24px)}
@media (min-width:768px){
  .v23-ct-card{padding:var(--ct-pad-md,3rem)}
  .v23-ct:not(.v23-ct--layout-apilado):not(.v23-ct--noinfo) .v23-ct-card{grid-template-columns:var(--ct-cols,minmax(0,1fr) minmax(0,1fr))}
  .v23-ct--layout-dos_inv .v23-ct-info{order:2}
}

/* Caja */
.v23-ct-card.glass{background:var(--ct-card,var(--card))}
.v23-ct--card-contorno .v23-ct-card{background:var(--ct-card,transparent);border:1px solid var(--border-strong);transition:background .5s,border-color .3s}
.v23-ct--card-elevada .v23-ct-card{background:var(--ct-card,var(--card));border:1px solid transparent;box-shadow:0 24px 48px -24px var(--shadow-color);transition:background .5s,border-color .3s}
.v23-ct--card-contorno .v23-ct-card:hover,.v23-ct--card-elevada .v23-ct-card:hover{border-color:rgba(var(--accent-rgb),.5)}
.v23-ct--card-sin .v23-ct-card{padding:0;border-radius:0}

/* Encabezado y datos */
.v23-ct-head{margin-bottom:2rem}
.v23-ct-head:last-child{margin-bottom:0}
.v23-ct-head > :last-child{margin-bottom:0}
.v23-ct-pill{display:inline-block;padding:.375rem 1rem;border-radius:999px;background:rgba(255,255,255,.05);font-size:.75rem;line-height:1rem;margin-bottom:1rem;color:var(--ct-txt,var(--muted))}
.v23-ct-title{margin:0 0 1rem;font-size:1.875rem;line-height:2.25rem;color:var(--ct-title,var(--text))}
.v23-ct-title--sm{font-size:1.5rem;line-height:2rem}
.v23-ct-title--lg{font-size:2.25rem;line-height:2.5rem}
@media (min-width:768px){
  .v23-ct-title{font-size:2.25rem;line-height:2.5rem}
  .v23-ct-title--sm{font-size:1.875rem;line-height:2.25rem}
  .v23-ct-title--lg{font-size:3rem;line-height:1}
}
.v23-ct-lead{margin:0;color:var(--ct-txt,var(--muted))}
.v23-ct-listtitle{margin-bottom:1rem;font-weight:600;color:var(--ct-title,var(--text))}
.v23-ct-list{display:flex;flex-direction:column;gap:1rem;font-size:.875rem;line-height:1.25rem}
.v23-ct-row{display:flex;align-items:center;gap:.75rem}
.v23-ct-ico{display:grid;place-items:center;flex:none;width:var(--ct-ico,2.5rem);height:var(--ct-ico,2.5rem);border-radius:.5rem;font-size:var(--ct-ico-fs,.875rem)}
.v23-ct .contact-icon{background:var(--ct-icon,linear-gradient(135deg,var(--accent),var(--accent2)))}
.v23-ct--icon-circulo .v23-ct-ico{border-radius:50%}
.v23-ct--icon-sin_caja .v23-ct-ico{width:auto;height:auto;background:none;box-shadow:none;font-size:calc(var(--ct-ico-fs,.875rem) * 1.6)}
.v23-ct-lbl{font-size:.75rem;line-height:1rem;color:var(--ct-label,var(--muted))}
.v23-ct-val{font-weight:500;color:var(--ct-title,var(--text))}
.v23-ct-val a{color:inherit;text-decoration:none}
.v23-ct-val a:hover{text-decoration:underline}

/* Formulario */
.v23-ct-formcol{min-width:0}
.v23-ct--noinfo .v23-ct-formcol{width:100%;max-width:36rem;margin-inline:auto}
.v23-ct-notices{margin:0}
.v23-notice-info{background:rgba(var(--accent-rgb),.12);color:var(--text);border:1px solid rgba(var(--accent-rgb),.3)}
.v23-ct-form{position:relative;display:flex;flex-direction:column;gap:1rem;padding-top:1rem}
.v23-ct-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.v23-ct-label{display:block;margin-bottom:.375rem;font-size:.75rem;line-height:1rem;color:var(--ct-label,var(--muted))}
.v23-ct--nolabels .v23-ct-label{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;margin:0;overflow:hidden}
.v23-ct-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.v23-ct-pair.is-single,.v23-ct--pair-apilado .v23-ct-pair{grid-template-columns:minmax(0,1fr)}
.v23-ct .field{background:var(--ct-field,var(--card));color:var(--ct-field-txt,var(--text));border-radius:var(--ct-field-r,12px)}
.v23-ct--fields-subrayado .field{background:transparent;border-width:0 0 1px;border-radius:0;padding-inline:0}
.v23-ct--fields-subrayado .field:focus{background:transparent}
.v23-ct-consent{display:flex;align-items:flex-start;gap:.5rem;font-size:.75rem;line-height:1rem;color:var(--ct-label,var(--muted));cursor:pointer}
.v23-ct-consent input{flex:none;margin-top:.125rem;accent-color:var(--accent)}
.v23-ct-consent a{color:var(--accent-soft,var(--accent));text-decoration:underline}
.v23-ct-submit{width:100%;padding-block:1rem;border:0;border-radius:.75rem;cursor:pointer;font-family:inherit;font-size:inherit;line-height:inherit}
.v23-ct-submit:disabled{opacity:.7;cursor:progress}
.v23-ct-note{margin:0;font-size:10px;text-align:center;color:var(--ct-txt,var(--muted))}

/* Divisores de sección
   Personalizar → Virtual23 → «Apariencia general → Divisores de sección» y, en cada
   sección, «Divisores de forma». Entre dos secciones va un contenedor sin altura
   (.v23-dvw) con el divisor inferior de la de arriba y el superior de la de abajo.
   Variables (en línea): --dv-h alto, --dv-m factor en móvil, --dv-c color de relleno;
   --dv-auto y --dvbg-{sección} llegan con la paleta de cada modo. */
.v23-dvw{position:relative;height:0;z-index:2;pointer-events:none}
.v23-dv{position:absolute;left:0;right:0;width:100%;height:var(--dv-h,80px);color:var(--dv-c,var(--bg));pointer-events:none;line-height:0}
@media (max-width:767px){.v23-dv{height:calc(var(--dv-h,80px) * var(--dv-m,.6))}}
.v23-dv--top{top:-1px}
.v23-dv--bottom{bottom:-1px}
.v23-dv svg{display:block;width:100%;height:100%}
.v23-dv path{fill:currentColor}
.v23-dv--bottom svg{transform:scaleY(-1)}
.v23-dv.is-flip svg{transform:scaleX(-1)}
.v23-dv--bottom.is-flip svg{transform:scale(-1,-1)}

/* =====================================================================
   Fondos animados: efectos en movimiento y patrones (portada y contacto).
   Variables (en línea): --fx-1…4 colores, --fx-s velocidad, --fx-i intensidad;
   --pt-s tamaño, --pt-m intensidad, --pt-rgb color del patrón.
   La aurora y la cuadrícula de siempre están más arriba (.aurora, .grid-pattern).
   ===================================================================== */
.aurora .v23-fx-4{top:-8%;left:58%;width:38vmax;height:38vmax;background:radial-gradient(circle,var(--fx-4,var(--accent)) 0%,transparent 60%);animation-duration:calc(26s / var(--fx-s,1));animation-direction:normal;animation-delay:-11s}
.v23-fx{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.v23-fx i{position:absolute;display:block}
.v23-fx--burbujas,.v23-fx--particulas{container-type:size}
@media (max-width:767px){.aurora.v23-fx-nomob,.v23-fx.v23-fx-nomob{display:none}}
.aurora.is-paused::before,.aurora.is-paused::after,.aurora.is-paused span,.v23-fx.is-paused::before,.v23-fx.is-paused::after,.v23-fx.is-paused i{animation-play-state:paused}

/* Manchas flotantes */
.v23-fx--manchas i{width:46vmax;height:46vmax;background:var(--fx-1);border-radius:42% 58% 63% 37% / 41% 44% 56% 59%;filter:blur(70px);opacity:calc(.42 * var(--fx-i,1));mix-blend-mode:screen;animation:v23fxDriftA calc(26s / var(--fx-s,1)) ease-in-out infinite alternate}
.v23-fx--manchas i:nth-child(1){top:-18%;left:-10%}
.v23-fx--manchas i:nth-child(2){background:var(--fx-2);top:8%;right:-14%;width:40vmax;height:40vmax;border-radius:61% 39% 44% 56% / 55% 63% 37% 45%;animation-name:v23fxDriftB;animation-duration:calc(31s / var(--fx-s,1))}
.v23-fx--manchas i:nth-child(3){background:var(--fx-3);bottom:-26%;left:22%;width:50vmax;height:50vmax;border-radius:38% 62% 55% 45% / 62% 38% 62% 38%;animation-name:v23fxDriftC;animation-duration:calc(28s / var(--fx-s,1))}
.v23-fx--manchas i:nth-child(4){background:var(--fx-4);bottom:-8%;right:6%;width:30vmax;height:30vmax;opacity:calc(.4 * var(--fx-i,1));animation-duration:calc(21s / var(--fx-s,1));animation-delay:-9s}
body.light .v23-fx--manchas i{opacity:calc(.3 * var(--fx-i,1))}
@keyframes v23fxDriftA{from{transform:translate(0,0) rotate(0) scale(1,1)}to{transform:translate(14%,10%) rotate(40deg) scale(1.12,.9)}}
@keyframes v23fxDriftB{from{transform:translate(0,0) rotate(0) scale(1,1)}to{transform:translate(-16%,14%) rotate(-35deg) scale(.9,1.15)}}
@keyframes v23fxDriftC{from{transform:translate(0,0) scale(1,1)}to{transform:translate(10%,-14%) scale(1.18,.92)}}

/* Degradado fluido */
.v23-fx--degradado::before,.v23-fx--degradado::after{content:"";position:absolute;inset:-25%}
.v23-fx--degradado::before{background:linear-gradient(125deg,var(--fx-1),var(--fx-2),var(--fx-3),var(--fx-4),var(--fx-1));background-size:300% 300%;opacity:calc(.24 * var(--fx-i,1));animation:v23fxGrad calc(24s / var(--fx-s,1)) ease-in-out infinite}
.v23-fx--degradado::after{background:radial-gradient(60% 60% at 30% 30%,var(--fx-3),transparent 70%),radial-gradient(50% 50% at 75% 70%,var(--fx-1),transparent 70%);mix-blend-mode:screen;opacity:calc(.28 * var(--fx-i,1));animation:v23fxFlow calc(30s / var(--fx-s,1)) ease-in-out infinite alternate}
body.light .v23-fx--degradado::before{opacity:calc(.22 * var(--fx-i,1))}
@keyframes v23fxGrad{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes v23fxFlow{from{transform:translate(-4%,-3%) scale(1)}to{transform:translate(5%,4%) scale(1.12)}}

/* Remolino de color */
.v23-fx--remolino::before{content:"";position:absolute;left:50%;top:50%;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;background:conic-gradient(from 0deg,var(--fx-1),var(--fx-2),var(--fx-3),var(--fx-4),var(--fx-1));filter:blur(90px);opacity:calc(.3 * var(--fx-i,1));animation:v23fxSpin calc(48s / var(--fx-s,1)) linear infinite}
body.light .v23-fx--remolino::before{opacity:calc(.24 * var(--fx-i,1))}
@keyframes v23fxSpin{to{transform:rotate(360deg)}}

/* Ondas */
.v23-fx--ondas i{left:0;bottom:0;width:200%;height:46%;background:var(--fx-1);opacity:calc(.3 * var(--fx-i,1));-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%271200%27%20height=%27160%27%20viewBox=%270%200%201200%20160%27%20preserveAspectRatio=%27none%27%3E%3Cpath%20d=%27M0,80C150,10%20350,150%20600,80C850,10%201050,150%201200,80V160H0Z%27%20fill=%27%23000%27/%3E%3C/svg%3E") repeat-x 0 100% / 50% 100%;mask:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%271200%27%20height=%27160%27%20viewBox=%270%200%201200%20160%27%20preserveAspectRatio=%27none%27%3E%3Cpath%20d=%27M0,80C150,10%20350,150%20600,80C850,10%201050,150%201200,80V160H0Z%27%20fill=%27%23000%27/%3E%3C/svg%3E") repeat-x 0 100% / 50% 100%;animation:v23fxWave calc(22s / var(--fx-s,1)) linear infinite}
.v23-fx--ondas i:nth-child(2){background:var(--fx-2);height:58%;opacity:calc(.24 * var(--fx-i,1));animation-duration:calc(30s / var(--fx-s,1));animation-direction:reverse}
.v23-fx--ondas i:nth-child(3){background:var(--fx-3);height:36%;opacity:calc(.2 * var(--fx-i,1));animation-duration:calc(16s / var(--fx-s,1))}
body.light .v23-fx--ondas i{opacity:calc(.3 * var(--fx-i,1))}
body.light .v23-fx--ondas i:nth-child(2){opacity:calc(.24 * var(--fx-i,1))}
body.light .v23-fx--ondas i:nth-child(3){opacity:calc(.2 * var(--fx-i,1))}
@keyframes v23fxWave{to{transform:translateX(-50%)}}

/* Haces de luz */
.v23-fx--haces i{top:-30%;left:-10%;width:16vmax;height:160%;background:linear-gradient(90deg,transparent,var(--fx-1),transparent);filter:blur(28px);opacity:calc(.35 * var(--fx-i,1));mix-blend-mode:screen;animation:v23fxBeam calc(18s / var(--fx-s,1)) ease-in-out infinite alternate}
.v23-fx--haces i:nth-child(2){left:22%;width:10vmax;background:linear-gradient(90deg,transparent,var(--fx-2),transparent);animation-duration:calc(24s / var(--fx-s,1));animation-delay:-8s}
.v23-fx--haces i:nth-child(3){left:55%;width:20vmax;background:linear-gradient(90deg,transparent,var(--fx-3),transparent);animation-duration:calc(21s / var(--fx-s,1));animation-delay:-14s}
body.light .v23-fx--haces i{opacity:calc(.3 * var(--fx-i,1))}
@keyframes v23fxBeam{from{transform:translateX(-25vw) rotate(24deg)}to{transform:translateX(35vw) rotate(24deg)}}

/* Cortinas de luz */
.v23-fx--cortinas i{top:-10%;height:120%;width:26%;background:linear-gradient(180deg,transparent 0%,var(--fx-1) 38%,transparent 100%);filter:blur(38px);opacity:calc(.42 * var(--fx-i,1));mix-blend-mode:screen;transform-origin:50% 0;animation:v23fxCurtain calc(12s / var(--fx-s,1)) ease-in-out infinite alternate}
.v23-fx--cortinas i:nth-child(1){left:-4%}
.v23-fx--cortinas i:nth-child(2){left:16%;background:linear-gradient(180deg,transparent 0%,var(--fx-2) 38%,transparent 100%);animation-duration:calc(15s / var(--fx-s,1));animation-delay:-4s}
.v23-fx--cortinas i:nth-child(3){left:38%;background:linear-gradient(180deg,transparent 0%,var(--fx-3) 38%,transparent 100%);animation-duration:calc(13s / var(--fx-s,1));animation-delay:-7s}
.v23-fx--cortinas i:nth-child(4){left:58%;background:linear-gradient(180deg,transparent 0%,var(--fx-4) 38%,transparent 100%);animation-duration:calc(16s / var(--fx-s,1));animation-delay:-2s}
.v23-fx--cortinas i:nth-child(5){left:78%;background:linear-gradient(180deg,transparent 0%,var(--fx-2) 38%,transparent 100%);animation-duration:calc(14s / var(--fx-s,1));animation-delay:-9s}
body.light .v23-fx--cortinas i{opacity:calc(.32 * var(--fx-i,1))}
@keyframes v23fxCurtain{from{transform:skewX(-10deg) translateX(-4%) scaleY(.85)}to{transform:skewX(12deg) translateX(5%) scaleY(1.1)}}

/* Burbujas y partículas (suben despacio) */
.v23-fx--burbujas i,.v23-fx--particulas i{bottom:-30%;border-radius:50%;animation:v23fxRise calc(var(--t,24s) / var(--fx-s,1)) linear infinite}
.v23-fx--burbujas i{opacity:calc(.22 * var(--fx-i,1));box-shadow:inset 0 0 24px rgba(255,255,255,.28)}
.v23-fx--particulas i{opacity:calc(.7 * var(--fx-i,1))}
body.light .v23-fx--burbujas i{opacity:calc(.3 * var(--fx-i,1))}
@keyframes v23fxRise{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(3vw,-65vh,0)}100%{transform:translate3d(-2vw,-135vh,0);transform:translate3d(-2vw,-130cqh,0)}}

/* Patrones */
.grid-pattern.v23-pt-nofade{-webkit-mask-image:none;mask-image:none}
.v23-pt{position:absolute;inset:0;overflow:hidden;pointer-events:none;--pt-s:48px;--pt-a:calc(.12 * var(--pt-m,1));-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%)}
body.light .v23-pt{--pt-a:calc(.16 * var(--pt-m,1))}
.v23-pt.v23-pt-nofade{-webkit-mask-image:none;mask-image:none}
.v23-pt i{position:absolute;top:0;left:0;bottom:0;right:calc(var(--pt-s) * -1);--pt-c:rgba(var(--pt-rgb,var(--accent-rgb)),var(--pt-a));--pt-c2:rgba(var(--pt-rgb,var(--accent-rgb)),calc(var(--pt-a) * .45))}
.v23-pt--horizontales i{right:0;bottom:calc(var(--pt-s) * -1)}
.v23-pt-move i{will-change:transform;animation:v23ptX 40s linear infinite}
.v23-pt--horizontales.v23-pt-move i{animation-name:v23ptY}
@keyframes v23ptX{to{transform:translateX(calc(var(--pt-s) * -1))}}
@keyframes v23ptY{to{transform:translateY(calc(var(--pt-s) * -1))}}
.v23-pt--cuadricula i{background:linear-gradient(var(--pt-c) 1px,transparent 1px) 0 0 / var(--pt-s) var(--pt-s),linear-gradient(90deg,var(--pt-c) 1px,transparent 1px) 0 0 / var(--pt-s) var(--pt-s)}
.v23-pt--cuadricula_fina i{background:linear-gradient(var(--pt-c) 1px,transparent 1px) 0 0 / var(--pt-s) var(--pt-s),linear-gradient(90deg,var(--pt-c) 1px,transparent 1px) 0 0 / var(--pt-s) var(--pt-s),linear-gradient(var(--pt-c2) 1px,transparent 1px) 0 0 / calc(var(--pt-s) / 4) calc(var(--pt-s) / 4),linear-gradient(90deg,var(--pt-c2) 1px,transparent 1px) 0 0 / calc(var(--pt-s) / 4) calc(var(--pt-s) / 4)}
.v23-pt--puntos{--pt-a:calc(.32 * var(--pt-m,1))}
body.light .v23-pt--puntos{--pt-a:calc(.4 * var(--pt-m,1))}
.v23-pt--puntos i{background:radial-gradient(circle,var(--pt-c) 1.6px,transparent 2.2px) 0 0 / var(--pt-s) var(--pt-s)}
.v23-pt--diagonales{--pt-a:calc(.2 * var(--pt-m,1))}
body.light .v23-pt--diagonales{--pt-a:calc(.26 * var(--pt-m,1))}
.v23-pt--diagonales i{background:linear-gradient(135deg,transparent calc(50% - .6px),var(--pt-c) 50%,transparent calc(50% + .6px)) 0 0 / var(--pt-s) var(--pt-s)}
.v23-pt--horizontales{--pt-a:calc(.18 * var(--pt-m,1))}
body.light .v23-pt--horizontales{--pt-a:calc(.24 * var(--pt-m,1))}
.v23-pt--horizontales i{background:linear-gradient(var(--pt-c) 1px,transparent 1px) 0 0 / 100% var(--pt-s)}
.v23-pt--ajedrez{--pt-a:calc(.07 * var(--pt-m,1))}
body.light .v23-pt--ajedrez{--pt-a:calc(.09 * var(--pt-m,1))}
.v23-pt--ajedrez i{background:conic-gradient(var(--pt-c) 25%,transparent 0 50%,var(--pt-c) 0 75%,transparent 0) 0 0 / var(--pt-s) var(--pt-s)}
.v23-pt--cruces i,.v23-pt--rombos i,.v23-pt--hexagonos i,.v23-pt--ondas i,.v23-pt--circulos i,.v23-pt--grano i{background:var(--pt-c);-webkit-mask-repeat:repeat;mask-repeat:repeat}
.v23-pt--cruces{--pt-a:calc(.3 * var(--pt-m,1))}
body.light .v23-pt--cruces{--pt-a:calc(.38 * var(--pt-m,1))}
.v23-pt--cruces i{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2740%27%20height=%2740%27%20viewBox=%270%200%2040%2040%27%3E%3Cpath%20d=%27M20%2013v14M13%2020h14%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%272%27/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2740%27%20height=%2740%27%20viewBox=%270%200%2040%2040%27%3E%3Cpath%20d=%27M20%2013v14M13%2020h14%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%272%27/%3E%3C/svg%3E");-webkit-mask-size:var(--pt-s) var(--pt-s);mask-size:var(--pt-s) var(--pt-s)}
.v23-pt--rombos i{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2740%27%20height=%2740%27%20viewBox=%270%200%2040%2040%27%3E%3Cpath%20d=%27M20%201.5L38.5%2020%2020%2038.5%201.5%2020Z%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%271.6%27/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2740%27%20height=%2740%27%20viewBox=%270%200%2040%2040%27%3E%3Cpath%20d=%27M20%201.5L38.5%2020%2020%2038.5%201.5%2020Z%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%271.6%27/%3E%3C/svg%3E");-webkit-mask-size:var(--pt-s) var(--pt-s);mask-size:var(--pt-s) var(--pt-s)}
.v23-pt--hexagonos i{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2756%27%20height=%27100%27%20viewBox=%270%200%2056%20100%27%3E%3Cpath%20d=%27M28%2066L0%2050L0%2016L28%200L56%2016L56%2050L28%2066L28%20100%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%272%27/%3E%3Cpath%20d=%27M28%200L28%2034L0%2050L0%2084L28%20100L56%2084L56%2050L28%2034%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%272%27/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2756%27%20height=%27100%27%20viewBox=%270%200%2056%20100%27%3E%3Cpath%20d=%27M28%2066L0%2050L0%2016L28%200L56%2016L56%2050L28%2066L28%20100%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%272%27/%3E%3Cpath%20d=%27M28%200L28%2034L0%2050L0%2084L28%20100L56%2084L56%2050L28%2034%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%272%27/%3E%3C/svg%3E");-webkit-mask-size:var(--pt-s) auto;mask-size:var(--pt-s) auto}
.v23-pt--ondas{--pt-a:calc(.22 * var(--pt-m,1))}
body.light .v23-pt--ondas{--pt-a:calc(.28 * var(--pt-m,1))}
.v23-pt--ondas i{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%27100%27%20height=%2724%27%20viewBox=%270%200%20100%2024%27%3E%3Cpath%20d=%27M0%2012Q25%201%2050%2012T100%2012%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%271.8%27/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%27100%27%20height=%2724%27%20viewBox=%270%200%20100%2024%27%3E%3Cpath%20d=%27M0%2012Q25%201%2050%2012T100%2012%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%271.8%27/%3E%3C/svg%3E");-webkit-mask-size:var(--pt-s) auto;mask-size:var(--pt-s) auto}
.v23-pt--circulos i{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2740%27%20height=%2740%27%20viewBox=%270%200%2040%2040%27%3E%3Ccircle%20cx=%2720%27%20cy=%2720%27%20r=%2713.5%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%271.6%27/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%2740%27%20height=%2740%27%20viewBox=%270%200%2040%2040%27%3E%3Ccircle%20cx=%2720%27%20cy=%2720%27%20r=%2713.5%27%20stroke=%27%23000%27%20fill=%27none%27%20stroke-width=%271.6%27/%3E%3C/svg%3E");-webkit-mask-size:var(--pt-s) var(--pt-s);mask-size:var(--pt-s) var(--pt-s)}
.v23-pt--grano{--pt-a:calc(.16 * var(--pt-m,1))}
body.light .v23-pt--grano{--pt-a:calc(.22 * var(--pt-m,1))}
.v23-pt--grano i{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%27160%27%20height=%27160%27%20viewBox=%270%200%20160%20160%27%3E%3Cfilter%20id=%27n%27%20x=%270%27%20y=%270%27%20width=%27100%25%27%20height=%27100%25%27%3E%3CfeTurbulence%20type=%27fractalNoise%27%20baseFrequency=%27.85%27%20numOctaves=%272%27%20stitchTiles=%27stitch%27/%3E%3CfeColorMatrix%20values=%270%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%201.6%20-.3%27/%3E%3C/filter%3E%3Crect%20width=%27160%27%20height=%27160%27%20filter=%27url%28%23n%29%27/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20width=%27160%27%20height=%27160%27%20viewBox=%270%200%20160%20160%27%3E%3Cfilter%20id=%27n%27%20x=%270%27%20y=%270%27%20width=%27100%25%27%20height=%27100%25%27%3E%3CfeTurbulence%20type=%27fractalNoise%27%20baseFrequency=%27.85%27%20numOctaves=%272%27%20stitchTiles=%27stitch%27/%3E%3CfeColorMatrix%20values=%270%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%201.6%20-.3%27/%3E%3C/filter%3E%3Crect%20width=%27160%27%20height=%27160%27%20filter=%27url%28%23n%29%27/%3E%3C/svg%3E");-webkit-mask-size:160px 160px;mask-size:160px 160px}

/* ==========================================================================
   Biblioteca de iconos (inc/icons.php): línea, sólido, duotono y color.
   ========================================================================== */
.v23-ic{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.15em;fill:currentColor;overflow:visible}
.v23-ct-ico .v23-ic{width:1.45em;height:1.45em;vertical-align:middle;color:var(--on-accent)}
.v23-ct--icon-sin_caja .v23-ct-ico .v23-ic{width:1em;height:1em;color:var(--accent)}
.v23-st-ico .v23-ic{width:1em;height:1em;vertical-align:top;color:var(--accent)}
.v23-pr-num .v23-ic{width:1em;height:1em;vertical-align:middle}
.tab-btn .v23-ic{width:1.1em;height:1.1em;vertical-align:-.2em;margin-inline-end:.1em}
.v23-mq-item:has(> .v23-ic){gap:.4em}
.v23-mq-item .v23-ic{vertical-align:-.12em}

/* Pulse dot */
.pulse-dot{position:relative;width:10px;height:10px;border-radius:50%;background:var(--accent2)}
.pulse-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--accent2);animation:v23pulse 1.8s infinite}
@keyframes v23pulse{0%{transform:scale(1);opacity:.8}100%{transform:scale(2);opacity:0}}

/* Industrias que potenciamos (carrusel continuo de texto o de logos)
   Personalizar → Virtual23 → «Industrias · Contenido» / «Industrias · Diseño y movimiento».
   La caja .marquee mide exactamente lo que miden sus dos mitades (width:max-content) y
   el relleno de la derecha iguala el espacio entre elementos: así la mitad de la caja es
   justo un ciclo completo y, al desplazarse -50%, el bucle no tiene saltos ni huecos
   vacíos sin importar lo ancha que sea la pantalla (theme.js añade copias si una mitad
   fuera más estrecha que la pantalla y ajusta la duración a la velocidad elegida).
   Variables de la sección: --mq-fs --mq-pad --mq-gap --mq-op --mq-fade --mq-logo-h
   --mq-dir --mq-dur (en línea, desde PHP) y --mq-bg --mq-txt --mq-title (por modo). */
.v23-mq{position:relative;padding-block:var(--mq-pad,2.5rem);background:var(--mq-bg,transparent);transition:background .5s}
.v23-mq.has-lines{border-block:1px solid var(--border)}
.v23-mq-title{margin:0 0 1.5rem;text-align:center;font-size:.75rem;line-height:1rem;text-transform:uppercase;letter-spacing:.1em;color:var(--mq-title,var(--muted));transition:color .5s}
.v23-mq-viewport{overflow:hidden}
.v23-mq.has-fade .v23-mq-viewport{-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--mq-fade,8%),#000 calc(100% - var(--mq-fade,8%)),transparent);mask-image:linear-gradient(90deg,transparent,#000 var(--mq-fade,8%),#000 calc(100% - var(--mq-fade,8%)),transparent)}

.marquee{display:flex;gap:var(--mq-gap,3rem);width:max-content;padding-right:var(--mq-gap,3rem);animation:v23scroll var(--mq-dur,180s) linear infinite;animation-direction:var(--mq-dir,normal)}
@keyframes v23scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee-half{display:flex;flex:none;align-items:center;gap:var(--mq-gap,3rem);margin:0;padding:0;list-style:none;white-space:nowrap}
.v23-mq-li{display:flex;flex:none;margin:0;padding:0}

.v23-mq-item{display:inline-flex;align-items:center;font-weight:700;font-size:var(--mq-fs,1.5rem);line-height:1.3333;color:var(--mq-txt,var(--text));opacity:var(--mq-op,.3);text-decoration:none;transition:opacity .25s,color .25s,border-color .25s,background .25s}
.v23-mq-link:hover,.v23-mq-link:focus-visible{opacity:1}
.v23-mq-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px}

/* Estilo «píldora» */
.v23-mq--pildora .v23-mq-item{font-size:calc(var(--mq-fs,1.5rem) * .75);padding:.5em 1.25em;border:1px solid var(--border-strong);border-radius:999px;background:var(--card)}
.v23-mq--pildora .v23-mq-link:hover{border-color:var(--accent)}
/* Estilo «separador»: un punto entre cada elemento */
.v23-mq--separador .v23-mq-li{position:relative}
.v23-mq--separador .v23-mq-li::after{content:"";position:absolute;top:50%;left:calc(100% + var(--mq-gap,3rem) / 2);width:6px;height:6px;border-radius:50%;background:var(--mq-txt,var(--text));opacity:calc(var(--mq-op,.3) * .8);transform:translate(-50%,-50%)}

/* Logos */
.v23-mq--logos .v23-mq-item{opacity:var(--mq-logo-op,.8)}
.v23-mq--logos .v23-mq-link:hover,.v23-mq--logos .v23-mq-li:hover .v23-mq-item{opacity:1}
.v23-mq-logo{display:block;height:var(--mq-logo-h,40px);width:auto;max-width:none;object-fit:contain;transition:filter .25s}
.v23-mq-fx-gris .v23-mq-logo{filter:grayscale(1)}
.v23-mq-fx-silueta .v23-mq-logo{filter:brightness(0) invert(1)}
body.light .v23-mq-fx-silueta .v23-mq-logo{filter:brightness(0)}
.v23-mq-fx-gris .v23-mq-li:hover .v23-mq-logo,.v23-mq-fx-silueta .v23-mq-li:hover .v23-mq-logo,body.light .v23-mq-fx-silueta .v23-mq-li:hover .v23-mq-logo{filter:none}

/* Pausa: al pasar el cursor, al usar el teclado dentro y con el botón opcional */
.v23-mq.has-hover-pause .v23-mq-viewport:hover .marquee,.v23-mq-viewport:focus-within .marquee,.v23-mq.is-paused .marquee{animation-play-state:paused}
.v23-mq-pause{position:absolute;top:.5rem;right:1rem;z-index:2;display:grid;place-items:center;width:2rem;height:2rem;padding:0;border-radius:50%;background:var(--card);border:1px solid var(--border-strong);color:var(--mq-title,var(--muted));cursor:pointer;transition:color .2s,border-color .2s}
.v23-mq-pause:hover{color:var(--text);border-color:var(--accent)}
.v23-mq-pause:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.v23-mq-pause .v23-ico{width:14px;height:14px}
.v23-mq-ico-play{display:none}
.v23-mq-pause[aria-pressed="true"] .v23-mq-ico-pause{display:none}
.v23-mq-pause[aria-pressed="true"] .v23-mq-ico-play{display:block}

/* Sin movimiento (opción «Fijo» o «reducir movimiento» del dispositivo): filas centradas */
.v23-mq.is-static .marquee{animation:none;width:auto;padding-inline:1.5rem;justify-content:center}
.v23-mq.is-static .marquee-half{flex:0 1 auto;flex-wrap:wrap;justify-content:center;gap:1rem min(var(--mq-gap,3rem),2rem);white-space:normal}
@media (max-width:640px){.v23-mq.is-static .marquee-half{column-gap:.75rem}}
.v23-mq.is-static .v23-mq-li::after{display:none}

/* Efectos de scroll
   Los elige Apariencia → Personalizar → Virtual23 → Apariencia general → Efectos de
   scroll; el tema añade al <body> la clase v23-fx-{efecto}. Para sumar otro efecto
   basta con definir aquí su bloque body.v23-fx-{nombre} .reveal{...}.
   "none" no necesita CSS: sin clase de efecto, .reveal no oculta nada. */
body.v23-fx-fade .reveal:not(.visible){opacity:0}
body.v23-fx-fade .reveal.visible{animation:v23fade .9s ease both}
@keyframes v23fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  body.v23-fx-fade .reveal:not(.visible){opacity:1}
  body.v23-fx-fade .reveal.visible{animation:none}
  .marquee{animation:none;width:auto;padding-inline:1.5rem;justify-content:center}
  .marquee-half{flex:0 1 auto;flex-wrap:wrap;justify-content:center;gap:1rem min(var(--mq-gap,3rem),2rem);white-space:normal}
  @media (max-width:640px){.marquee-half{column-gap:.75rem}}
  .marquee-half--dup,.marquee-dup,.v23-mq-pause{display:none}
  .v23-mq-li::after{display:none}
  .aurora::before,.aurora::after,.aurora span,.float-badge{animation:none}
  .v23-fx::before,.v23-fx::after,.v23-fx i,.v23-pt-move i{animation:none!important}
}

/* Fields */
.field{background:var(--card);border:1px solid var(--border);color:var(--text);padding:14px 16px;border-radius:12px;width:100%;transition:border-color .2s,background .2s,color .5s}
.field:focus{outline:none;border-color:var(--accent);background:rgba(var(--accent-rgb),.08)}
.field::placeholder{color:var(--muted)}
.field option{background:var(--bg2);color:var(--text);padding:8px}

/* Navbar */
.nav-link{position:relative;color:var(--muted);transition:color .2s}
.nav-link:hover{color:var(--text)}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent2));transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav-link:hover::after{transform:scaleX(1)}

/* Floating badge */
.float-badge{animation:v23floatBadge 4s ease-in-out infinite}
@keyframes v23floatBadge{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* Stat counter */
.stat-num{background:linear-gradient(180deg,var(--text),var(--accent-soft));-webkit-background-clip:text;background-clip:text;color:transparent}

/* Scrollbar */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--accent),var(--accent2));border-radius:10px}

/* Theme toggle */
.theme-toggle{width:42px;height:42px;border-radius:12px;background:var(--card);border:1px solid var(--border);display:grid;place-items:center;cursor:pointer;transition:all .3s;color:var(--text)}
.theme-toggle:hover{border-color:var(--accent);transform:rotate(15deg)}
.theme-toggle svg{transition:transform .5s}

/* Contact icons */
.contact-icon{background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 6px 16px -6px rgba(var(--accent-rgb),.5)}

/* =====================================================================
   Pie de página
   Columnas por tipo, barra inferior y redes (inc/footer-functions.php).
   Colores: --ft-* se definen por modo en el Personalizador; sin elegir valen
   «initial» y se usa el respaldo de cada var().
   ===================================================================== */
:where(.v23-ft) a{color:inherit;text-decoration:none}
.v23-ft{position:relative;padding:var(--ft-pad-y,3rem) 0;border-top:1px solid var(--ft-line,var(--border));background-color:var(--ft-bg,var(--bg));background-image:linear-gradient(180deg,transparent,var(--ft-bg2,transparent))}
.v23-ft--noborder{border-top:0}
.v23-ft-in{max-width:var(--ft-maxw,80rem);margin:0 auto;padding:0 1.5rem}
.v23-ft-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ft-gap,2rem)}
@media (min-width:768px){.v23-ft-grid{grid-template-columns:var(--ft-cols,repeat(4,minmax(0,1fr)))}}
.v23-ft-empty{margin:0;text-align:center;font-size:.875rem;color:var(--ft-txt,var(--muted))}

.v23-ft-title{margin-bottom:.75rem;font-size:.875rem;line-height:1.25rem;font-weight:600;color:var(--ft-title,var(--text))}
.v23-ft--title-mayus .v23-ft-title{font-size:.75rem;line-height:1rem;text-transform:uppercase;letter-spacing:.09em}
.v23-ft--title-acento .v23-ft-title::after{content:"";display:block;width:2rem;height:3px;margin-top:.45rem;border-radius:3px;background:linear-gradient(90deg,var(--accent),var(--accent2))}
.v23-ft-text{margin:0;font-size:.875rem;line-height:1.25rem;color:var(--ft-txt,var(--muted))}
.v23-ft .widget{font-size:.875rem;line-height:1.5;color:var(--ft-txt,var(--text))}
.v23-ft .widget ul{margin:0;padding:0;list-style:none}
.v23-ft .widget a:hover{color:var(--ft-hov,var(--text))}

.v23-ft-brand{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}
.v23-ft-brand:last-child{margin-bottom:0}
.v23-ft-badge{box-sizing:border-box;display:grid;place-items:center;flex:none;height:var(--ft-logo-h,40px);min-width:var(--ft-logo-h,40px);padding:0 calc(var(--ft-logo-h,40px)*.06);border-radius:.75rem;font-weight:900;font-size:calc(var(--ft-logo-h,40px)*.4);line-height:1.5;color:var(--on-accent,#fff)}
.v23-ft-logo{display:block;width:auto;height:var(--ft-logo-h,40px);max-width:220px;object-fit:contain}
.v23-ft-name{font-weight:700;line-height:1.5rem;color:var(--ft-title,var(--text))}

.v23-ft-links,.v23-ft-contact{margin:0;padding:0;list-style:none;font-size:.875rem;line-height:1.25rem;color:var(--ft-link,var(--muted))}
.v23-ft-links li+li{margin-top:.5rem}
.v23-ft-links a,.v23-ft-contact a,.v23-ft-legal a{transition:color .2s}
.v23-ft-links a:hover,.v23-ft-contact a:hover,.v23-ft-legal a:hover{color:var(--ft-hov,var(--text))}
.v23-ft-contact li{display:flex;align-items:flex-start;gap:.6rem}
.v23-ft-contact li+li{margin-top:.65rem}
.v23-ft-ci{display:inline-grid;place-items:center;flex:none;width:1.4rem;height:1.4rem;line-height:1;color:var(--accent-soft)}
.v23-ft-ci .v23-ic{width:1.15rem;height:1.15rem}
.v23-ft-cl{font-weight:600}

.v23-ft-btn{display:inline-flex;align-items:center;margin-top:1rem;padding:.55rem 1.1rem;border-radius:999px;font-size:.875rem;font-weight:600;line-height:1.25rem;color:var(--on-accent,#fff);background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 8px 20px -8px rgba(var(--accent-rgb),.55);transition:transform .2s,filter .2s}
.v23-ft-btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.v23-ft-text+.v23-ft-btn{margin-top:1rem}

.v23-ft-img,.v23-ft-video{display:block;max-width:100%;height:auto;border-radius:.5rem}
.v23-ft-audio{display:block;width:100%;max-width:100%}
.v23-ft-col--media>*+*{margin-top:1rem}

/* Redes sociales */
.v23-ft-social{display:flex;flex-wrap:wrap;gap:.75rem}
.v23-ft-social a{display:grid;place-items:center;width:var(--ft-soc,2.5rem);height:var(--ft-soc,2.5rem);border-radius:.5rem;background:var(--ft-ibg,var(--card));border:1px solid var(--border);backdrop-filter:blur(10px);color:var(--ft-itxt,var(--text));transition:all .3s}
.v23-ft-social a:hover{border-color:var(--ft-ihov,var(--accent))}
.v23-ft-social .v23-ic{width:calc(var(--ft-soc,2.5rem)*.5);height:calc(var(--ft-soc,2.5rem)*.5)}
body.light .v23-ft-social a{background:var(--ft-ibg,linear-gradient(135deg,var(--deep-1),var(--deep-2)));border-color:rgba(var(--accent-rgb),.3);color:var(--ft-itxt,#fff)}
body.light .v23-ft-social a:hover{border-color:var(--ft-ihov,var(--accent));background:var(--ft-ibg,linear-gradient(135deg,var(--deep-2),var(--deep-3)))}
.v23-ft--soc-circulo .v23-ft-social a{border-radius:50%}
.v23-ft--soc-sin_caja .v23-ft-social a{width:auto;height:auto;padding:.2rem;border:0!important;border-radius:0;background:none!important;backdrop-filter:none;color:var(--ft-itxt,var(--text))!important}
.v23-ft--soc-sin_caja .v23-ft-social a:hover{color:var(--ft-ihov,var(--accent))!important}

/* Barra inferior */
.v23-ft-bottom{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin:2.5rem -1.5rem 0;padding:1.5rem 1.5rem 0;border-top:1px solid var(--ft-line,var(--border));text-align:center;font-size:.75rem;line-height:1rem;color:var(--ft-copy,var(--muted))}
.v23-ft-in>.v23-ft-bottom:first-child{margin-top:0;padding-top:0;border-top:0}
.v23-ft-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem 1.25rem}
@media (min-width:768px){.v23-ft-bottom--separado{flex-direction:row;justify-content:space-between;text-align:left}}

/* Alineación centrada */
.v23-ft--align-centro .v23-ft-grid{text-align:center}
.v23-ft--align-centro .v23-ft-brand,.v23-ft--align-centro .v23-ft-social,.v23-ft--align-centro .v23-ft-contact li{justify-content:center}
.v23-ft--align-centro .v23-ft-title::after{margin-left:auto;margin-right:auto}
.v23-ft--align-centro .v23-ft-img,.v23-ft--align-centro .v23-ft-video,.v23-ft--align-centro .v23-ft-audio{margin-left:auto;margin-right:auto}

/* Logo badge */
.logo-badge{background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 8px 20px -6px rgba(var(--accent-rgb),.5)}

/* Transitions */
header,.glass,footer,.service-card,.mockup,.field{transition:background .5s ease,border-color .3s ease,color .5s ease}
header{background:var(--nav-bg)}
footer{background:var(--bg)}

/* Generic icon fallback (cuando una Solución no define SVG propio) */
.v23-generic-icon{width:28px;height:28px}

/* Vista previa personalizada (imagen propia o HTML/iframe) */
.v23-preview-image img{border-radius:16px;display:block;width:100%}
.v23-preview-html iframe{width:100%;min-height:360px;border:0;border-radius:16px;background:#fff}

/* Mensaje del formulario de contacto */
.v23-notice{border-radius:12px;padding:12px 16px;margin-bottom:16px;font-size:.875rem}
.v23-notice-ok{background:rgba(52,211,153,.15);color:#34d399;border:1px solid rgba(52,211,153,.3)}
.v23-notice-error{background:rgba(255,80,80,.12);color:#ff6b6b;border:1px solid rgba(255,80,80,.3)}

/* Accesibilidad */
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}

/* Widget de footer */
.widget{margin-bottom:0}

/* =====================================================================
   CABECERA · TOPBAR · MENÚ · COLUMNA LATERAL · BOTÓN «SOLICITAR DEMO»
   Todo se controla desde Personalizar → Virtual23 → Menú · …
   Los colores salen de las variables que imprime el Personalizador:
   --hdr-bg, --menu-txt, --menu-hov, --menu-txt-t, --menu-hov-t,
   --topbar-bg, --topbar-txt, --drawer-*, --cta-* y --logo-h.
   ===================================================================== */
html{scroll-padding-top:calc(var(--v23-header-h,76px) + 8px)}

.v23-skip{position:absolute;left:-9999px;top:0;z-index:100002;background:var(--accent);color:var(--on-accent);padding:.7rem 1.2rem;border-radius:0 0 10px 0;font-weight:600}
.v23-skip:focus{left:0}

.v23-ico{width:16px;height:16px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---- Cabecera ---- */
.v23-header{position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;transition:transform .35s ease,box-shadow .3s ease}
.v23-header::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--hdr-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:background .4s ease}
.v23-header.has-line{border-bottom:1px solid rgba(var(--text-rgb),.06)}
.v23-header.is-scrolled{box-shadow:0 12px 30px -22px var(--shadow-color)}
.v23-header--oculta.is-hidden{transform:translateY(-100%)}
.v23-header--transp:not(.is-scrolled){box-shadow:none;border-bottom-color:transparent}
.v23-header--transp:not(.is-scrolled)::before{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}

.v23-nav{max-width:80rem;margin:0 auto;padding:1rem 1.5rem;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:1rem;transition:padding .3s ease}
.v23-slot{display:flex;align-items:center;gap:.9rem;min-width:0}
.v23-slot--l{justify-self:start}
.v23-slot--c{justify-self:center}
.v23-slot--r{justify-self:end}
.v23-header--comprime.is-scrolled .v23-nav{padding-top:.45rem;padding-bottom:.45rem}
.v23-header--comprime.is-scrolled .v23-logo-img{height:calc(var(--logo-h,40px)*.78)}
.v23-header--comprime.is-scrolled .v23-logo-badge{height:calc(var(--logo-h,40px)*.78);min-width:calc(var(--logo-h,40px)*.78)}

/* ---- Logo y letras ---- */
.v23-brand{display:inline-flex;align-items:center;gap:.6rem;min-width:0;color:var(--text)}
.v23-brand--logo_der{flex-direction:row-reverse}
.v23-brand--apilado{flex-direction:column;gap:.3rem;text-align:center}
.v23-brand--apilado .v23-brand-text{align-items:center}
.v23-logo-img{display:block;height:var(--logo-h,40px);width:auto;max-width:240px;object-fit:contain;transition:height .3s ease}
.v23-logo-badge{display:grid;place-items:center;height:var(--logo-h,40px);min-width:var(--logo-h,40px);padding:0 .45rem;border-radius:12px;font-weight:900;font-size:calc(var(--logo-h,40px)*.42);color:var(--on-accent);flex-shrink:0;transition:height .3s ease,min-width .3s ease}
.v23-brand-text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.v23-brand-name{font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v23-brand-tag{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}

/* ---- Enlaces del menú (barra) ---- */
.v23-menu-wrap{display:block}
.v23-menu{display:flex;align-items:center;gap:2rem;list-style:none;margin:0;padding:0;font-size:.875rem}
.v23-menu li{position:relative}
.v23-menu .nav-link,.v23-drawer-menu .nav-link{display:inline-block}
.v23-menu .nav-link{color:var(--menu-txt,var(--muted));white-space:nowrap}
.v23-menu .nav-link:hover,.v23-menu .nav-link:focus-visible,
.v23-menu .is-active>.nav-link,.v23-menu .current-menu-item>.nav-link,.v23-menu .current-menu-ancestor>.nav-link{color:var(--menu-hov,var(--text))}
.v23-menu .is-active>.nav-link::after,.v23-menu .current-menu-item>.nav-link::after{transform:scaleX(1)}
/* Con scroll-spy activo, «página actual» deja de resaltarse si otra sección es la visible */
.v23-menu.has-spy .current-menu-item:not(.is-active)>.nav-link{color:var(--menu-txt,var(--muted))}
.v23-menu.has-spy .current-menu-item:not(.is-active)>.nav-link::after{transform:scaleX(0)}
.v23-menu.has-spy .current-menu-item:not(.is-active)>.nav-link:hover{color:var(--menu-hov,var(--text))}
.v23-drawer-menu.has-spy .current-menu-item:not(.is-active)>.nav-link{color:var(--drawer-txt,#fff);background:transparent;padding-left:.7rem}
.v23-header--transp:not(.is-scrolled) .v23-menu .nav-link{color:var(--menu-txt-t,var(--text))}
/* Con el menú transparente, logo, letras, hamburguesa y botón de modo toman el mismo color de «Texto e iconos» */
.v23-header--transp:not(.is-scrolled) .v23-brand,
.v23-header--transp:not(.is-scrolled) .v23-brand-name{color:var(--menu-txt-t,var(--text))}
.v23-header--transp:not(.is-scrolled) .v23-brand-tag{color:var(--menu-txt-t,var(--muted));opacity:.8}
.v23-header--transp:not(.is-scrolled) .v23-burger,
.v23-header--transp:not(.is-scrolled) .theme-toggle{background:transparent;color:var(--menu-txt-t,var(--text));border-color:color-mix(in srgb,currentColor 35%,transparent)}
.v23-header--transp:not(.is-scrolled) .v23-menu .nav-link:hover,
.v23-header--transp:not(.is-scrolled) .v23-menu .is-active>.nav-link{color:var(--menu-hov-t,var(--accent2))}

/* Submenús desplegables (hasta 2 niveles) */
.v23-menu .menu-item-has-children>.nav-link{padding-right:.1rem}
.v23-menu .menu-item-has-children::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px}
.v23-menu .sub-menu{position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%,8px);min-width:210px;margin:0;padding:.5rem;list-style:none;background:var(--bg2);border:1px solid var(--border);border-radius:14px;box-shadow:0 24px 44px -22px var(--shadow-color);opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility .2s}
.v23-menu .menu-item-has-children:hover>.sub-menu,.v23-menu .menu-item-has-children:focus-within>.sub-menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.v23-menu .sub-menu .nav-link{display:block;padding:.55rem .8rem;border-radius:9px}
.v23-menu .sub-menu .nav-link::after{display:none}
.v23-menu .sub-menu .nav-link:hover{background:rgba(var(--accent-rgb),.12)}

/* ---- Hamburguesa ---- */
.v23-burger{display:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;width:42px;height:42px;padding:0;border-radius:12px;background:var(--card);border:1px solid var(--border);color:var(--text);cursor:pointer;transition:border-color .3s,transform .3s}
.v23-burger:hover{border-color:var(--accent)}
.v23-burger span{display:block;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .3s ease,opacity .3s ease}
.v23-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.v23-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.v23-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.v23-ham .v23-burger{display:inline-flex}
.v23-ham .v23-menu-wrap{display:none}

/* ---- Botones de la derecha (modo + «Solicitar demo») ---- */
.v23-actions{display:flex;align-items:center;gap:.75rem}

.v23-cta{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;font-weight:700;line-height:1.2;white-space:nowrap;border:1.5px solid transparent;cursor:pointer;transition:transform .2s,box-shadow .2s,filter .2s,background .2s,color .2s,border-color .2s}
.v23-cta .v23-ico{width:1.05em;height:1.05em}
.v23-cta--sm{padding:.5rem 1rem;font-size:.8rem}
.v23-cta--md{padding:.65rem 1.25rem;font-size:.875rem}
.v23-cta--lg{padding:.85rem 1.7rem;font-size:1rem}
.v23-cta--cuadrado{border-radius:6px}
.v23-cta--redondeado{border-radius:12px}
.v23-cta--pastilla{border-radius:999px}
.v23-cta--degradado{background:linear-gradient(90deg,var(--cta-c1,var(--accent)),var(--cta-c2,var(--accent2)));background-origin:border-box;color:var(--cta-txt,var(--on-accent));box-shadow:0 10px 30px -10px rgba(var(--accent-rgb),.6)}
.v23-cta--solido{background:var(--cta-c1,var(--accent));color:var(--cta-txt,var(--on-accent));box-shadow:0 10px 30px -12px rgba(var(--accent-rgb),.55)}
.v23-cta--contorno{background:transparent;color:var(--cta-c1,var(--accent));border-color:var(--cta-c1,var(--accent))}
.v23-cta--contorno:hover{background:var(--cta-c1,var(--accent));color:var(--cta-txt,var(--on-accent))}
.v23-cta--suave{background:color-mix(in srgb,var(--cta-c1,var(--accent)) 16%,transparent);color:var(--cta-c1,var(--accent))}
.v23-cta--hover-elevar:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px rgba(var(--accent-rgb),.75)}
.v23-cta--hover-brillo:hover{filter:brightness(1.14)}
.v23-cta--degradado:hover,.v23-cta--solido:hover{color:var(--cta-txt,var(--on-accent))}
.v23-cta--suave:hover{color:var(--cta-c1,var(--accent))}

/* ---- Topbar ---- */
.v23-topbar{background:var(--topbar-bg);color:var(--topbar-txt);font-size:.8rem;border-bottom:1px solid rgba(var(--text-rgb),.06);max-height:60px;overflow:hidden;transition:max-height .3s ease,opacity .3s ease,border-color .3s ease,background .4s ease}
.v23-topbar-in{max-width:80rem;margin:0 auto;padding:.45rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem 1.25rem;flex-wrap:wrap}
.v23-topbar--centro .v23-topbar-in{justify-content:center}
.v23-topbar-l,.v23-topbar-r{display:flex;align-items:center;gap:.4rem 1.1rem;flex-wrap:wrap}
.v23-topbar-l:only-child,.v23-topbar-r:only-child{margin:0 auto}
.v23-topbar a,.v23-topbar-item{display:inline-flex;align-items:center;gap:.4rem;color:var(--topbar-txt);transition:opacity .2s}
.v23-topbar a:hover{opacity:.7}
.v23-topbar-social{display:flex;gap:.35rem}
.v23-topbar-social a{width:26px;height:26px;justify-content:center;border-radius:8px}
.v23-topbar-social a:hover{background:rgba(var(--accent-rgb),.16);opacity:1}
.v23-topbar-social .v23-ic{width:15px;height:15px}
.v23-topbar-html a{text-decoration:underline;text-underline-offset:3px}
.v23-header.is-scrolled .v23-topbar--collapse{max-height:0;opacity:0;border-color:transparent}
.v23-header--transp:not(.is-scrolled) .v23-topbar{background:transparent;border-color:transparent}
.v23-header--transp:not(.is-scrolled) .v23-topbar,
.v23-header--transp:not(.is-scrolled) .v23-topbar a{color:var(--menu-txt-t,var(--text))}

/* ---- Columna lateral (hamburguesa) ---- */
.v23-backdrop{position:fixed;inset:0;z-index:99990;background:rgba(3,4,14,.64);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease}
.v23-backdrop.is-open{opacity:1;visibility:visible}
body.v23-drawer-open{overflow:hidden}

.v23-drawer{position:fixed;top:0;bottom:0;z-index:99991;width:var(--drawer-w,300px);max-width:88vw;display:flex;flex-direction:column;overflow-y:auto;background:var(--drawer-bg);color:var(--drawer-txt,#fff);visibility:hidden;transition:transform .38s cubic-bezier(.25,1,.5,1),visibility 0s linear .38s,box-shadow .38s ease}
.v23-drawer--izquierda{left:0;transform:translateX(-102%);border-right:1px solid var(--drawer-line)}
.v23-drawer--derecha{right:0;transform:translateX(102%);border-left:1px solid var(--drawer-line)}
.v23-drawer.is-open{transform:none;visibility:visible;box-shadow:0 0 60px rgba(0,0,0,.5);transition:transform .38s cubic-bezier(.25,1,.5,1),visibility 0s,box-shadow .38s ease}

.v23-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.25rem;border-bottom:1px solid var(--drawer-line)}
.v23-drawer .v23-brand,.v23-drawer .v23-brand-name{color:var(--drawer-txt,#fff)}
.v23-drawer .v23-logo-img{height:34px}
.v23-drawer .v23-logo-badge{height:34px;min-width:34px;font-size:14px}
.v23-drawer-close{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);border:0;color:var(--drawer-txt,#fff);cursor:pointer;transition:background .2s}
.v23-drawer-close:hover{background:rgba(255,255,255,.2)}
.v23-drawer-close .v23-ico{width:20px;height:20px}

.v23-drawer-nav{flex:1}
.v23-drawer-menu{list-style:none;margin:0;padding:.75rem 1rem}
.v23-drawer-menu .nav-link{display:block;padding:.75rem .7rem;border-radius:10px;border-bottom:1px solid var(--drawer-line);font-size:1.02rem;font-weight:600;color:var(--drawer-txt,#fff);transition:background .2s,color .2s,padding .2s}
.v23-drawer-menu .nav-link::after{display:none}
.v23-drawer-menu .nav-link:hover,.v23-drawer-menu .nav-link:focus-visible,
.v23-drawer-menu .is-active>.nav-link,.v23-drawer-menu .current-menu-item>.nav-link{color:var(--drawer-hov);background:rgba(255,255,255,.08);padding-left:1rem}
.v23-drawer-menu .sub-menu{list-style:none;margin:0 0 .4rem;padding:0 0 0 1rem}
.v23-drawer-menu .sub-menu .nav-link{font-size:.92rem;font-weight:500;opacity:.92}

.v23-drawer-cta{padding:.25rem 1.25rem 1rem}
.v23-drawer-cta .v23-cta{width:100%}
.v23-drawer-foot{display:grid;gap:.95rem;padding:1.1rem 1.25rem 1.4rem;border-top:1px solid var(--drawer-line)}
.v23-drawer-html{font-size:.88rem;line-height:1.5;opacity:.92}
.v23-drawer-html a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.v23-drawer-html img{max-width:100%;height:auto;border-radius:10px}
.v23-drawer-contact{display:grid;gap:.55rem}
.v23-drawer-contact a{display:flex;align-items:center;gap:.6rem;font-size:.9rem;color:var(--drawer-txt,#fff)}
.v23-drawer-contact a:hover{color:var(--drawer-hov)}
.v23-drawer-social{display:flex;flex-wrap:wrap;gap:.6rem}
.v23-drawer-social a{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.12);color:var(--drawer-txt,#fff);transition:background .2s,color .2s}
.v23-drawer-social a:hover{background:var(--drawer-hov);color:#0b0d1f}
.v23-drawer-social .v23-ico,.v23-drawer-social .v23-ic{width:18px;height:18px}

/* ---- Botón «Subir al principio» ---- */
.v23-top{position:fixed;bottom:1.25rem;z-index:60;display:grid;place-items:center;width:46px;height:46px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:var(--on-accent);cursor:pointer;box-shadow:0 10px 24px -10px rgba(var(--accent-rgb),.7);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,visibility .3s,transform .3s}
.v23-top--derecha{right:1.25rem}
.v23-top--izquierda{left:1.25rem}
.v23-top.is-visible{opacity:1;visibility:visible;transform:none}
.v23-top .v23-ico{width:20px;height:20px}

/* ---- Pantallas pequeñas ---- */
@media (max-width:767px){
  .v23-burger{display:inline-flex}
  .v23-menu-wrap{display:none}
  .v23-nav{padding:.75rem 1rem}
  /* En móvil la barra pasa a flex: el logo cede espacio (con «…») y los botones nunca se solapan */
  .v23-nav:not(.v23-pos-centro),.v23-nav:has(.v23-cta--bar.show-mobile){display:flex;justify-content:space-between;gap:.6rem}
  .v23-nav:not(.v23-pos-centro) .v23-slot--c{display:none}
  .v23-slot{flex:0 1 auto;gap:.6rem}
  .v23-slot:has(.v23-actions),.v23-burger{flex-shrink:0}
  .v23-topbar--hide-mobile{display:none}
  .v23-topbar-in{justify-content:center;text-align:center;padding:.4rem 1rem}
  .v23-top--escritorio{display:none}
}
@media (max-width:639px){
  .v23-cta--bar{display:none}
  .v23-cta--bar.show-mobile{display:inline-flex;padding:.5rem .9rem;font-size:.8rem}
}
@media (max-width:479px){
  .v23-brand-tag{display:none}
}
@media (prefers-reduced-motion:reduce){
  .v23-header,.v23-header::before,.v23-drawer,.v23-backdrop,.v23-top,.v23-topbar,.v23-burger span{transition:none}
}

/* =====================================================================
   PORTADA (hero) — se controla desde Personalizar → Virtual23 → Portada
   Variables de la sección (las pone template-parts/section-hero.php):
   --hero-h --hero-bg-img --hero-bg-img-sm --hero-bg-pos --hero-ov-1/-2/-a/-angle
   --hero-hl-1/-2; y por modo: --hero-txt --hero-sub.
   ===================================================================== */
.v23-hero{position:relative;display:flex;align-items:center;overflow:hidden;min-height:calc(var(--hero-h,100)*1vh);padding:max(6rem,calc(var(--v23-header-h,75px) + 1.25rem)) 0 4rem}
.v23-hero:has(.v23-hero-down){padding-bottom:6rem}

/* Fondo con imagen + velo de color */
.v23-hero-bg{position:absolute;inset:0;background-image:var(--hero-bg-img-sm,var(--hero-bg-img));background-size:cover;background-position:var(--hero-bg-pos,center center);background-repeat:no-repeat}
@media (min-width:900px){.v23-hero-bg{background-image:var(--hero-bg-img)}}
@media (min-width:1024px) and (prefers-reduced-motion:no-preference){.v23-hero.is-parallax .v23-hero-bg{background-attachment:fixed}}
.v23-hero-ov{position:absolute;inset:0;background:linear-gradient(var(--hero-ov-angle,135deg),var(--hero-ov-1,var(--bg)),var(--hero-ov-2,var(--bg2)));opacity:var(--hero-ov-a,.6)}

/* Disposición */
.v23-hero-inner{width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:3rem;align-items:center}
@media (min-width:1024px){
  .v23-hero--izquierda .v23-hero-inner,.v23-hero--derecha .v23-hero-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v23-hero--derecha .v23-hero-copy{order:2}
  .v23-hero--derecha .v23-hero-visual-wrap{order:1}
}
.v23-hero--centrado .v23-hero-copy{max-width:48rem;margin:0 auto;text-align:center}
.v23-hero--centrado .v23-hero-actions,.v23-hero--centrado .v23-hero-proof{justify-content:center}
.v23-hero--centrado .v23-hero-text{margin-left:auto;margin-right:auto}
.v23-hero--centrado .v23-hero-visual-wrap{width:100%;max-width:56rem;margin:0 auto}

/* Textos */
.v23-hero-title{--k:1;margin:0 0 1.5rem;line-height:1.05;color:var(--hero-txt,var(--text))}
.v23-hero-title--sm{--k:.72}
.v23-hero-title--lg{--k:1.28}
/* El título nunca se sale de su columna: crece hasta su tamaño y se frena si la palabra más larga ya no cabe (8.2 ≈ ancho de «Transformamos» en em) */
.v23-hero-title{font-size:min(calc(3rem*var(--k)),calc((100vw - 3rem)/8.2))}
@media (min-width:768px){
  .v23-hero-title{font-size:min(calc(4.5rem*var(--k)),calc((min(100vw,80rem) - 3rem)/8.2))}
}
@media (min-width:1024px){
  .v23-hero--izquierda .v23-hero-title,.v23-hero--derecha .v23-hero-title{font-size:min(calc(4.5rem*var(--k)),calc((min(100vw,80rem) - 6rem)/2/8.2))}
}
.v23-hero-text,.v23-hero-muted,.v23-hero-proof{color:var(--hero-sub,var(--muted))}
.v23-hero-avatars>div{border-color:var(--bg)}
.v23-hero.has-hl .grad-text{background-image:linear-gradient(90deg,var(--hero-hl-1),var(--hero-hl-2))}

/* Visual con imagen propia */
.v23-hero-img{margin:0;border-radius:1.5rem;overflow:hidden;background:var(--bg2);border:1px solid var(--border-strong);box-shadow:0 30px 80px -30px rgba(var(--accent-rgb),.5),0 0 0 1px rgba(var(--accent-rgb),.15) inset}
.v23-hero-img img{display:block;width:100%;height:auto}

/* Flecha para bajar */
.v23-hero-down{position:absolute;left:50%;bottom:1.25rem;z-index:3;width:44px;height:44px;margin-left:-22px;display:grid;place-items:center;border-radius:50%;color:var(--hero-txt,var(--text));background:var(--card);border:1px solid var(--border-strong);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:v23bounce 2s ease-in-out infinite}
.v23-hero-down:hover{border-color:var(--accent)}
.v23-hero-down .v23-ico{width:20px;height:20px}
@keyframes v23bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* Animación de entrada (CSS puro: funciona aunque falle el JavaScript) */
@keyframes v23rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.v23-anim-subir .v23-hero-item{animation:v23rise .8s cubic-bezier(.2,.7,.2,1) both}
.v23-anim-aparecer .v23-hero-item{animation:v23fade .9s ease both}
.v23-hero-copy>.v23-hero-item:nth-child(2){animation-delay:.08s}
.v23-hero-copy>.v23-hero-item:nth-child(3){animation-delay:.16s}
.v23-hero-copy>.v23-hero-item:nth-child(4){animation-delay:.24s}
.v23-hero-copy>.v23-hero-item:nth-child(5){animation-delay:.32s}
.v23-hero-inner>.v23-hero-visual-wrap{animation-delay:.2s}
@media (prefers-reduced-motion:reduce){
  .v23-hero-item,.v23-hero-down{animation:none!important}
}