/* =====================================================================
   fulkro.co v7 · la cara de la web de hoy (fulkro.co) con el contenido de la v6 y un orden nuevo (10-oct-2026)
   Tokens copiados de https://fulkro.co/styles.css: fondo grafito azul, luz azul, rejilla, coral solo en botones,
   Space Grotesk 700 en titulares e IBM Plex Sans en el cuerpo.
   Una sola cosa se mueve con audacia: la palanca (con el scroll). Las cuatro partes se arman con el scroll, más sobrias.
   Lo demás está quieto. Con «reducir movimiento» o ?final=1, todo queda quieto en su estado final.
   ===================================================================== */
@font-face{font-family:'Space Grotesk';src:url('fonts/space-grotesk-700-latin.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/ibm-plex-sans-latin.woff2') format('woff2');font-weight:400 600;font-style:normal;font-display:swap}

:root{
  --azul:#2D5BFF; --azul-luz:#6C8BFF; --azul-hondo:#1F3BFF; --azul-claro:#7EE7F5;
  --coral:#FF6B4A; --coral-hover:#FF8266;
  --ambar:#FFC857;
  --fondo:#0E121B; --sup-0:#08090B; --sup-1:#141820; --sup-2:#1B212B; --sup-3:#252B36;
  --texto:#F4F6FB; --texto-2:rgba(234,239,255,.72); --linea:rgba(234,239,255,.10); --linea-2:rgba(234,239,255,.18);
  --f-titulo:'Space Grotesk','Helvetica Neue',Arial,sans-serif;
  --f-cuerpo:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif;
  --fs-hero:clamp(2.05rem,4.1vw,4.1rem); --fs-h2:clamp(1.75rem,3vw,2.75rem); --fs-entrada:clamp(1.0625rem,1.35vw,1.25rem);
  --margen:clamp(1.25rem,4vw,3.25rem); --ancho:78rem; --cab:4.25rem;
  /* la palanca */
  --escena-h:24rem; --apoyo-h:64px; --apoyo-w:72px; --viga-t:12px; --piso-b:5.5rem;
  --losa-h:28px; --losa-fs:.75rem; --carga-w:132px; --punto:13px;
}
@media (min-width:62rem){
  :root{ --apoyo-h:88px; --apoyo-w:98px; --viga-t:16px; --piso-b:4.5rem; --losa-h:30px; --losa-fs:.8125rem; --carga-w:184px; --punto:16px;
          --escena-h:clamp(19rem,calc(100svh - 31.5rem),33rem); }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;overflow-x:clip;font:400 1.0625rem/1.6 var(--f-cuerpo);color:var(--texto);background:var(--fondo);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
ol,ul{padding:0;list-style:none}
a{color:var(--azul-claro);text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--texto);outline-offset:4px;border-radius:6px}
main:focus{outline:none}
.cont{width:min(100% - 2 * var(--margen),var(--ancho));margin-inline:auto}
.salto{position:absolute;left:-999rem;top:1rem;z-index:50;padding:.7rem 1rem;border-radius:.5rem;background:var(--texto);color:var(--fondo)}
.salto:focus{left:1rem}
section[id]{scroll-margin-top:var(--cab)}

/* la luz de fulkro.co (quieta: aquí lo único que se mueve es la palanca) */
.luz{position:fixed;inset:-10%;z-index:-1;pointer-events:none;
  background:radial-gradient(52% 44% at 68% 38%,rgba(45,91,255,.26),transparent 70%),
             radial-gradient(36% 36% at 12% 84%,rgba(45,91,255,.12),transparent 70%),
             radial-gradient(30% 26% at 90% 96%,rgba(255,107,74,.05),transparent 70%)}

/* ---------- Botones: píldoras; coral solo en la acción ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:3.25rem;padding:.5rem 1.7rem;border:1px solid transparent;border-radius:999px;
  font:600 1rem/1.2 var(--f-cuerpo);text-decoration:none;text-align:center;white-space:nowrap;cursor:pointer;transition:background-color .2s,box-shadow .3s}
.btn--accion{background:var(--coral);color:#14161A;box-shadow:0 10px 40px rgba(255,107,74,.28)}
.btn--accion:hover{background:var(--coral-hover);box-shadow:0 14px 54px rgba(255,107,74,.45)}
.btn--chico{min-height:2.6rem;padding-inline:1.15rem;font-size:.9rem}
.btn__wa{flex:none;width:1.2em;height:1.2em;margin-right:.5em;fill:currentColor}
/* en los celulares más angostos (320-379 px) el botón en inglés, con el logo, cabe en una línea */
@media (max-width:379.98px){ .btn:not(.btn--chico){padding-inline:1.1rem;font-size:.9375rem} .btn__wa{margin-right:.4em} }

/* ---------- Encabezado: transparente arriba, sólido al bajar ---------- */
.cab{position:fixed;inset:0 0 auto 0;z-index:30;border-bottom:1px solid transparent;transition:background-color .35s,border-color .35s}
.cab.is-solida{background:rgba(13,15,18,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:var(--linea)}
.cab__fila{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:var(--cab)}
.marca{display:inline-flex;align-items:center;gap:.5rem;color:var(--texto);text-decoration:none;border-radius:.25rem}
.marca__signo{width:1.5rem;height:1.5rem;flex:none;fill:var(--azul)}
.wm{height:1.375rem;width:auto;flex:none;fill:var(--texto)}
.wm__muesca{fill:var(--fondo)}
.cab__nav{display:none}
.cab__der{display:flex;align-items:center;gap:1.25rem}
.cab__enlace{color:var(--texto-2);text-decoration:none;font-weight:500;font-size:.9375rem;white-space:nowrap;transition:color .2s}
.cab__enlace:hover{color:var(--texto)}
.cab__entrar{display:none;color:var(--azul-claro)}
/* selector de idioma como el de WTT: un botón con el idioma actual abre la lista; sin JavaScript, la lista son enlaces directos */
.idioma{position:relative}
.idioma__lista{display:flex;gap:.875rem;margin:0;padding:0;list-style:none}
.idioma__op{display:block;padding:.375rem 0;font:500 .9375rem/1.2 var(--f-cuerpo);color:var(--texto-2);white-space:nowrap;text-decoration:underline;
  text-decoration-thickness:2px;text-underline-offset:.45em;text-decoration-color:transparent}
.idioma__op:hover{color:var(--texto)}
.idioma__op[aria-current="true"]{color:var(--texto);text-decoration-color:var(--azul)}
.idioma__boton:not([hidden]){display:inline-flex;align-items:center;gap:.45rem;min-height:2.4rem;padding:0 .8rem;border:1px solid var(--linea-2);border-radius:999px;
  background:transparent;color:var(--texto);font:500 .9375rem/1.2 var(--f-cuerpo);white-space:nowrap;cursor:pointer}
.idioma__boton:hover{border-color:rgba(234,239,255,.4)}
.idioma__globo{width:1rem;height:1rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.6}
.idioma__flecha{width:.65rem;height:.45rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.idioma__boton[aria-expanded="true"] .idioma__flecha{transform:rotate(180deg)}
.idioma.is-js .idioma__lista{display:none;position:absolute;right:0;top:calc(100% + .5rem);z-index:40;min-width:10rem;flex-direction:column;gap:2px;padding:.4rem;
  border-radius:.9rem;background:var(--sup-2);border:1px solid var(--linea-2);box-shadow:0 18px 48px rgba(0,0,0,.45)}
.idioma.is-js.is-abierto .idioma__lista{display:flex}
.idioma.is-js .idioma__op{padding:.6rem .8rem;border-radius:.6rem;text-decoration:none}
.idioma.is-js .idioma__op:hover,.idioma.is-js .idioma__op:focus-visible{background:rgba(234,239,255,.08);color:var(--texto)}
.idioma.is-js .idioma__op[aria-current="true"]{color:var(--texto);font-weight:600;box-shadow:inset 3px 0 0 var(--azul)}
@media (min-width:1280px){ .cab__nav{display:flex;gap:1.75rem;margin-left:auto;margin-right:1.75rem} }
@media (min-width:1440px){ .cab__entrar{display:inline} }
@media (max-width:699.98px){
  .cab .cab__boton{display:none}
  .cab.cab--boton .cab__boton{display:inline-flex;padding-inline:.95rem;font-size:.85rem}
  .cab.cab--boton .idioma{display:none}
}
@media (max-width:419.98px){ html[lang="en"] .cab.cab--boton .wm{display:none} }

/* ---------- 1 · Portada: qué hace, dónde y para quién; abajo la palanca ---------- */
.hero{position:relative;padding-top:calc(var(--cab) + clamp(1.25rem,4vh,3rem))}
.hero__titulo{font:700 var(--fs-hero)/1.03 var(--f-titulo);letter-spacing:-.04em;max-width:19.5em;text-wrap:balance}
.hero__bajo{display:grid;gap:1.5rem;margin-top:clamp(1.25rem,2.6vh,2rem)}
.hero__entrada{font-size:calc(var(--fs-entrada) * 1.12);line-height:1.45;max-width:36rem;color:var(--texto)}
.hero__entrada strong{font-weight:600}
.hero__donde{margin-top:.75rem;max-width:36rem;font-size:var(--fs-entrada);line-height:1.5;color:var(--azul-claro)}
.hero__nota{margin-top:.75rem;max-width:24rem;font-size:.9375rem;line-height:1.5;color:var(--texto-2)}
.hero__correo{margin-top:.5rem;font-size:.9375rem}
@media (min-width:62rem){
  .hero__bajo{grid-template-columns:minmax(0,36rem) minmax(0,24rem);justify-content:space-between;align-items:end}
}

/* ---------- La palanca de fulkro.co: viga azul con luz, apoyo con resplandor, piso y rejilla ---------- */
/* recorta solo a los lados (el piso y la viga se salen); arriba no: las cargas llegan cuando la palanca ya está fija en el centro y tienen aire */
.palanca{position:relative;height:var(--escena-h);margin-top:clamp(1.5rem,4vh,2.5rem);overflow:hidden;overflow-x:clip;overflow-y:visible}
.palanca__rejilla{position:absolute;inset:0;opacity:.6;pointer-events:none;
  background-image:linear-gradient(var(--linea) 1px,transparent 1px),linear-gradient(90deg,var(--linea) 1px,transparent 1px);
  background-size:3.5rem 3.5rem;background-position:center bottom;
  -webkit-mask-image:radial-gradient(ellipse 70% 90% at 62% 78%,#000 18%,transparent 74%);
  mask-image:radial-gradient(ellipse 70% 90% at 62% 78%,#000 18%,transparent 74%)}
.palanca__mundo{position:relative;height:100%}
.palanca__piso{position:absolute;left:-4%;right:-4%;bottom:var(--piso-b);height:1px;
  background:linear-gradient(90deg,transparent,rgba(124,151,255,.6) 22%,rgba(124,151,255,.6) 78%,transparent)}
/* la cifra: en el celular, arriba a la izquierda; en escritorio, arriba al centro (ahí la gente sube por la izquierda al principio
   y la carga por la derecha al final) */
.palanca__lectura{position:absolute;left:0;top:0;display:grid;gap:.15rem}
@media (min-width:62rem){ .palanca__lectura{left:50%;transform:translateX(-50%);justify-items:center;text-align:center} }
.palanca__cifra{font:700 clamp(2rem,4.6vw,4.25rem)/1 var(--f-titulo);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.palanca__cifra-pie{font-size:.875rem;font-weight:500;color:var(--texto-2)}
/* la viga gira sobre la punta del apoyo; sin JavaScript (o sin movimiento) queda en su estado final: apoyo al 75 %, carga arriba */
.palanca__viga{position:absolute;left:0;width:100%;height:var(--viga-t);bottom:calc(var(--piso-b) + var(--apoyo-h));border-radius:999px;
  background:linear-gradient(180deg,#6C8BFF 0%,#2D5BFF 55%,#1F3BFF 100%);
  box-shadow:0 0 42px rgba(45,91,255,.42),inset 0 1px 0 rgba(255,255,255,.35);
  transform-origin:75% 100%;transform:rotate(-5deg);will-change:transform}
.palanca__gente{position:absolute;left:1.2%;bottom:100%;display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;padding-bottom:3px}
.palanca__gente-rotulo{font:600 .875rem/1.2 var(--f-cuerpo);white-space:nowrap}
.palanca__puntos{display:flex;gap:.3rem}
.palanca__puntos i{display:block;width:var(--punto);height:var(--punto);border-radius:50%;background:#EAEFFF;box-shadow:0 0 18px rgba(234,239,255,.35)}
.palanca__carga{position:absolute;right:1.2%;bottom:100%;width:var(--carga-w);display:flex;flex-direction:column-reverse;align-items:center;gap:4px;padding-bottom:3px}
.losa{display:flex;align-items:center;justify-content:center;height:var(--losa-h);border-radius:6px;border:1px solid rgba(234,239,255,.16);
  background:linear-gradient(180deg,#303744,#20252E);color:var(--texto);font:600 var(--losa-fs)/1 var(--f-cuerpo);white-space:nowrap;
  box-shadow:0 10px 26px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}
.losa:nth-child(1){width:100%}.losa:nth-child(2){width:93%}.losa:nth-child(3){width:86%}.losa:nth-child(4){width:79%}
.losa--mensajes{background:var(--ambar);border-color:rgba(255,200,87,.6);color:#14161A;box-shadow:0 10px 26px rgba(0,0,0,.4),0 0 24px rgba(255,200,87,.18)}
.palanca__apoyo{position:absolute;bottom:var(--piso-b);left:75%;width:var(--apoyo-w);height:var(--apoyo-h);margin-left:calc(var(--apoyo-w) / -2);will-change:transform}
.palanca__apoyo svg{position:relative;display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 22px rgba(45,91,255,.6))}
.palanca__halo{position:absolute;left:50%;top:42%;width:340%;aspect-ratio:1;margin:-170% 0 0 -170%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(45,91,255,.5),rgba(45,91,255,.14) 46%,transparent 72%);opacity:.55}
.palanca__rotulo{position:absolute;left:75%;bottom:calc(var(--piso-b) - 2.25rem);transform:translateX(-50%);font:600 .9375rem/1.2 var(--f-cuerpo);white-space:nowrap;will-change:transform}
/* el cuarto punto, punteado: «¿Contratar a alguien más?» (aparece en el momento 1 y se desvanece en el 2; en el estado final no está) */
.palanca__extra{display:inline-flex;align-items:center;gap:.45rem;margin-left:.35rem;opacity:0;will-change:opacity}
.palanca__extra i{display:block;width:var(--punto);height:var(--punto);border-radius:50%;border:2px dotted rgba(234,239,255,.9);background:transparent;box-shadow:none}
.palanca__extra span{font:500 .8125rem/1.2 var(--f-cuerpo);color:var(--azul-claro);white-space:nowrap}
/* en pantallas angostas la pregunta va encima de «Tu mismo equipo»: al lado de los puntos la tapaba la carga */
@media (max-width:39.98rem){ .palanca__extra span{position:absolute;left:0;bottom:calc(100% + .2rem)} }
@media (max-width:22.49rem){ .palanca__extra span{white-space:normal;width:7.5rem} }
/* la línea de cada momento (debajo de la palanca) */
.palanca__momento{position:absolute;left:0;right:0;bottom:0;max-width:36rem;font-size:.9375rem;line-height:1.4;color:var(--texto)}
/* con movimiento, el primer pintado ya es el principio de la historia (viga quieta, sin cargas, apoyo al centro): nada salta cuando llega el JavaScript */
.js-mov .palanca__viga{transform-origin:50% 100%;transform:none}
.js-mov .palanca__apoyo,.js-mov .palanca__rotulo{left:50%}
.js-mov .palanca__carga .losa{opacity:0}
/* la historia avanza con el scroll: la palanca queda fija (centrada) mientras se recorre una pantalla y media
   (el recorrido es un bloque vacío dentro de la portada: el «sticky» solo se mueve dentro del contenido de su padre) */
.palanca__recorrido{display:none}
.js-mov .palanca__recorrido{display:block;height:150svh}
.js-mov .palanca{position:sticky;top:calc(50svh - var(--escena-h) / 2 + var(--cab) / 2)}
@media (min-width:62rem){
  .palanca__gente-rotulo{font-size:.9375rem}
  .palanca__momento{font-size:1.0625rem}
}

/* ---------- Secciones ---------- */
.sec{position:relative;padding-block:clamp(4.5rem,10vw,8.5rem);border-top:1px solid var(--linea)}
.sec__cabeza{max-width:44rem}
.sec__titulo{font:700 var(--fs-h2)/1.06 var(--f-titulo);letter-spacing:-.035em;max-width:17em;text-wrap:balance}
.sec__entrada{margin-top:1.2rem;max-width:36rem;font-size:var(--fs-entrada);line-height:1.5;color:var(--texto-2)}
.sec__nota{margin-top:2rem;max-width:40rem;font-size:.9375rem;line-height:1.5;color:var(--texto-2)}
h3{font:600 1.125rem/1.35 var(--f-cuerpo)}

/* 2 · Para quién: lista con filetes, nombre y texto en la misma fila */
.sec__dos{display:grid;gap:2.5rem}
.sectores li{display:grid;gap:.35rem;padding:1.15rem 0;border-top:1px solid var(--linea)}
.sectores li:last-child{border-bottom:1px solid var(--linea)}
.sectores p{max-width:40rem;font-size:1rem;line-height:1.55;color:var(--texto-2)}
@media (min-width:62rem){
  .sec__dos{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start}
  .sectores li{grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:1.5rem;align-items:baseline}
}

/* 3 · Cómo llega un cliente: pasos (secuencia, con número) y el ejemplo */
.recorrido{display:grid;gap:3rem}
.recorrido > *{min-width:0}
.pasos{margin-top:2rem;counter-reset:paso}
.paso{counter-increment:paso;position:relative;padding:1rem 0 1rem 3rem;border-top:1px solid var(--linea)}
.paso:last-child{border-bottom:1px solid var(--linea)}
.paso::before{content:counter(paso);position:absolute;left:0;top:1rem;width:1.875rem;height:1.875rem;border-radius:50%;display:grid;place-items:center;
  font:700 .875rem/1 var(--f-titulo);font-variant-numeric:tabular-nums;color:var(--texto);border:1.5px solid var(--linea-2)}
.paso p{margin-top:.25rem;max-width:34rem;font-size:1rem;line-height:1.55;color:var(--texto-2)}
.ejemplo__intro{max-width:34rem;font-size:var(--fs-entrada);line-height:1.5;color:var(--texto)}
.chat{margin-top:1.25rem;border-radius:1.25rem;background:var(--sup-1);border:1px solid var(--linea);box-shadow:0 30px 80px rgba(0,0,0,.45);overflow:hidden}
.chat__cab{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;padding:.9rem 1.1rem;border-bottom:1px solid var(--linea)}
.chat__quien{display:grid;line-height:1.25}
.chat__quien b{font-weight:600;font-size:.9375rem}
.chat__quien span{font-size:.8125rem;color:var(--azul-claro)}
.chat__hora{margin-left:auto;font:700 .9375rem/1.2 var(--f-titulo);letter-spacing:-.01em;white-space:nowrap;font-variant-numeric:tabular-nums}
.chat__burbujas{display:flex;flex-direction:column;gap:.5rem;padding:1rem}
.burbuja{max-width:86%;padding:.6rem .85rem;border-radius:1.05rem;font-size:.9375rem;line-height:1.45}
.burbuja--cliente{align-self:flex-start;background:var(--sup-3);border-bottom-left-radius:.3rem}
.burbuja--asistente{align-self:flex-end;background:var(--azul);color:#fff;border-bottom-right-radius:.3rem}
.lunes{margin-top:1rem;padding:1rem 1.1rem 1.1rem;border-radius:1.25rem;background:var(--sup-1);border:1px solid var(--linea)}
.lunes__cabeza{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.25rem 1rem}
.lunes__hora{font:700 1.125rem/1.2 var(--f-titulo);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.lunes__titulo{font-size:.875rem;font-weight:500;color:var(--texto-2)}
.lunes__fila{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--linea)}
.lunes__linea{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.lunes__cliente{font-weight:600}
.lunes__estado{flex:none;font-size:.75rem;font-weight:600;line-height:1;padding:.3rem .5rem;border-radius:999px;border:1px solid var(--azul-claro);color:var(--azul-claro)}
.lunes__ficha-titulo{margin-top:.75rem;font-size:.8125rem;font-weight:600;color:var(--texto-2)}
.lunes__campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1rem;margin-top:.375rem}
.lunes__campos dt{font-size:.8125rem;color:var(--texto-2)}
.lunes__campos dd{font-size:.9375rem;font-weight:600;line-height:1.4}
.cita{display:flex;gap:.7rem;align-items:flex-start;margin-top:1rem;padding:.75rem .9rem .8rem;border-radius:.6rem;background:var(--azul);color:#fff;box-shadow:inset 4px 0 0 rgba(255,255,255,.35)}
.cita__icono{flex:none;width:1.15rem;height:1.15rem;margin-top:.15rem;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.cita__cuerpo{min-width:0}
.cita__titulo{font-weight:600;font-size:.9375rem;line-height:1.35}
.cita__hora{margin-top:.1rem;font-size:.875rem;line-height:1.4;color:rgba(255,255,255,.92)}
.cita__datos{margin-top:.4rem;font-size:.75rem;line-height:1.45;color:rgba(255,255,255,.82)}
.ejemplo__nota{margin-top:.875rem;font-size:.875rem;color:var(--texto-2)}
@media (min-width:62rem){
  .recorrido{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2.5rem,6vw,6rem);align-items:start}
  .ejemplo{position:sticky;top:calc(var(--cab) + 1.5rem)}
}

/* 4 · Lo que montamos: las cuatro capas se arman con el scroll; la lista sin números (son capas, no pasos) */
.capas{display:grid;gap:2.5rem;margin-top:clamp(2.5rem,5vw,4rem)}
.capas__pila{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:min(100%,24rem);padding-bottom:10px}
.capas__losa{display:flex;align-items:center;justify-content:center;height:3rem;border-radius:8px;border:1px solid rgba(234,239,255,.16);
  background:linear-gradient(180deg,#303744,#20252E);font:600 .9375rem/1 var(--f-cuerpo);white-space:nowrap;
  box-shadow:0 10px 26px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08);will-change:transform,opacity}
.capas__losa--vitrina{width:76%}.capas__losa--asistente{width:84%}.capas__losa--cerebro{width:92%}
.capas__losa--equipo{width:100%;border-color:rgba(124,151,255,.5);background:linear-gradient(180deg,#6C8BFF 0%,#2D5BFF 60%,#1F3BFF 100%);color:#fff;
  box-shadow:0 0 36px rgba(45,91,255,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.capas__piso{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(124,151,255,.6) 22%,rgba(124,151,255,.6) 78%,transparent)}
.capas__lista{display:grid;gap:1.75rem}
/* cada descripción se enciende cuando su bloque se arma: la raya azul aparece y el texto pasa de atenuado (contraste AA aún así) a pleno */
.capas__lista li{position:relative;padding-left:1.1rem}
.capas__lista li::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:2px;border-radius:2px;background:var(--azul);opacity:var(--luz,1)}
.js-mov .capas__lista li{opacity:.72;--luz:0;will-change:opacity}
.capas__lista p{margin-top:.4rem;max-width:34rem;font-size:1rem;line-height:1.55;color:var(--texto-2)}
@media (min-width:62rem){
  .capas{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:center}
  .capas__pila{width:100%;max-width:26rem}
  .capas__piso{left:-8%;right:-8%}
  .capas__losa{height:3.5rem;font-size:1rem}
  .capas__lista{row-gap:1.6rem}
}

/* 5 · Tu información: dos casos de fulkro.co (cerrado, oscuro; abierto, azul) */
.sedes{display:grid;gap:1px;margin-top:clamp(2.5rem,5vw,4rem);border-radius:1.5rem;overflow:hidden;border:1px solid var(--linea);background:var(--linea)}
.sede{padding:clamp(1.5rem,4vw,3rem)}
.sede--cerrada{background:var(--sup-0)}
.sede--abierta{background:linear-gradient(180deg,#17224F,#101832)}
.sede__condicion{font-weight:600;font-size:.9375rem;color:var(--azul-claro)}
.sede__lugar{margin-top:.75rem;font:700 clamp(1.375rem,2.4vw,2rem)/1.1 var(--f-titulo);letter-spacing:-.03em;max-width:15em;text-wrap:balance}
.sede > p:last-child{margin-top:1rem;max-width:32rem;color:var(--texto-2)}
.declaracion{margin-top:clamp(2.5rem,5vw,3.5rem);max-width:22em;font:700 clamp(1.5rem,2.6vw,2.25rem)/1.15 var(--f-titulo);letter-spacing:-.03em;text-wrap:balance}
@media (min-width:56rem){ .sedes{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }

/* 6 · Cómo trabajamos */
.trabajo{display:grid;gap:2rem;margin-top:clamp(2.5rem,5vw,3.5rem)}
.trabajo__paso{padding-top:1.25rem;border-top:1px solid var(--linea-2)}
.trabajo__paso > p:not(.sec__nota){margin-top:.6rem;max-width:36rem;color:var(--texto)}
.trabajo__paso .sec__nota{margin-top:1rem}
.clasificador{display:grid;gap:1px;margin-top:clamp(2.5rem,5vw,3.5rem);border:1px solid var(--linea);border-radius:1.25rem;overflow:hidden;background:var(--linea)}
.grupo{padding:1.35rem 1.4rem 1.5rem;background:var(--fondo)}
.grupo h3{font-size:1rem}
.grupo ul{display:grid;gap:.4rem;margin-top:.8rem}
.grupo li{font-size:.9375rem;line-height:1.45;color:var(--texto-2)}
.grupo--ia{background:linear-gradient(180deg,#17224F,#101832)}
.grupo--ia h3{color:var(--azul-claro)}
.grupo--ia li{color:var(--texto)}
@media (min-width:56rem){ .trabajo{grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem} .clasificador{grid-template-columns:repeat(3,minmax(0,1fr))} }

/* 7 · Notas de campo: fichas en orden, separadas por filetes (no tarjetas): el nombre del caso a la izquierda,
   la carga, el punto de apoyo y qué cambió a la derecha */
.casos__propio{margin-top:1.5rem;max-width:36rem;font-size:var(--fs-entrada);line-height:1.5}
.notas{margin-top:clamp(2rem,4vw,3rem);border-bottom:1px solid var(--linea)}
.nota-campo{display:grid;gap:1rem;padding:clamp(1.5rem,3vw,2.25rem) 0;border-top:1px solid var(--linea)}
.nota-campo h3{font:700 clamp(1.25rem,1.8vw,1.5rem)/1.2 var(--f-titulo);letter-spacing:-.02em;max-width:16em;text-wrap:balance}
.ficha{display:grid;gap:.3rem}
.ficha dt{font-size:.875rem;font-weight:600;color:var(--azul-claro)}
.ficha dt:not(:first-child){margin-top:.85rem}
.ficha dd{max-width:40rem;line-height:1.6}
@media (min-width:62rem){
  .nota-campo{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:2rem;align-items:start}
  .ficha{grid-template-columns:10rem minmax(0,1fr);column-gap:1.5rem;row-gap:1rem}
  .ficha div{display:contents}
  .ficha dt:not(:first-child){margin-top:0}
}

/* 8 · Preguntas */
.preguntas{display:grid;gap:2rem}
.preguntas__lista{border-bottom:1px solid var(--linea)}
.pregunta{border-top:1px solid var(--linea)}
.pregunta summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem 0;cursor:pointer;list-style:none;border-radius:.25rem}
.pregunta summary::-webkit-details-marker{display:none}
.pregunta h3{font:600 clamp(1.0625rem,1.4vw,1.25rem)/1.35 var(--f-cuerpo)}
.pregunta__signo{position:relative;flex:none;width:1.05rem;height:1.05rem;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.pregunta__signo::before,.pregunta__signo::after{content:"";position:absolute;left:0;top:50%;width:100%;height:2px;margin-top:-1px;background:var(--azul-claro)}
.pregunta__signo::after{transform:rotate(90deg)}
.pregunta[open] .pregunta__signo{transform:rotate(45deg)}
.pregunta p{padding:0 2.5rem 1.4rem 0;max-width:40rem;color:var(--texto-2)}
@media (min-width:62rem){
  .preguntas{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start}
  .preguntas .sec__titulo{position:sticky;top:calc(var(--cab) + 2rem)}
}

/* 9 · Cierre */
.cierre__titulo{font:700 clamp(2.25rem,5vw,4.5rem)/1.02 var(--f-titulo);letter-spacing:-.04em;max-width:13em;text-wrap:balance}
.cierre__nombre{margin-top:1.5rem;max-width:36rem;font-size:var(--fs-entrada);line-height:1.5;color:var(--texto-2)}
.cierre__texto{margin-top:1rem;max-width:36rem;font-size:var(--fs-entrada);line-height:1.5}
.cierre__accion{margin-top:2rem}
.cierre__nota{margin-top:.75rem;max-width:26rem;font-size:.9375rem;line-height:1.5;color:var(--texto-2)}
.cierre__correo{margin-top:1.75rem;font-size:1rem}

/* ---------- Pie ---------- */
.pie{padding:3rem 0 2.25rem;border-top:1px solid var(--linea)}
.pie__fila{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:2rem}
.pie__descriptor{margin-top:.5rem;font-size:.9375rem;color:var(--texto-2)}
.pie__enlaces{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem}
.pie__enlaces a{color:var(--texto);font-size:.9375rem;text-decoration:none}
.pie__enlaces a:hover{text-decoration:underline}
.pie__enlaces .idioma__op{color:var(--texto-2)}
.pie__enlaces .idioma__op[aria-current="true"]{color:var(--texto)}
.pie__legal{margin-top:2.25rem;padding-top:1.25rem;border-top:1px solid var(--linea);font-size:.8125rem;line-height:1.5;color:var(--texto-2)}

/* ---------- El chat flotante espera a que pase la portada (no tapa la palanca) ---------- */
html .fk-chat-btn{transition:opacity .25s ease,visibility 0s linear 0s,transform .2s}
html.con-portada .fk-chat-btn{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility 0s linear .2s}

/* ---------- Reducir movimiento: nada se mueve solo ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}
}
