/* =============================================================
   learn.css — Centro de conocimiento, blog y guías
   "Laboratorio de cultivo de noche": foto HD + rejilla técnica + aurora del color
   del tema (--ac), ilustraciones vectoriales animadas (img/art/*.svg) y
   lectura clara en claro. Todo el movimiento respeta prefers-reduced-motion.
   ============================================================= */
.lx { --lx-night:#060A07; --lx-ink:#0C130E; --lx-ink2:#111B15; --lx-text:#EAF2EC; --lx-muted:#B4C3B9; --lx-line:rgba(255,255,255,.12);
  --lx-ease:cubic-bezier(.22,.8,.24,1); --ac:#D4F06A; }

/* ── Botones y kicker ───────────────────────────────────────── */
.lx-kicker { display:inline-flex; align-items:center; gap:.6rem; margin:0 0 1rem; font-family:var(--font-mono); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(234,242,236,.85); }
.lx-kicker__dot { width:8px; height:8px; border-radius:50%; background:var(--ac); box-shadow:0 0 0 4px color-mix(in srgb,var(--ac) 22%,transparent),0 0 18px var(--ac); animation:lxPulse 2.4s ease-in-out infinite; }
@keyframes lxPulse { 50% { box-shadow:0 0 0 9px color-mix(in srgb,var(--ac) 0%,transparent),0 0 26px var(--ac); } }
.lx-btn { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; min-height:52px; padding:.9rem 1.5rem; border-radius:999px; font-family:var(--font-display); font-weight:700; font-size:1rem; text-decoration:none; transition:transform .25s var(--lx-ease),box-shadow .25s,background .25s; }
.lx-btn svg { transition:transform .25s var(--lx-ease); }
.lx-btn:hover { transform:translateY(-2px); } .lx-btn:hover svg { transform:translateX(4px); }
.lx-btn:focus-visible { outline:2px solid #fff; outline-offset:3px; }
.lx-btn--glow { background:var(--ac); color:#06100A; box-shadow:0 0 0 1px color-mix(in srgb,var(--ac) 70%,#fff),0 14px 44px -12px var(--ac),inset 0 1px 0 rgba(255,255,255,.5); }
.lx-btn--glass { background:rgba(255,255,255,.07); color:#fff; border:1px solid rgba(255,255,255,.26); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.lx-btn--glass:hover { background:rgba(255,255,255,.14); color:#fff; }

/* ── Fondo de los héroes: foto + rejilla + aurora ───────────── */
.lx-hero, .lx-phero { position:relative; isolation:isolate; overflow:hidden; background:var(--lx-night); color:var(--lx-text); }
.lx-hero__bg { position:absolute; inset:0; z-index:-1; }
.lx-hero__photo, .lx-phero__photo { position:absolute; inset:-6%; width:112%; height:112%; max-width:none; object-fit:cover; opacity:.42; filter:saturate(.9) contrast(1.05);
  animation:lxKen 26s ease-in-out infinite alternate; }
@keyframes lxKen { to { transform:scale(1.08) translate3d(-1.5%,-1%,0); } }
.lx-hero__bg::after { content:""; position:absolute; inset:0; background:
  linear-gradient(90deg,rgba(6,10,7,.96) 0%,rgba(6,10,7,.78) 40%,rgba(6,10,7,.35) 75%,rgba(6,10,7,.55) 100%),
  linear-gradient(0deg,var(--lx-night) 0%,rgba(6,10,7,0) 40%); }
.lx-hero__grid { position:absolute; inset:0; z-index:1; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:56px 56px; -webkit-mask-image:radial-gradient(ellipse 70% 70% at 70% 40%,#000,transparent 75%); mask-image:radial-gradient(ellipse 70% 70% at 70% 40%,#000,transparent 75%);
  animation:lxGrid 18s linear infinite; }
@keyframes lxGrid { to { background-position:56px 56px,56px 56px; } }
.lx-hero__aurora { position:absolute; z-index:1; width:900px; height:900px; right:-240px; top:-380px; border-radius:50%; mix-blend-mode:screen;
  background:radial-gradient(circle,color-mix(in srgb,var(--ac) 30%,transparent),transparent 62%); animation:lxAur 12s ease-in-out infinite alternate; }
@keyframes lxAur { to { transform:translate3d(-120px,90px,0) scale(1.12); } }

/* ── Hero del centro de conocimiento ───────────────────────── */
.lx-hero__inner { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,4vw,4rem); align-items:center; min-height:min(700px,calc(100svh - 160px)); padding-block:clamp(3rem,7vh,5.5rem); }
.lx-hero__title { margin:0 0 1.1rem; color:#fff; font-size:clamp(2.4rem,5.6vw,4.6rem); line-height:1.02; letter-spacing:-.035em; text-wrap:balance; }
.lx-hero__title > span { display:block; }
.lx-hero__grad { background:linear-gradient(100deg,#D4F06A 0%,#5BF08F 35%,#FFD166 70%,#D4F06A 100%); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:lxShine 8s linear infinite; }
@keyframes lxShine { to { background-position:-220% 0; } }
.lx-hero__lead { max-width:56ch; margin:0 0 1.8rem; font-size:clamp(1.05rem,1.4vw,1.2rem); line-height:1.6; color:var(--lx-muted); }
.lx-hero__actions { display:flex; flex-wrap:wrap; gap:.8rem; }
.lx-stats { display:flex; gap:clamp(1.4rem,3vw,2.6rem); margin:2.2rem 0 0; padding-top:1.4rem; border-top:1px solid var(--lx-line); }
.lx-stats div { margin:0; } .lx-stats dt { order:2; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--lx-muted); }
.lx-stats div { display:flex; flex-direction:column-reverse; }
.lx-stats dd { margin:0; font:700 clamp(2rem,3.4vw,2.8rem)/1 var(--font-display); color:#fff; font-variant-numeric:tabular-nums; }
/* entrada escalonada del hero */
.lx-hero__copy > *, .lx-phero__copy > * { animation:lxIn .9s var(--lx-ease) both; }
.lx-hero__copy > :nth-child(2), .lx-phero__copy > :nth-child(3) { animation-delay:.08s; }
.lx-hero__copy > :nth-child(3), .lx-phero__copy > :nth-child(4) { animation-delay:.16s; }
.lx-hero__copy > :nth-child(4), .lx-phero__copy > :nth-child(5) { animation-delay:.24s; }
.lx-hero__copy > :nth-child(5), .lx-phero__copy > :nth-child(6) { animation-delay:.32s; }
@keyframes lxIn { from { opacity:0; transform:translateY(22px); filter:blur(6px); } }

/* Mapa de recorridos */
.lx-map { position:relative; aspect-ratio:600/480; width:100%; max-width:620px; justify-self:end; }
.lx-map__svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.lx-map__route { stroke-dasharray:1400; stroke-dashoffset:1400; animation:lxRoute 2.6s cubic-bezier(.6,0,.2,1) .4s forwards; }
@keyframes lxRoute { to { stroke-dashoffset:0; } }
.lx-map__halo { transform-box:fill-box; transform-origin:center; animation:lxHalo 3s ease-out infinite; }
@keyframes lxHalo { 0% { transform:scale(.6); opacity:.5; } 100% { transform:scale(2.1); opacity:0; } }
.lx-map__node { position:absolute; transform:translate(-50%,calc(-100% - 22px)); display:flex; align-items:center; gap:.55rem; padding:.45rem .85rem .45rem .45rem;
  border-radius:999px; background:rgba(12,19,14,.78); border:1px solid color-mix(in srgb,var(--ac) 45%,transparent); color:#fff; text-decoration:none; white-space:nowrap;
  font:600 .88rem var(--font-display); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); box-shadow:0 10px 30px -12px var(--ac);
  transition:transform .3s var(--lx-ease),background .3s; animation:lxIn .8s var(--lx-ease) both; }
.lx-map__node--b { transform:translate(-50%,22px); }
.lx-map__node--r { transform:translate(-78%,22px); }
.lx-map__node--b:first-of-type { transform:translate(-22%,22px); }
.lx-map__node:nth-of-type(1){animation-delay:.9s}.lx-map__node:nth-of-type(2){animation-delay:1.2s}.lx-map__node:nth-of-type(3){animation-delay:1.5s}.lx-map__node:nth-of-type(4){animation-delay:1.8s}.lx-map__node:nth-of-type(5){animation-delay:2.1s}
.lx-map__node b { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--ac); color:#06100A; font:700 .72rem var(--font-mono); }
.lx-map__node:hover, .lx-map__node:focus-visible { background:color-mix(in srgb,var(--ac) 22%,rgba(12,19,14,.9)); color:#fff; outline:none; }
.lx-scrollcue { position:absolute; left:50%; bottom:18px; width:26px; height:42px; margin-left:-13px; border:2px solid rgba(255,255,255,.35); border-radius:14px; }
.lx-scrollcue span { position:absolute; left:50%; top:8px; width:4px; height:8px; margin-left:-2px; border-radius:2px; background:#fff; animation:lxCue 1.8s ease-in-out infinite; }
@keyframes lxCue { 60% { transform:translateY(12px); opacity:0; } 61% { transform:none; opacity:0; } }

/* ── Capítulos (recorridos) ─────────────────────────────────── */
.lx-chapters { background:var(--lx-night); color:var(--lx-text); padding-block:clamp(2rem,5vw,4rem); }
.lx-ch { position:relative; padding-block:clamp(2.5rem,6vw,5rem); scroll-margin-top:90px; }
.lx-ch + .lx-ch::before { content:""; position:absolute; top:0; left:50%; width:min(1100px,90%); height:1px; transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--ac) 40%,transparent),transparent); }
.lx-ch__inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2rem,5vw,5rem); align-items:center; }
.lx-ch--flip .lx-ch__art { order:2; }
.lx-ch__art { position:relative; aspect-ratio:1; border-radius:32px; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 50% 40%,#13201A,var(--lx-ink) 70%);
  border:1px solid color-mix(in srgb,var(--ac) 28%,transparent); box-shadow:0 40px 120px -50px var(--ac),inset 0 1px 0 rgba(255,255,255,.08); }
.lx-ch__photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.3; z-index:-2; transform:scale(1.15); transition:transform 1.6s var(--lx-ease),opacity 1.2s; }
.lx-ch__veil { position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at 50% 50%,rgba(6,10,7,.25),rgba(6,10,7,.92) 75%); }
.lx-ch__svg { position:absolute; inset:4%; width:92%; height:92%; }
.lx-ch__big { position:absolute; left:6%; bottom:2%; font:800 clamp(5rem,11vw,9rem)/1 var(--font-display); letter-spacing:-.06em; color:transparent;
  -webkit-text-stroke:1.5px color-mix(in srgb,var(--ac) 55%,transparent); pointer-events:none; }
.lx-ch__kicker { margin:0 0 .6rem; font-family:var(--font-mono); font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ac); }
.lx-ch__title { margin:0 0 .8rem; color:#fff; font-size:clamp(2rem,3.8vw,3.2rem); line-height:1.04; letter-spacing:-.03em; }
.lx-ch__desc { margin:0 0 1.6rem; color:var(--lx-muted); font-size:1.08rem; line-height:1.6; max-width:52ch; }
.lx-steps { position:relative; list-style:none; margin:0 0 1.8rem; padding:0; display:grid; gap:.6rem; }
.lx-steps::before { content:""; position:absolute; left:23px; top:24px; bottom:24px; width:2px; background:var(--lx-line); }
.lx-steps::after { content:""; position:absolute; left:23px; top:24px; bottom:24px; width:2px; background:linear-gradient(var(--ac),color-mix(in srgb,var(--ac) 30%,transparent));
  transform-origin:top; transform:scaleY(var(--lx-fill,1)); box-shadow:0 0 12px var(--ac); }
.lx-step a { position:relative; display:flex; align-items:center; gap:1rem; padding:.7rem 1rem .7rem 0; border-radius:16px; color:var(--lx-text); text-decoration:none; transition:background .25s,transform .25s var(--lx-ease); }
.lx-step a:hover, .lx-step a:focus-visible { background:rgba(255,255,255,.05); transform:translateX(6px); outline:none; }
.lx-step__n { position:relative; z-index:1; flex:none; display:grid; place-items:center; width:48px; height:48px; border-radius:50%; background:var(--lx-ink2);
  border:2px solid color-mix(in srgb,var(--ac) 70%,transparent); color:#fff; font:700 1rem var(--font-mono); transition:background .3s,color .3s,box-shadow .3s; }
.lx-step a:hover .lx-step__n { background:var(--ac); color:#06100A; box-shadow:0 0 0 6px color-mix(in srgb,var(--ac) 18%,transparent); }
.lx-step__txt { display:grid; gap:.2rem; flex:1; }
.lx-step__txt strong { font:600 1.05rem/1.3 var(--font-display); color:#fff; }
.lx-step__txt small { display:inline-flex; align-items:center; gap:.35rem; color:var(--lx-muted); font-size:.82rem; }
.lx-step__txt small svg { width:14px; height:14px; color:var(--ac); }
.lx-step__go { color:var(--ac); opacity:0; transform:translateX(-6px); transition:.25s var(--lx-ease); }
.lx-step a:hover .lx-step__go { opacity:1; transform:none; }
.lx-ch__foot { display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem 1.6rem; }
.lx-ch__shop { color:var(--ac); font-weight:700; text-decoration:none; border-bottom:1px solid color-mix(in srgb,var(--ac) 40%,transparent); }
.lx-ch__shop:hover { color:#fff; border-color:#fff; }
/* animación al entrar en pantalla (la añade learn.js; sin JS se ve todo) */
.js .lx-ch:not(.is-in) .lx-ch__body > * { opacity:0; transform:translateY(26px); }
.js .lx-ch:not(.is-in) .lx-step { opacity:0; transform:translateX(-18px); }
.js .lx-ch:not(.is-in) .lx-steps { --lx-fill:0; }
.js .lx-ch:not(.is-in) .lx-ch__art { opacity:0; transform:scale(.94) translateY(30px); }
.lx-ch__body > *, .lx-step, .lx-ch__art { transition:opacity .9s var(--lx-ease),transform .9s var(--lx-ease); }
.lx-ch__body > :nth-child(2){transition-delay:.06s}.lx-ch__body > :nth-child(3){transition-delay:.12s}.lx-ch__body > :nth-child(5){transition-delay:.5s}
.lx-step { transition-delay:calc(.2s + var(--i) * .09s); }
.lx-steps::after { transition:transform 1.4s cubic-bezier(.6,0,.2,1) .25s; }
.lx-ch.is-in .lx-ch__photo { transform:scale(1); }

/* ── Biblioteca / tarjetas ──────────────────────────────────── */
.lx-lib { background:linear-gradient(180deg,var(--lx-night),#0A110C); color:var(--lx-text); padding-block:clamp(3rem,7vw,6rem); }
.lx-lib h2 { color:#fff; font-size:clamp(1.9rem,3.4vw,2.8rem); letter-spacing:-.03em; margin:0 0 .5rem; }
.lx-lib__head { max-width:640px; margin-bottom:1.6rem; } .lx-lib__head p { color:var(--lx-muted); margin:0; }
.lx-filter { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.8rem; }
.lx-filter button { min-height:44px; display:inline-flex; align-items:center; gap:.45rem; padding:.5rem 1rem; border-radius:999px; border:1px solid var(--lx-line);
  background:rgba(255,255,255,.04); color:var(--lx-text); font:600 .92rem var(--font-body); cursor:pointer; transition:.2s; }
.lx-filter button span { font:500 .72rem var(--font-mono); color:var(--lx-muted); }
.lx-filter button:hover { border-color:rgba(255,255,255,.35); }
.lx-filter button.is-on { background:#D4F06A; border-color:#D4F06A; color:#06100A; } .lx-filter button.is-on span { color:#06100A; }
.lx-filter button:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.lx-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:1.1rem; }
.lx-card { position:relative; display:flex; flex-direction:column; border-radius:22px; overflow:hidden; text-decoration:none; color:var(--lx-text);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015)); border:1px solid var(--lx-line);
  transition:transform .35s var(--lx-ease),border-color .35s,box-shadow .35s; }
.lx-card:hover, .lx-card:focus-visible { transform:translateY(-6px); border-color:color-mix(in srgb,var(--ac) 55%,transparent); box-shadow:0 30px 70px -40px var(--ac); outline:none; color:var(--lx-text); }
.lx-card[hidden] { display:none; }
.lx-card__art { position:relative; display:block; aspect-ratio:16/10; overflow:hidden; background:radial-gradient(circle at 50% 55%,color-mix(in srgb,var(--ac) 16%,#101A14),var(--lx-ink) 72%); }
.lx-card__art img { position:absolute; left:50%; top:50%; width:78%; height:auto; transform:translate(-50%,-50%) scale(1.15); transition:transform .8s var(--lx-ease); }
.lx-card:hover .lx-card__art img { transform:translate(-50%,-50%) scale(1.3); }
.lx-card__art::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(6,10,7,.65),transparent 45%); }
.lx-card__body { display:flex; flex-direction:column; gap:.55rem; padding:1.1rem 1.2rem 1.3rem; flex:1; }
.lx-card__tag { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ac); }
.lx-card__body strong { font:600 1.12rem/1.3 var(--font-display); color:#fff; letter-spacing:-.01em; }
.lx-card__ex { color:var(--lx-muted); font-size:.92rem; line-height:1.55; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.lx-card__more { margin-top:auto; display:inline-flex; align-items:center; gap:.4rem; padding-top:.4rem; color:#fff; font-weight:700; font-size:.92rem; }
.lx-card__more svg { width:16px; height:16px; color:var(--ac); transition:transform .25s var(--lx-ease); }
.lx-card:hover .lx-card__more svg { transform:translateX(5px); }
.js .lx-card.lx-pre { opacity:0; transform:translateY(24px); }
.lx-card.lx-show { animation:lxIn .7s var(--lx-ease) both; }

/* Destacado del blog */
.lx-feature { position:relative; display:grid; grid-template-rows:1fr auto; border-radius:28px; overflow:hidden; text-decoration:none; color:#fff; max-width:520px; justify-self:end; width:100%;
  background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--ac) 18%,#101A14),var(--lx-ink) 70%); border:1px solid color-mix(in srgb,var(--ac) 35%,transparent);
  box-shadow:0 40px 120px -50px var(--ac); animation:lxIn 1s var(--lx-ease) .3s both; transition:transform .35s var(--lx-ease); }
.lx-feature:hover { transform:translateY(-6px); color:#fff; }
.lx-feature__art { display:block; aspect-ratio:4/3; overflow:hidden; } .lx-feature__svg { width:100%; height:100%; transform:scale(1.15); }
.lx-feature__body { display:grid; gap:.5rem; padding:1.3rem 1.5rem 1.5rem; background:linear-gradient(0deg,rgba(6,10,7,.9),rgba(6,10,7,.4)); }
.lx-feature__body strong { font:700 1.35rem/1.25 var(--font-display); }

/* CTA final del centro */
.lx-cta { background:#0A110C; padding-block:0 clamp(3rem,7vw,5rem); }
.lx-cta__inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.5rem; padding:clamp(1.6rem,4vw,2.8rem); border-radius:28px;
  background:linear-gradient(120deg,#13251A,#0C130E 60%); border:1px solid rgba(212,240,106,.25); color:var(--lx-text); }
.lx-cta h2 { color:#fff; margin:0 0 .4rem; font-size:clamp(1.5rem,2.6vw,2.1rem); } .lx-cta p { margin:0; color:var(--lx-muted); max-width:56ch; }
.lx-cta__btns { display:flex; flex-wrap:wrap; gap:.8rem; }

/* ── Artículo ───────────────────────────────────────────────── */
.lx-phero__inner { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(1.5rem,4vw,3.5rem); align-items:center; padding-block:clamp(1.2rem,3vw,2rem) clamp(2.5rem,6vw,4.5rem); }
.lx-phero .breadcrumbs { background:transparent; border:0; margin:0 0 1.4rem; }
.lx-phero .breadcrumbs .container { padding:0 !important; margin:0; max-width:none; width:auto; }
.lx-phero .breadcrumbs ol { padding:0; color:var(--lx-muted); }
.lx-phero .breadcrumbs a { color:var(--lx-muted); } .lx-phero .breadcrumbs a:hover { color:#fff; }
.lx-phero .breadcrumbs [aria-current] { color:#fff; display:inline-block; max-width:38ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:bottom; }
.lx-phero__title { margin:0 0 1rem; color:#fff; font-size:clamp(2.1rem,4.6vw,3.7rem); line-height:1.05; letter-spacing:-.03em; text-wrap:balance; }
.lx-phero__lead { margin:0 0 1.4rem; max-width:60ch; color:var(--lx-muted); font-size:clamp(1.05rem,1.4vw,1.18rem); line-height:1.6; }
.lx-phero__meta { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1.2rem; color:var(--lx-muted); font-size:.92rem; }
.lx-phero__meta > span { display:inline-flex; align-items:center; gap:.4rem; } .lx-phero__meta svg { width:16px; height:16px; color:var(--ac); }
.lx-phero__author { color:#fff; font-weight:700; }
.lx-phero__dot { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--ac); color:#06100A; font:800 .64rem var(--font-mono); }
.lx-phero__route { position:relative; display:inline-flex; align-items:center; gap:.6rem; margin-top:1.4rem; padding:.7rem 1rem; border-radius:14px; overflow:hidden;
  background:rgba(255,255,255,.06); border:1px solid color-mix(in srgb,var(--ac) 35%,transparent); color:var(--lx-text); text-decoration:none; font-size:.92rem; }
.lx-phero__route svg { color:var(--ac); flex:none; } .lx-phero__route strong { color:#fff; }
.lx-phero__route:hover { background:rgba(255,255,255,.1); color:var(--lx-text); }
.lx-phero__bar { position:absolute; left:0; bottom:0; height:3px; width:var(--p); background:var(--ac); box-shadow:0 0 10px var(--ac); animation:lxBar 1.4s var(--lx-ease) .6s both; }
@keyframes lxBar { from { width:0; } }
.lx-phero__art { position:relative; aspect-ratio:1; max-width:440px; width:100%; justify-self:end; animation:lxArt 1.2s var(--lx-ease) .2s both; }
.lx-phero__art::before { content:""; position:absolute; inset:8%; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--ac) 22%,transparent),transparent 68%); filter:blur(10px); }
.lx-phero__svg { position:relative; width:100%; height:100%; }
@keyframes lxArt { from { opacity:0; transform:scale(.86) rotate(-6deg); } }
.lx-phero--nophoto .lx-hero__aurora { opacity:1.0; }

/* Lectura */
.lx-layout { padding-top:clamp(2rem,4vw,3rem); }
.lx-body { font-size:1.08rem; }
.lx-body > p:first-of-type { font-size:1.18rem; line-height:1.7; color:var(--c-text); }
.lx-body h2 { position:relative; margin-top:3.2rem; padding-top:1.4rem; font-size:clamp(1.55rem,2.6vw,2rem); letter-spacing:-.02em; scroll-margin-top:100px; }
.lx-body h2::before { content:""; position:absolute; left:0; top:0; width:56px; height:4px; border-radius:2px; background:linear-gradient(90deg,var(--c-primary),var(--ac));
  transform-origin:left; transition:transform .9s var(--lx-ease); }
.js .lx-body h2:not(.is-in)::before { transform:scaleX(0); }
.lx-body h3 { margin-top:2rem; }
.lx-body ul > li::marker { color:var(--c-primary); }
.lx-body ol { counter-reset:lxo; list-style:none; padding-left:0; gap:.7rem; }
.lx-body ol > li { counter-increment:lxo; position:relative; padding:.2rem 0 .2rem 3rem; min-height:2.2rem; }
.lx-body ol > li::before { content:counter(lxo); position:absolute; left:0; top:0; display:grid; place-items:center; width:2.1rem; height:2.1rem; border-radius:50%;
  background:#0C130E; color:#D4F06A; font:700 .9rem var(--font-mono); box-shadow:0 0 0 4px rgba(43,122,61,.12); }
.lx-body ol > li + li::after { content:""; position:absolute; left:1.05rem; top:-.7rem; width:2px; height:.7rem; background:rgba(43,122,61,.25); }
/* Tarjetas de cita: resumen, truco, aviso */
.lx-call { position:relative; display:flex; gap:1rem; margin:1.8rem 0; padding:1.3rem 1.4rem; border-radius:20px; font-style:normal; overflow:hidden; }
.lx-call > div > p { margin:0; } .lx-call > div > p + p { margin-top:.6rem; }
.lx-call__ico { flex:none; display:grid; place-items:center; width:42px; height:42px; border-radius:12px; }
.lx-call--tldr { background:linear-gradient(135deg,#0C130E,#14261B); color:#EAF2EC; box-shadow:0 30px 60px -40px rgba(12,19,14,.9); border:1px solid rgba(212,240,106,.3); }
.lx-call--tldr::after { content:""; position:absolute; right:-80px; top:-80px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle,rgba(212,240,106,.22),transparent 65%); animation:lxAur 9s ease-in-out infinite alternate; pointer-events:none; }
.lx-call--tldr strong { color:#D4F06A; } .lx-call--tldr a { color:#D4F06A; }
.lx-call--tldr .lx-call__ico { background:#D4F06A; color:#06100A; }
.lx-call--tip { background:#F3FAEC; border:1px solid #CFE8C0; } .lx-call--tip .lx-call__ico { background:var(--c-primary-d); color:#fff; }
.lx-call--warn { background:#FFF6EA; border:1px solid #F5D3A6; } .lx-call--warn .lx-call__ico { background:#B4530F; color:#fff; }
.lx-call--note { background:var(--c-bg); border:1px solid var(--c-border); } .lx-call--note .lx-call__ico { background:#0C130E; color:#D4F06A; }
.lx-call p { font-size:1.02rem; line-height:1.65; }
/* Tablas */
.lx-table { margin:1.8rem 0; overflow-x:auto; border-radius:18px; border:1px solid var(--c-border); box-shadow:0 20px 50px -36px rgba(12,19,14,.5); -webkit-overflow-scrolling:touch; }
.lx-table table { margin:0; min-width:520px; }
.lx-table thead th { background:#0C130E; color:#EAF2EC; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; padding:.85rem 1rem; }
.lx-table tbody td { padding:.8rem 1rem; }
.lx-table tbody tr { transition:background .2s; } .lx-table tbody tr:hover { background:#F3FAEC; }
.lx-table tbody td:first-child { font-weight:700; color:var(--c-text); }
/* Índice con progreso */
@media (min-width:1080px) {
  .lx-toc .post-toc__title { display:flex; justify-content:space-between; align-items:center; }
  .lx-toc__pct { font-family:var(--font-mono); color:var(--c-primary-d); letter-spacing:0; }
  .lx-toc__track { height:3px; border-radius:2px; background:var(--c-border); margin:0 0 1rem; overflow:hidden; }
  .lx-toc__track i { display:block; height:100%; width:100%; transform-origin:left; transform:scaleX(var(--lx-read,0)); background:linear-gradient(90deg,var(--c-primary),var(--ac)); }
  .lx-toc ol { border-left-color:var(--c-border); }
  .lx-toc li { position:relative; transition:.2s; }
  .lx-toc li::before { content:""; position:absolute; left:-2px; top:0; bottom:0; width:2px; background:var(--c-primary); transform:scaleY(0); transition:transform .3s var(--lx-ease); }
  .lx-toc li.is-on::before { transform:scaleY(1); }
  .lx-toc li.is-on a { color:var(--c-text); font-weight:700; }
  .lx-toc li.is-done a { color:var(--c-primary-d); }
}
/* Siguiente paso del recorrido */
.lx-next { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:2.4rem 0; }
.lx-next__a { display:grid; gap:.3rem; padding:1.1rem 1.3rem; border-radius:18px; background:#0C130E; color:#EAF2EC; text-decoration:none; border:1px solid rgba(255,255,255,.08); transition:transform .3s var(--lx-ease),box-shadow .3s; }
.lx-next__a small { font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:#D4F06A; }
.lx-next__a strong { font:600 1.02rem/1.35 var(--font-display); color:#fff; }
.lx-next__a:hover { transform:translateY(-3px); box-shadow:0 20px 50px -30px var(--ac); color:#EAF2EC; }
.lx-next__a--next { text-align:right; grid-column:2; }
.lx-endcta { position:relative; overflow:hidden; }
/* Relacionados (oscuro) */
.lx-lib--related { margin-top:clamp(2rem,5vw,4rem); }
.lx-lib--related .back { margin:2rem 0 0; color:var(--lx-muted); } .lx-lib--related .back a { color:#D4F06A; }


/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width:980px) {
  .lx-hero__inner, .lx-phero__inner { grid-template-columns:1fr; min-height:0; }
  .lx-map { justify-self:center; max-width:560px; margin-top:.5rem; }
  .lx-ch__inner { grid-template-columns:1fr; }
  .lx-ch--flip .lx-ch__art { order:0; }
  .lx-ch__art { max-width:520px; width:100%; justify-self:center; }
  .lx-phero__inner { position:relative; }
  .lx-phero__art { position:absolute; right:-30px; top:30px; width:260px; max-width:none; opacity:.5; pointer-events:none; z-index:-1; }
  .lx-feature { justify-self:stretch; max-width:none; }
  .lx-scrollcue { display:none; }
}
@media (max-width:640px) {
  .lx-hero__inner { padding-block:2.2rem 2.6rem; }
  .lx-hero__actions .lx-btn { flex:1 1 100%; }
  .lx-stats { gap:1.2rem; }
  .lx-map { aspect-ratio:auto; display:grid; gap:.5rem; }
  .lx-map__svg { display:none; }
  .lx-map__node, .lx-map__node--b { position:static; transform:none; white-space:normal; }
  .lx-ch__art { border-radius:24px; }
  .lx-step a { padding-right:.4rem; }
  .lx-step__go { display:none; }
  .lx-phero__art { width:200px; right:-50px; top:60px; opacity:.42; }
  .lx-phero .breadcrumbs [aria-current] { max-width:20ch; }
  .lx-next { grid-template-columns:1fr; } .lx-next__a--next { grid-column:auto; }
  .lx-call { flex-direction:column; gap:.7rem; padding:1.1rem; }
  .lx-cta__btns > * { flex:1 1 100%; }
}
@media (prefers-reduced-motion:reduce) {
  .lx *, .lx *::before, .lx *::after { animation:none !important; transition:none !important; }
  .lx-map__route { stroke-dashoffset:0; }
  .js .lx-ch:not(.is-in) .lx-ch__body > *, .js .lx-ch:not(.is-in) .lx-step, .js .lx-ch:not(.is-in) .lx-ch__art, .js .lx-card.lx-pre { opacity:1; transform:none; }
}