/* ==========================================================================
   WEEM · Familia de ventanas del sitio público (2026)
   Un solo lenguaje para todo lo que se abre encima de una página: WhatsApp
   previo, captación y salida, cotización de la calculadora, evaluador, video,
   «Quiero que me importen», acceso de la calculadora, la burbuja de WhatsApp,
   el aviso de cookies y la invitación a instalar. Cada página conserva sus IDs,
   campos y controladores; este archivo solo define apariencia y movimiento.

   Anatomía (docs/marca/DIRECCION-2026.md y HERRAMIENTAS-2026.md §10):
     cabecera  etiqueta en mono con la franja chica · título · cerrar de 44 px
     cuerpo    texto, preguntas con letra y campos
     pie       acción principal en el color de la sección + una secundaria

   Color: nunca un valor fijo de sección. --wd-accent lo redefine
   public/shared/site-shell.css según el menú (Importación rojo, Aplicaciones
   azul, Educación verde, Inversiones tinta); Inicio y las páginas sin sección
   quedan en el naranja de abajo. Los neutros son los de las páginas 2026
   (weem-ui.css): fondo, tarjeta y campo se distinguen en claro y en oscuro.

   Movimiento: la tarjeta entra con escala y opacidad (220 ms) y sale más
   rápido (140 ms). En el teléfono (<600 px) los diálogos son una tarjeta que baja
   arriba, debajo de la barra del navegador, con desplazamiento interno (lo pidió el dueño: arriba se ve mejor y el teclado no la tapa). Con movimiento reducido no se
   mueve nada. Solo se animan transform y opacity: la entrada es una animación
   y la salida una transición con «display … allow-discrete», sin tocar los
   controladores (sin soporte, cierra al instante).

   Las páginas públicas cargan además reglas antiguas con !important
   (weem-identity.css, learning.css, families.css). Por eso cada regla empieza
   con «html body» e incluye #serviceModal dentro de :is(): gana por
   especificidad sin depender del orden de carga.
   ========================================================================== */

:root{
  --wd-surface:#FFFFFF;--wd-raised:#F3F4F7;--wd-line:#D9DDE4;--wd-line-strong:#C5C9D2;
  --wd-field:#FFFFFF;--wd-field-line:#878D99;
  --wd-ink:#0B0D12;--wd-ink-2:#2E333C;--wd-muted:#50565F;
  --wd-accent:var(--weem-sec-solid,#C2410C);--wd-accent-ink:#FFFFFF;--wd-ok:#1E7A46;--wd-bad:#B42318;
  --wd-ring:rgba(194,65,12,.28);--wd-scrim:rgba(11,13,18,.46);
  --wd-shadow:0 1px 2px rgba(11,13,18,.06),0 2px 8px rgba(11,13,18,.04),0 32px 64px -24px rgba(11,13,18,.42);
  --wd-radius:16px;--wd-control:44px;--wd-field-radius:10px;
  --wd-font:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --wd-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --wd-ease:cubic-bezier(.16,1,.3,1);--wd-ease-out:cubic-bezier(.4,0,1,1);
  --wd-in:220ms;--wd-out:140ms;
}
html[data-theme=dark],html.dark{
  --wd-surface:#1A1D26;--wd-raised:#14171E;--wd-line:#303641;--wd-line-strong:#3F4551;
  --wd-field:#0F1116;--wd-field-line:#6B7280;
  --wd-ink:#ECEDEF;--wd-ink-2:#C9CBD1;--wd-muted:#A3A7B0;
  --wd-accent:#FF8A3D;--wd-accent-ink:#1A0D05;--wd-ok:#46D18C;--wd-bad:#FF6B6B;
  --wd-ring:rgba(255,138,61,.32);--wd-scrim:rgba(4,5,8,.66);
  --wd-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 32px 64px -20px rgba(0,0,0,.85);
}

/* --- Puente con la biblioteca única (/shared/weem-ui.css) ---------------
   Dentro de la tarjeta, los tokens --w-* toman la paleta del diálogo: .w-btn,
   .w-field, .w-input y compañía se ven como la familia sin reglas propias. */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog){
  --w-font:var(--wd-font);--w-font-mono:var(--wd-mono);
  --w-accent:var(--wd-accent);--w-accent-hover:color-mix(in srgb,var(--wd-accent) 86%,var(--wd-ink));
  --w-accent-ink:var(--wd-accent-ink);--w-accent-soft:var(--wd-ring);--w-accent-line:var(--wd-accent);
  --w-surface:var(--wd-surface);--w-surface-2:var(--wd-raised);--w-ink:var(--wd-ink);--w-ink-2:var(--wd-ink-2);--w-muted:var(--wd-muted);
  --w-line:var(--wd-line);--w-line-strong:var(--wd-line-strong);
  --w-ring:var(--wd-accent);--w-ring-offset:var(--wd-surface);
  --w-success:var(--wd-ok);--w-success-soft:color-mix(in srgb,var(--wd-ok) 14%,transparent);
  --w-danger:var(--wd-bad);--w-danger-soft:color-mix(in srgb,var(--wd-bad) 8%,transparent);
  --w-radius:var(--wd-field-radius);--w-h:var(--wd-control);--w-h-lg:52px;
  --w-shadow-accent:none;
}

/* --- Fondo: tinta translúcida con desenfoque suave --------------------- */
html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal){
  position:fixed!important;inset:0!important;z-index:10050!important;
  align-items:center!important;justify-content:center!important;
  padding:24px!important;overflow-y:auto!important;overscroll-behavior:contain;box-sizing:border-box!important;
  background:var(--wd-scrim)!important;
  -webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important;
}
html body .wd-overlay{display:none}
html body .wd-overlay.active{display:flex}
html body :is(.vm-overlay,#serviceModal) .vm-backdrop{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
/* El acceso de la calculadora: mismo fondo, siempre centrado (es corto). */
html body[data-content-template^=kit-] .modal-overlay:not(#_){background:var(--wd-scrim)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:10050}

/* --- Tarjeta ----------------------------------------------------------- */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog){
  box-sizing:border-box!important;position:relative!important;
  width:min(480px,100%)!important;max-width:480px!important;max-height:calc(100dvh - 48px)!important;
  margin:auto!important;padding:22px 24px 24px!important;overflow:auto!important;overscroll-behavior:contain;
  background:var(--wd-surface)!important;color:var(--wd-ink)!important;
  border:1px solid var(--wd-line)!important;border-radius:var(--wd-radius)!important;
  box-shadow:var(--wd-shadow)!important;
  font-family:var(--wd-font)!important;font-size:15px;line-height:1.5;text-align:left!important;
  opacity:1;transform:none;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div)::before{display:none!important}
html body .wd-card,html body .wd-card *,html body .wd-card *::before,html body .wd-card *::after{box-sizing:border-box}

/* --- Cabecera de las ventanas existentes -------------------------------
   La marca que agrega /presentation/dialogs.js (o la de cada página) pasa a
   ser la etiqueta en mono con la franja: el logo queda en el marcado, oculto. */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.weem-dialog-brand,[data-weem-dialog-brand],.popup-logo,.vm-brand){
  position:static!important;display:flex!important;align-items:center!important;gap:10px!important;
  width:auto!important;height:auto!important;min-height:24px!important;margin:0 56px 10px 0!important;padding:0!important;
  background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  font:500 11.5px/1.3 var(--wd-mono)!important;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--wd-muted)!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.weem-dialog-brand,[data-weem-dialog-brand],.popup-logo,.vm-brand)>*{display:none!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.weem-dialog-brand,[data-weem-dialog-brand],.popup-logo,.vm-brand)::before{
  content:''!important;display:block!important;position:static!important;flex:none;width:14px;height:9px;margin-left:3px;border-radius:1.5px;
  background:var(--wd-accent)!important;transform:skewX(-21deg);-webkit-mask:none!important;mask:none!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.weem-dialog-brand,[data-weem-dialog-brand],.popup-logo,.vm-brand)::after{
  content:'WEEM'!important;position:static!important;display:inline!important;inset:auto!important;background:none!important;-webkit-mask:none!important;mask:none!important;color:inherit!important;
}

/* Etiqueta según la ventana (las demás dicen «WEEM»). */
html body #exitOverlay .exit-popup :is(.weem-dialog-brand,[data-weem-dialog-brand])::after{content:'Formación IPCC'!important}
html body #leadOverlay>:is(.lead-popup,.exit-popup) :is(.weem-dialog-brand,[data-weem-dialog-brand])::after{content:'Información por WhatsApp'!important}
html body #serviceModal>div :is(.weem-dialog-brand,[data-weem-dialog-brand])::after{content:'Te lo traemos'!important}
html body #quoteOverlay>.lead-popup :is(.weem-dialog-brand,[data-weem-dialog-brand])::after{content:'Pedido de cotización'!important}
html body #leadPopup>.popup :is(.weem-dialog-brand,[data-weem-dialog-brand],.popup-logo)::after{content:'Guía para evaluar'!important}
html body #loginModal>.weem-dialog :is(.weem-dialog-brand,[data-weem-dialog-brand])::after{content:'Tu cuenta'!important}
/* Texto solo para lectores de pantalla. */
html body .wd-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- Título y descripción ---------------------------------------------- */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(h2,h3,.wd-title){
  font-family:var(--w-font)!important;font-size:22px!important;line-height:1.22!important;font-weight:650!important;letter-spacing:-.025em!important;
  color:var(--w-ink)!important;margin:0 48px 8px 0!important;padding:0!important;text-align:left!important;text-wrap:balance;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(h2,h3,.wd-title)+:is(p,.wd-desc),
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-desc,.subtitle,.vm-sub,.modal-sub){
  font-size:15px!important;line-height:1.5!important;color:var(--w-muted)!important;margin:0 0 20px!important;opacity:1!important;text-align:left!important;
}

/* --- Cerrar (área táctil de 44 px) ------------------------------------- */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-close,.lead-close,.exit-close,.popup-close,.vm-close,.weem-dialog-close,#serviceModal>div>button:first-child),
html body #serviceModal>div>button:first-child{
  position:absolute!important;top:12px!important;right:12px!important;left:auto!important;z-index:2!important;
  display:grid!important;place-items:center!important;box-sizing:border-box!important;
  width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;padding:0!important;margin:0!important;
  border:1px solid transparent!important;border-radius:10px!important;background:transparent!important;box-shadow:none!important;
  color:var(--w-muted)!important;font-size:22px!important;line-height:1!important;cursor:pointer;
  transition:background-color .15s ease,color .15s ease,transform .15s var(--wd-ease);
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-close,.lead-close,.exit-close,.popup-close,.vm-close,.weem-dialog-close,#serviceModal>div>button:first-child):hover,
html body #serviceModal>div>button:first-child:hover{background:var(--w-surface-2)!important;color:var(--w-ink)!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-close,.lead-close,.exit-close,.popup-close,.vm-close,.weem-dialog-close,#serviceModal>div>button:first-child):active{transform:scale(.94)}

/* --- Formulario -------------------------------------------------------- */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) form{display:flex!important;flex-direction:column!important;gap:14px!important;margin:0!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.popup-form-scroll,.vm-head,.vm-form){display:flex;flex-direction:column;gap:14px;max-height:none!important;overflow:visible!important;padding:0!important;flex:none!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.popup-form-scroll,.vm-head)>:is(h2,h3,p){margin-bottom:0!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) form div{margin-top:0!important;margin-bottom:0!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.row,.vm-row,.popup-form-scroll>div:first-child:has(>div+div),form>div:first-child:not(.popup-form-scroll):has(>div+div>label)){
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(label:not(.wd-pill),.wd-label,legend){
  display:block!important;font-family:var(--w-font)!important;font-size:13.5px!important;line-height:1.4!important;font-weight:600!important;
  letter-spacing:0!important;text-transform:none!important;color:var(--w-ink)!important;margin:0 0 6px!important;padding:0!important;opacity:1!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]):not(.wd-native),select,textarea){
  box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:100%!important;
  height:var(--w-h)!important;min-height:var(--w-h)!important;padding:0 12px!important;margin:0!important;
  border:1px solid var(--wd-field-line)!important;border-radius:var(--w-radius)!important;
  background:var(--wd-field)!important;color:var(--w-ink)!important;-webkit-text-fill-color:var(--w-ink)!important;
  font:inherit!important;font-family:var(--w-font)!important;font-size:16px!important;line-height:1.4!important;
  box-shadow:none!important;outline:0!important;opacity:1!important;
  transition:border-color .15s ease,box-shadow .15s ease;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) textarea:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]):not(.wd-native){height:auto!important;min-height:88px!important;padding:10px 12px!important;resize:vertical}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(input,textarea)::placeholder{color:var(--w-muted)!important;-webkit-text-fill-color:var(--w-muted)!important;opacity:.8!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) select option{background:var(--wd-surface)!important;color:var(--w-ink)!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]):not(.wd-native),select,textarea):focus{
  border-color:var(--w-accent)!important;box-shadow:0 0 0 3px var(--w-accent-soft)!important;outline:0!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(button,a,summary,[tabindex]):focus-visible{
  outline:2px solid var(--w-accent)!important;outline-offset:2px!important;
}
/* La tarjeta recibe el foco al abrirse (lectores de pantalla); el anillo va en los controles. */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog):focus{outline:0!important}

/* Prefijo telefónico y selector de país. */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(div:has(>#leadPhone),div:has(>#svcPhone),.vm-phone,.wd-phone){display:flex!important;gap:8px!important;align-items:stretch!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(#ccBtn,.vm-phone-prefix,.cc-trigger,.wd-prefix,div:has(+#svcPhone)){
  display:inline-flex!important;align-items:center!important;gap:6px!important;flex:none!important;box-sizing:border-box!important;
  height:var(--w-h)!important;min-height:var(--w-h)!important;padding:0 12px!important;
  border:1px solid var(--wd-field-line)!important;border-radius:var(--w-radius)!important;
  background:var(--w-surface-2)!important;color:var(--w-ink)!important;font-family:var(--wd-mono)!important;font-size:14px!important;font-weight:500!important;white-space:nowrap;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(#ccDropdown,.cc-dropdown,.vm-cc-dropdown){
  background:var(--wd-surface)!important;color:var(--w-ink)!important;border:1px solid var(--w-line-strong)!important;border-radius:12px!important;box-shadow:var(--wd-shadow)!important;z-index:10!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.cc-country,.vm-cc-item,#ccList>*){color:var(--w-ink)!important;min-height:44px}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.cc-country,.vm-cc-item,#ccList>*):hover{background:var(--w-surface-2)!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) div:has(>#ccBtn){position:relative!important;flex:none!important;display:flex!important;border:0!important;background:none!important;padding:0!important;height:auto!important;min-height:0!important;box-shadow:none!important}

/* Selector de país de owncoding-ui (inputs.js) dentro del diálogo. */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) .oc-input-editor :is(button[aria-haspopup],.shrink-0>button){
  min-height:var(--w-h)!important;border:1px solid var(--wd-field-line)!important;border-radius:var(--w-radius)!important;
  background:var(--w-surface-2)!important;color:var(--w-ink)!important;box-shadow:none!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) .oc-input-editor :is(button[aria-haspopup],.shrink-0>button)[aria-expanded=true]{border-color:var(--w-accent)!important;box-shadow:0 0 0 3px var(--w-accent-soft)!important}

/* --- Opciones con letra (formato examen) -------------------------------- */
html body .wd-card .wd-group{border:0;margin:0;padding:0;min-inline-size:0}
html body .wd-card .wd-pills{display:grid;gap:8px;counter-reset:wd-option}
html body .wd-card .wd-pill{position:relative;display:flex;margin:0;counter-increment:wd-option}
html body .wd-card .wd-pill input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer;z-index:1}
html body .wd-card .wd-pill>span{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;padding:10px 14px;border:1px solid var(--w-line-strong);border-radius:12px;background:var(--w-surface-2);font-size:15.5px;font-weight:500;line-height:1.35;text-align:left;color:var(--w-ink);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
html body .wd-card .wd-pill>span::before{content:attr(data-key);flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;border:1px solid var(--w-line-strong);background:var(--w-surface);font-family:var(--wd-mono);font-size:12px;font-weight:500;color:var(--w-muted);transition:transform .2s var(--wd-ease)}
html body .wd-card .wd-pill>span:not([data-key])::before{content:counter(wd-option,upper-alpha)}
html body .wd-card .wd-pill input:hover+span{border-color:var(--w-accent)}
html body .wd-card .wd-pill input:checked+span{border-color:var(--w-accent);background:color-mix(in srgb,var(--w-accent) 8%,var(--w-surface));font-weight:600}
html body .wd-card .wd-pill input:checked+span::before{background:var(--w-accent);border-color:var(--w-accent);color:var(--w-accent-ink);transform:scale(1.06)}
html body .wd-card .wd-pill input:focus-visible+span{outline:2px solid var(--w-accent);outline-offset:2px}

/* Lo que una página oculta con [hidden] sigue oculto aunque otra regla le dé display. */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) [hidden]{display:none!important}

/* --- Acción principal (color de la sección, ancho completo) ------------ */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-btn,button[type=submit],.btn-submit,.btn-red,.cta-btn,.cta-wa,.vm-cta,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn){
  display:flex!important;align-items:center!important;justify-content:center!important;gap:8px;box-sizing:border-box!important;
  width:100%!important;min-height:var(--w-h-lg)!important;height:auto!important;padding:10px 16px!important;margin:6px 0 0!important;
  border:1px solid var(--w-accent)!important;border-radius:12px!important;
  background:var(--w-accent)!important;background-image:none!important;color:var(--w-accent-ink)!important;-webkit-text-fill-color:var(--w-accent-ink)!important;
  font-family:var(--w-font)!important;font-size:16px!important;font-weight:600!important;line-height:1.3!important;letter-spacing:-.005em!important;text-transform:none!important;
  text-decoration:none!important;text-align:center!important;white-space:normal!important;box-shadow:none!important;cursor:pointer;
  transition:background-color .15s ease,transform .18s var(--wd-ease);
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-btn,button[type=submit],.btn-submit,.btn-red,.cta-btn,.cta-wa,.vm-cta,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn):hover{background:var(--w-accent-hover)!important;transform:translateY(-1px)}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-btn,button[type=submit],.btn-submit,.btn-red,.cta-btn,.cta-wa,.vm-cta,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn):active{transform:translateY(0) scale(.985)}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-btn,button[type=submit],.btn-submit,.btn-red,.cta-btn,.vm-cta,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn):disabled{
  background:var(--w-surface-2)!important;border-color:var(--w-line-strong)!important;color:var(--w-muted)!important;-webkit-text-fill-color:var(--w-muted)!important;opacity:1!important;cursor:not-allowed!important;transform:none!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.wd-btn,button[type=submit],.btn-submit,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn)[aria-busy=true]{cursor:progress!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) .popup-sticky-cta{position:static!important;display:flex;flex-direction:column;gap:6px;padding:0!important;margin:0!important;border:0!important;background:none!important;box-shadow:none!important}
html body :is(.wd-card,#_) .wd-btn .wd-arrow{width:18px;height:18px;flex:none;transition:transform .2s var(--wd-ease)}
html body :is(.wd-card,#_) .wd-btn:hover .wd-arrow{transform:translateX(3px)}

/* --- Acción secundaria, notas y «Ahora no» ----------------------------- */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.wd-note,.popup-sticky-cta p,.terms,form>p:last-child){
  font-size:13px!important;line-height:1.45!important;color:var(--w-muted)!important;text-align:center!important;margin:6px 0 0!important;opacity:1!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.skip,.exit-popup>p:last-child){
  display:flex!important;align-items:center;justify-content:center;width:100%;min-height:44px;margin:4px 0 0!important;padding:0 12px!important;border:0!important;border-radius:10px;background:none!important;box-shadow:none!important;font-family:var(--wd-font)!important;
  font-size:14.5px!important;font-weight:600!important;line-height:1.2!important;color:var(--w-ink-2)!important;text-align:center!important;opacity:1!important;cursor:pointer;
  transition:background-color .15s ease,color .15s ease;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.skip,.exit-popup>p:last-child):hover{background:var(--w-surface-2)!important;color:var(--w-ink)!important}

/* --- Error y estado de éxito ------------------------------------------- */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-error,.quote-error,.modal-error,.form-error,.vm-error p){
  color:var(--w-danger)!important;font-size:14px!important;line-height:1.45!important;margin:0!important;padding:10px 12px 10px 14px!important;
  border:1px solid color-mix(in srgb,var(--w-danger) 35%,transparent)!important;border-left:3px solid var(--w-danger)!important;border-radius:var(--w-radius)!important;
  background:color-mix(in srgb,var(--w-danger) 7%,transparent)!important;text-align:left!important;
}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.wd-error,.quote-error) a{color:inherit!important;font-weight:600;text-decoration:underline}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-error,.quote-error,.modal-error,.form-error)[hidden],html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div,[data-content-template^=kit-] .modal-overlay>.weem-dialog) :is(.wd-error,.quote-error,.modal-error,.form-error):empty{display:none!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.wd-success,.quote-success,.success-msg,#leadSuccess,#svcSuccess,#form-success){text-align:center!important}
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.wd-success,.quote-success,.success-msg,#leadSuccess,#svcSuccess,#form-success) :is(h2,h3,p){text-align:center!important;margin-left:0!important;margin-right:0!important}
html body .wd-card .wd-success-icon,
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,#serviceModal>div) :is(.wd-success-icon,.success-msg .icon),
html body .lead-overlay>.quote-popup .quote-success::before{
  display:grid;place-items:center;width:52px;height:52px;margin:4px auto 16px;border-radius:14px;
  background:color-mix(in srgb,var(--w-success) 14%,transparent);color:var(--w-success);font-size:24px;font-weight:700;
}
html body .lead-overlay>.quote-popup .quote-success::before{content:'✓'}

/* Resumen de cotización (calculadora): datos en mono, en una banda hundida. */
html body .lead-overlay>.quote-popup .quote-summary{background:var(--w-surface-2)!important;border:1px solid var(--w-line)!important;border-radius:12px!important;margin:0 0 16px!important;padding:12px 14px!important}
html body .lead-overlay>.quote-popup .quote-summary dt{color:var(--w-muted)!important;font-family:var(--wd-mono)!important;font-size:11.5px!important;letter-spacing:.06em;text-transform:uppercase}
html body .lead-overlay>.quote-popup .quote-summary dd{color:var(--w-ink)!important;font-family:var(--wd-mono)!important;font-variant-numeric:tabular-nums}
html body .lead-overlay>.quote-popup .quote-field{display:grid!important;gap:0!important}

/* Opciones de radio de los formularios existentes («¿Ya importaste?»): tarjetas con letra, como el examen. */
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) div:has(>label>input[type=radio]){display:grid!important;gap:8px!important;counter-reset:wd-radio}
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) label:has(>input[type=radio]){
  counter-increment:wd-radio;display:flex!important;align-items:center!important;gap:12px!important;min-height:52px!important;margin:0!important;padding:10px 14px!important;
  border:1px solid var(--w-line-strong)!important;border-radius:12px!important;background:var(--w-surface-2)!important;color:var(--w-ink)!important;
  font-size:15px!important;font-weight:500!important;cursor:pointer;transition:border-color .15s ease;
}
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) label:has(>input[type=radio])::before{
  content:counter(wd-radio,upper-alpha);flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;
  border:1px solid var(--w-line-strong);background:var(--w-surface);font-family:var(--wd-mono);font-size:12px;font-weight:500;color:var(--w-muted);
}
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) label:has(>input[type=radio]):hover{border-color:var(--w-accent)!important}
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) label:has(>input[type=radio]:checked){border-color:var(--w-accent)!important;background:color-mix(in srgb,var(--w-accent) 8%,var(--w-surface))!important;font-weight:600!important;color:var(--w-ink)!important}
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) label:has(>input[type=radio]:checked)::before{background:var(--w-accent);border-color:var(--w-accent);color:var(--w-accent-ink)}
html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) label:has(>input[type=radio]:focus-visible){outline:2px solid var(--w-accent)!important;outline-offset:2px}

/* Marca: versión oscura sobre fondo claro y clara sobre fondo oscuro (si una página la muestra). */
html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.weem-dialog-brand,[data-weem-dialog-brand],.vm-brand) img{content:url('/brand/weem-firma-horizontal-clara.svg')!important;filter:none!important}
html[data-theme=dark] body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.weem-dialog-brand,[data-weem-dialog-brand],.vm-brand) img,
html.dark body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.weem-dialog-brand,[data-weem-dialog-brand],.vm-brand) img{content:url('/brand/weem-firma-horizontal-oscura.svg')!important}

/* --- Con una ventana abierta, nada flota encima ------------------------ */
/* El aviso de cookies, el de instalar la app, la burbuja de WhatsApp y las barras fijas
   se ocultan mientras haya una ventana abierta; vuelven al cerrarla. */
html:has(:is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal).active,dialog.glo-dialog[open]) :is(#cookieConsent,#v-pwa-banner,.v-bottom-nav,.kit-dock,.wa-widget,[data-kit-sticky]){visibility:hidden!important;pointer-events:none!important}

/* ==========================================================================
   Formato examen (WhatsApp previo y toda ventana nueva):
   cabecera fija · progreso · cuerpo con desplazamiento propio · pie fijo.
   «:is(.wd-card,#_)» da a estas reglas el peso de las anteriores (que incluyen
   #serviceModal), así ganan por orden sin más !important.
   ========================================================================== */
html body :is(.wd-card,#_).wd-card--exam{padding:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
html body :is(.wd-card,#_).wd-card--exam .wd-flow:not([hidden]){display:flex!important;flex-direction:column!important;flex:1 1 auto!important;min-height:0!important;gap:0!important;margin:0!important}
html body :is(.wd-card,#_) .wd-head{display:flex;align-items:flex-start;gap:12px;padding:20px 12px 16px 24px;flex:none}
html body :is(.wd-card,#_) .wd-head__text{flex:1;min-width:0;padding-top:2px}
html body :is(.wd-card,#_) .wd-kicker{display:flex;align-items:center;gap:10px;margin:0 0 8px!important;font:500 11.5px/1.35 var(--wd-mono)!important;letter-spacing:.09em!important;text-transform:uppercase;color:var(--w-muted)!important}
html body :is(.wd-card,#_) .wd-kicker::before{content:'';flex:none;width:14px;height:9px;margin-left:3px;border-radius:1.5px;background:var(--w-accent);transform:skewX(-21deg)}
html body :is(.wd-card,#_) .wd-head .wd-sub{font-size:11.5px!important;line-height:1.35!important;color:var(--w-muted)!important}
html body :is(.wd-card,#_) .wd-head .wd-title{font-size:22px!important;line-height:1.22!important;font-weight:650!important;letter-spacing:-.025em!important;margin:0!important}
html body :is(.wd-card,#_) .wd-head .wd-close{position:static!important;flex:none}
html body :is(.wd-card,#_) .wd-progress{flex:none;position:relative;height:2px;background:var(--w-line);overflow:hidden}
html body :is(.wd-card,#_) .wd-progress span{position:absolute;inset:0;display:block;background:var(--w-accent);transform:scaleX(var(--wd-step,.5));transform-origin:left center;transition:transform .32s var(--wd-ease)}
html body :is(.wd-card,#_) .wd-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:22px 24px;display:flex;flex-direction:column;gap:14px}
html body :is(.wd-card,#_) .wd-body .wd-question{display:block;font-size:19px!important;line-height:1.3!important;font-weight:650!important;letter-spacing:-.018em!important;color:var(--w-ink)!important;margin:0 0 2px!important;padding:0!important}
html body :is(.wd-card,#_) .wd-body .wd-desc{margin:0 0 6px!important}
html body :is(.wd-card,#_) .wd-body .wd-flow-step:not([hidden]){display:flex;flex-direction:column;gap:14px}
html body :is(.wd-card,#_) .wd-foot{flex:none;display:grid;gap:6px;padding:16px 24px 20px;border-top:1px solid var(--w-line);background:var(--w-surface)}
html body :is(.wd-card,#_) .wd-foot .wd-btn{margin:0!important}
html body :is(.wd-card,#_) .wd-foot :is([hidden],#_){display:none!important}
/* Secundaria: .w-btn.w-btn--ghost de ancho completo, en tinta suave. */
html body :is(.wd-card,#_) .wd-link{width:100%;min-height:44px;--_fg:var(--w-ink-2);--_bg-hover:var(--w-surface-2);font-size:14.5px}
html body :is(.wd-card,#_) .wd-link:hover{--_fg:var(--w-ink)}
html body :is(.wd-card,#_).wd-card--exam .wd-success{padding:28px 24px 24px}
html body :is(.wd-card,#_).wd-card--exam .wd-success .wd-title{margin:0 0 8px!important}

/* ==========================================================================
   Movimiento: entrada con escala y opacidad (220 ms), salida más rápida
   (140 ms). La entrada es una animación; la salida, una transición que
   mantiene la ventana visible mientras se desvanece («display … allow-discrete»).
   ========================================================================== */
@media (prefers-reduced-motion:no-preference){
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal){
    transition:opacity var(--wd-out) var(--wd-ease-out),display var(--wd-out) allow-discrete!important;
  }
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal):not(.active){opacity:0!important}
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal).active{opacity:1;animation:wd-fade var(--wd-in) var(--wd-ease)}
  html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div){
    transition:opacity var(--wd-out) var(--wd-ease-out),transform var(--wd-out) var(--wd-ease-out)!important;
  }
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal):not(.active)>:is(.wd-card,.lead-popup,.exit-popup,.popup,.vm-card,div){opacity:0!important;transform:translateY(6px) scale(.97)!important}
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal).active>:is(.wd-card,.lead-popup,.exit-popup,.popup,.vm-card,div){animation:wd-in var(--wd-in) var(--wd-ease)}
  html body[data-content-template^=kit-] .modal-overlay:is(.active,.show)>.weem-dialog{animation:wd-in var(--wd-in) var(--wd-ease)}
  /* Pasos, error y éxito: el contenido nuevo entra de costado o crece apenas. */
  html body :is(.wd-card,#_) :is(.wd-flow-step,.wd-group,.wd-success,.wd-error):not([hidden]){transition:opacity .2s var(--wd-ease),transform .2s var(--wd-ease)}
  html body :is(.wd-card,#_) .wd-success:not([hidden]) .wd-success-icon{transition:transform .32s var(--wd-ease),opacity .2s ease}
}
@starting-style{
  html body :is(.wd-card,#_) :is(.wd-flow-step,.wd-group):not([hidden]){opacity:0;transform:translateX(12px)}
  html body :is(.wd-card,#_) :is(.wd-success,.wd-error):not([hidden]){opacity:0;transform:translateY(4px)}
  html body :is(.wd-card,#_) .wd-success:not([hidden]) .wd-success-icon{opacity:0;transform:scale(.7)}
}
@keyframes wd-fade{from{opacity:.001}}
@keyframes wd-in{from{opacity:0;transform:translateY(8px) scale(.96)}}
@keyframes wd-sheet{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}

/* ==========================================================================
   Teléfono: tarjeta arriba, con margen y desplazamiento interno
   ========================================================================== */
@media (max-width:599.98px){
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal){align-items:flex-start!important;justify-content:center!important;padding:max(12px,env(safe-area-inset-top)) 12px 12px!important}
  html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div){
    width:100%!important;max-width:none!important;margin:0!important;
    max-height:calc(100dvh - max(12px,env(safe-area-inset-top)) - 12px)!important;
    border-radius:16px!important;
    padding:22px 20px 20px!important;
    background:var(--wd-surface)!important;
    box-shadow:0 1px 0 var(--wd-line),0 24px 48px -20px rgba(0,0,0,.45)!important;
  }
  html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.wd-close,.lead-close,.exit-close,.popup-close,.vm-close,.weem-dialog-close,#serviceModal>div>button:first-child),
  html body #serviceModal>div>button:first-child{top:10px!important;right:8px!important}
  html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.row,.vm-row,.popup-form-scroll>div:first-child:has(>div+div),form>div:first-child:not(.popup-form-scroll):has(>div+div>label)){grid-template-columns:1fr!important}
  html body :is(.wd-card,#_).wd-card--exam{padding:0!important}
  html body :is(.wd-card,#_) .wd-head{padding:18px 8px 14px 20px}
  html body :is(.wd-card,#_) .wd-body{padding:18px 20px}
  html body :is(.wd-card,#_) .wd-foot{padding:14px 20px 16px}
  /* Pie fijo: el botón principal queda visible mientras se desplaza el formulario.
     Se fija el contenedor del botón (o el botón si es hijo directo del formulario). */
  html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) :is(.popup-sticky-cta,form>:is(button[type=submit],.btn-submit,.cta-btn,.vm-cta,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn)){
    position:sticky!important;bottom:0!important;z-index:3!important;background:var(--w-surface)!important;box-shadow:0 -14px 14px -4px var(--w-surface),0 10px 0 10px var(--w-surface)!important;
  }
  html body :is(.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) form>:is(button[type=submit],.btn-submit,.cta-btn,.vm-cta,#leadSubmitBtn,#svcSubmitBtn,#submitBtn,#submit-btn){background:var(--w-accent)!important}
}
@media (max-width:599.98px) and (prefers-reduced-motion:no-preference){
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal){transition-duration:180ms!important}
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal):not(.active)>:is(.wd-card,.lead-popup,.exit-popup,.popup,.vm-card,div){transform:translateY(-16px)!important;opacity:0!important;transition-duration:160ms!important}
  html body :is(.wd-overlay,.lead-overlay,.exit-overlay,.popup-overlay,.vm-overlay,#serviceModal).active>:is(.wd-card,.lead-popup,.exit-popup,.popup,.vm-card,div){animation:wd-sheet 240ms var(--wd-ease)}
}

/* ==========================================================================
   Avisos fijos: cookies e instalar la app. Discretos, abajo a la izquierda,
   con las dos opciones del mismo peso (no se empuja a «Aceptar»).
   ========================================================================== */
html body :is(#cookieConsent,#v-pwa-banner){
  position:fixed!important;left:16px!important;right:auto!important;bottom:16px!important;z-index:9980!important;
  box-sizing:border-box;display:grid!important;grid-template-columns:minmax(0,1fr);gap:12px!important;
  width:min(400px,calc(100vw - 32px))!important;max-width:none!important;margin:0!important;padding:16px 16px 14px!important;
  background:var(--wd-surface)!important;color:var(--wd-ink)!important;
  border:1px solid var(--wd-line)!important;border-radius:14px!important;box-shadow:var(--wd-shadow)!important;
  font:400 14px/1.5 var(--wd-font)!important;text-align:left!important;
}
html body #cookieConsent::before,html body #v-pwa-banner::before{
  content:'Cookies';display:flex;align-items:center;gap:10px;font:500 11px/1.2 var(--wd-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--wd-muted);
  padding-left:24px;
}
html body #cookieConsent::after,html body #v-pwa-banner::after{content:'';position:absolute;left:19px;top:18px;width:14px;height:9px;border-radius:1.5px;background:var(--wd-accent);transform:skewX(-21deg)}
html body #v-pwa-banner::before{content:'Aplicación'}
html body #cookieConsent p{margin:0!important;max-width:none!important;font-size:14px!important;line-height:1.5!important;color:var(--wd-ink-2)!important}
html body #cookieConsent a{color:var(--wd-ink)!important;font-weight:600;text-decoration:underline;text-underline-offset:3px}
html body #cookieConsent>div{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;width:auto!important}
html body #v-pwa-banner{grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
html body #v-pwa-banner::before{grid-column:1/-1}
html body #v-pwa-banner>span{font-size:14.5px!important;color:var(--wd-ink)!important}
html body :is(#cookieConsent,#v-pwa-banner) button{
  display:inline-flex!important;align-items:center;justify-content:center;min-height:44px!important;min-width:44px!important;padding:0 14px!important;margin:0!important;
  border:1px solid var(--wd-line-strong)!important;border-radius:10px!important;background:var(--wd-surface)!important;background-image:none!important;
  color:var(--wd-ink)!important;-webkit-text-fill-color:var(--wd-ink)!important;box-shadow:none!important;
  font:600 14px/1.2 var(--wd-font)!important;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .15s var(--wd-ease);
}
/* Las dos opciones del aviso de cookies pesan lo mismo, aunque una hoja de página pinte «Aceptar». */
html body #cookieConsent :is(#cookieAccept,#cookieReject){background:var(--wd-surface)!important;border-color:var(--wd-line-strong)!important;color:var(--wd-ink)!important;-webkit-text-fill-color:var(--wd-ink)!important;border-radius:10px!important}
html body #cookieConsent :is(#cookieAccept,#cookieReject):hover{background:var(--wd-raised)!important;border-color:var(--wd-field-line)!important}
html body :is(#cookieConsent,#v-pwa-banner) button:hover{background:var(--wd-raised)!important;border-color:var(--wd-field-line)!important}
html body :is(#cookieConsent,#v-pwa-banner) button:active{transform:scale(.98)}
html body :is(#cookieConsent,#v-pwa-banner) :is(button,a):focus-visible{outline:2px solid var(--wd-accent)!important;outline-offset:2px!important}
/* Instalar sí es la acción del aviso: va en el color de la sección; «Cerrar» queda secundaria. */
html body #v-pwa-banner #v-pwa-install{background:var(--wd-accent)!important;border-color:var(--wd-accent)!important;color:var(--wd-accent-ink)!important;-webkit-text-fill-color:var(--wd-accent-ink)!important}
html body #v-pwa-banner #v-pwa-close{border-color:transparent!important;color:var(--wd-ink-2)!important;-webkit-text-fill-color:var(--wd-ink-2)!important}
/* Un aviso por vez: la invitación a instalar espera a que se responda el de cookies. */
html:has(#cookieConsent) body #v-pwa-banner{display:none!important}
/* Con la barra fija de las herramientas a la vista, el aviso queda encima de ella. */
html body :is(#cookieConsent,#v-pwa-banner){transition:translate .24s var(--wd-ease)}
html:has(.kit-dock.is-on) body :is(#cookieConsent,#v-pwa-banner){translate:0 -88px}
/* Con la burbuja de WhatsApp en la página, el aviso le deja su columna libre. */
html:has(.wa-widget) body :is(#cookieConsent,#v-pwa-banner){width:min(400px,calc(100vw - 104px))!important}
@media (max-width:599.98px){
  html body :is(#cookieConsent,#v-pwa-banner){left:12px!important;bottom:calc(12px + env(safe-area-inset-bottom))!important;width:calc(100vw - 24px)!important;padding:14px 14px 12px!important;gap:10px!important}
  html:has(.wa-widget) body :is(#cookieConsent,#v-pwa-banner){width:calc(100vw - 92px)!important}
  html:has(.wa-widget) body :is(#cookieConsent,#v-pwa-banner) button{padding:0 8px!important;font-size:13.5px!important}
  html:has(.wa-widget) body #cookieConsent p{font-size:13px!important}
  html body #cookieConsent p{font-size:13.5px!important}
}
@media (prefers-reduced-motion:no-preference){
  html body :is(#cookieConsent,#v-pwa-banner){animation:wd-toast .24s var(--wd-ease) both;animation-delay:.3s}
}
@keyframes wd-toast{from{opacity:0;transform:translateY(12px)}}

/* ==========================================================================
   Burbuja de WhatsApp (#waWidget, /importacion/china e /importacion/ipcc):
   botón redondo fijo abajo a la derecha, en el color de la sección; el texto
   aparece como una tarjeta chica al pasar el puntero o con el foco, sin tapar
   la lectura. El enlace sigue pasando por la puerta de WhatsApp (wa-gate.js).
   ========================================================================== */
html body .wa-widget{
  position:fixed!important;right:16px!important;bottom:16px!important;left:auto!important;top:auto!important;z-index:9985!important;
  display:flex!important;flex-direction:column!important;align-items:flex-end!important;gap:10px!important;
  width:auto!important;max-width:none!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;font-family:var(--wd-font)!important;
}
html body .wa-widget .wa-btn{
  display:grid!important;place-items:center!important;width:56px!important;height:56px!important;min-height:0!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:16px!important;background:var(--wd-accent)!important;color:var(--wd-accent-ink)!important;
  box-shadow:0 1px 2px rgba(11,13,18,.18),0 12px 28px -12px rgba(11,13,18,.5)!important;text-decoration:none!important;
  transition:transform .2s var(--wd-ease);
}
html body .wa-widget .wa-btn svg{display:block!important;width:26px!important;height:26px!important;max-width:26px!important;fill:currentColor!important;flex:none}
html body .wa-widget .wa-btn:hover{transform:translateY(-2px)}
html body .wa-widget .wa-btn:active{transform:scale(.96)}
html body .wa-widget .wa-btn:focus-visible{outline:2px solid var(--wd-accent)!important;outline-offset:3px!important}
html body .wa-widget .wa-bubble{
  position:relative!important;box-sizing:border-box;width:min(260px,calc(100vw - 32px))!important;max-width:none!important;margin:0!important;
  padding:12px 14px!important;border:1px solid var(--wd-line)!important;border-radius:12px!important;
  background:var(--wd-surface)!important;color:var(--wd-ink-2)!important;box-shadow:var(--wd-shadow)!important;
  font-size:13.5px!important;line-height:1.45!important;text-align:left!important;
  opacity:0;transform:translateY(6px) scale(.98);transform-origin:bottom right;visibility:hidden;pointer-events:none;
  transition:opacity .16s var(--wd-ease-out),transform .16s var(--wd-ease-out),visibility 0s linear .16s;
}
html body .wa-widget .wa-bubble strong{display:block;margin:0 0 4px;font:500 11px/1.2 var(--wd-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--wd-muted)}
html body .wa-widget .wa-bubble br{display:none}
html body .wa-widget .wa-bubble>div{margin-top:4px;font-size:12.5px;color:var(--wd-muted)}
html body .wa-widget .wa-bubble-close{display:none!important}
html body .wa-widget:is(:hover,:focus-within) .wa-bubble,html body .wa-widget .wa-bubble.show{opacity:1;transform:none;visibility:visible;transition:opacity .2s var(--wd-ease),transform .2s var(--wd-ease),visibility 0s}
@media (hover:none){html body .wa-widget:not(:focus-within) .wa-bubble:not(.show){display:none!important}}
@media (max-width:599.98px){html body .wa-widget{right:12px!important;bottom:calc(12px + env(safe-area-inset-bottom))!important}}
/* La barra fija de inscripción del celular queda a la izquierda del botón. */
html:has(.wa-widget) body [data-kit-sticky]{padding-right:84px!important}

/* --- Movimiento reducido: nada se mueve -------------------------------- */
@media (prefers-reduced-motion:reduce){
  html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div){animation:none!important;transition:none!important}
  html body :is(.wd-card,.lead-overlay>.lead-popup,.exit-overlay>.exit-popup,.popup-overlay>.popup,.vm-overlay>.vm-card,#serviceModal>div) *{transition:none!important}
  html body :is(#cookieConsent,#v-pwa-banner,.wa-widget,.wa-widget *){animation:none!important;transition:none!important}
  html body :is(.wd-card,#_) .wd-progress span{transition:none}
}