/* Menú, pie de página y bloque de blog compartidos por todas las páginas.
   Todo lleva el prefijo lc- para no chocar con el estilo propio de cada página. */
:root {
  --lc-negro: #0A0A0A; --lc-panel: #121211; --lc-linea: rgba(201,168,76,.22);
  --lc-dorado: #C9A84C; --lc-dorado-claro: #E8C96A; --lc-marfil: #F4EFE3; --lc-gris: rgba(244,239,227,.62);
  --lc-serif: 'Playfair Display', Georgia, serif; --lc-sans: 'DM Sans', system-ui, sans-serif;
}

/* ── Encabezado ── */
.lc-header { position: fixed; top: 0; left: 0; right: 0; z-index: 300; font-family: var(--lc-sans); }
.lc-banner { background: var(--lc-negro); border-bottom: 1px solid rgba(201,168,76,.4); color: rgba(201,168,76,.9); text-align: center; padding: 9px 20px; font-size: 12px; letter-spacing: 1.5px; line-height: 1.5; }
.lc-banner strong { color: var(--lc-dorado); }
.lc-bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 70px; padding: 0 6vw; background: rgba(10,10,10,.92); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-bottom: .5px solid var(--lc-linea); transition: height .3s ease; }
.lc-header.lc-scrolled .lc-bar { height: 58px; }
.lc-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; flex-shrink: 0; }
.lc-brand svg { width: 38px; height: 38px; }
.lc-brand span { font-family: var(--lc-serif); font-weight: 700; font-size: 20px; color: var(--lc-marfil); letter-spacing: -.2px; white-space: nowrap; }
.lc-header nav.lc-nav { all: revert; display: block; }
.lc-links { display: flex; align-items: center; gap: 28px; list-style: none; margin: 0; padding: 0; }
.lc-links > li { position: relative; }
.lc-links > li > a { display: inline-flex; align-items: center; gap: 5px; color: var(--lc-gris); text-decoration: none; font-size: 13.5px; letter-spacing: .3px; padding: 8px 0; transition: color .2s; }
.lc-links > li > a:hover, .lc-links > li > a:focus-visible, .lc-links > li > a[aria-current="page"], .lc-links > li > a.lc-activo { color: var(--lc-dorado); }
.lc-links svg { width: 10px; height: 10px; transition: transform .2s; }
.lc-drop:hover > a svg, .lc-drop:focus-within > a svg { transform: rotate(180deg); }
.lc-drop-panel { position: absolute; top: 100%; left: 50%; width: 300px; padding: 10px; margin-top: 8px; background: var(--lc-panel); border: 1px solid var(--lc-linea); border-radius: 14px; box-shadow: 0 24px 48px rgba(0,0,0,.45); display: flex; flex-direction: column; gap: 2px; opacity: 0; visibility: hidden; transform: translate(-50%, 6px); transition: opacity .2s, transform .2s, visibility .2s; }
.lc-drop-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.lc-drop:hover .lc-drop-panel, .lc-drop:focus-within .lc-drop-panel { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.lc-drop-panel a { display: flex; flex-direction: column; gap: 2px; padding: 11px 14px; border-radius: 9px; text-decoration: none; transition: background .2s; }
.lc-drop-panel a:hover, .lc-drop-panel a:focus-visible { background: rgba(201,168,76,.09); }
.lc-drop-panel b { color: var(--lc-marfil); font-weight: 500; font-size: 14px; }
.lc-drop-panel span { color: var(--lc-gris); font-size: 12.5px; }
.lc-drop-panel .lc-drop-todos { color: var(--lc-dorado); font-size: 13px; border-top: 1px solid var(--lc-linea); border-radius: 0 0 9px 9px; margin-top: 4px; }
.lc-cta { background: var(--lc-dorado); color: var(--lc-negro); padding: 10px 22px; border-radius: 40px; font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .2s, transform .2s; }
.lc-cta:hover { background: var(--lc-dorado-claro); transform: translateY(-1px); }
.lc-burger { display: none; background: none; border: 0; padding: 10px; margin-right: -10px; cursor: pointer; }
.lc-burger span { display: block; width: 22px; height: 2px; margin: 5px 0; background: var(--lc-marfil); border-radius: 2px; transition: transform .3s, opacity .3s; }
.lc-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.lc-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.lc-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Menú del celular */
.lc-mmenu { position: fixed; inset: 0; z-index: 290; background: var(--lc-negro); overflow-y: auto; padding: calc(var(--lc-alto, 70px) + 24px) 7vw 40px; display: flex; flex-direction: column; gap: 4px; font-family: var(--lc-sans); }
.lc-mmenu[hidden] { display: none; }
.lc-mmenu a { color: var(--lc-marfil); text-decoration: none; font-family: var(--lc-serif); font-size: 26px; padding: 8px 0; }
.lc-mmenu a[aria-current="page"], .lc-mmenu a.lc-activo { color: var(--lc-dorado); }
.lc-mmenu .lc-m-grupo { display: flex; flex-direction: column; gap: 2px; padding: 4px 0 10px 16px; border-left: 1px solid var(--lc-linea); margin: 0 0 6px 4px; }
.lc-mmenu .lc-m-grupo a { font-family: var(--lc-sans); font-size: 16px; color: var(--lc-gris); padding: 6px 0; }
.lc-mmenu .lc-cta { font-family: var(--lc-sans); font-size: 16px; text-align: center; padding: 15px 22px; margin-top: 20px; color: var(--lc-negro); }

@media (max-width: 1080px) {
  .lc-links { gap: 20px; }
}
@media (max-width: 960px) {
  .lc-nav, .lc-bar > .lc-cta { display: none !important; }
  .lc-burger { display: block; }
  .lc-bar { padding: 0 5vw; }
}
@media (max-width: 420px) {
  .lc-brand span { font-size: 18px; }
  .lc-brand svg { width: 34px; height: 34px; }
  .lc-banner { font-size: 11px; letter-spacing: 1px; padding: 8px 14px; }
}

/* ── Bloque de blog ── */
.lc-blog { background: #0F0F0E; border-top: .5px solid var(--lc-linea); padding: 88px 8vw; font-family: var(--lc-sans); color: var(--lc-marfil); }
.lc-blog-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin-bottom: 40px; }
.lc-eyebrow { display: block; font-size: 11px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase; color: var(--lc-dorado); margin-bottom: 14px; }
.lc-blog h2 { font-family: var(--lc-serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.12; margin: 0; color: var(--lc-marfil); }
.lc-blog h2 em { color: var(--lc-dorado); font-style: italic; }
.lc-blog-todos { color: var(--lc-dorado); text-decoration: none; font-size: 14px; white-space: nowrap; }
.lc-blog-todos:hover { text-decoration: underline; }
.lc-blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.lc-blog-grid.lc-dos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lc-post { display: flex; flex-direction: column; gap: 12px; padding: 30px 28px; background: #151514; border: 1px solid rgba(201,168,76,.12); border-radius: 16px; text-decoration: none; transition: border-color .25s, transform .25s; min-width: 0; }
.lc-post:hover { border-color: rgba(201,168,76,.45); transform: translateY(-3px); }
.lc-post small { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--lc-dorado); }
.lc-post h3 { font-family: var(--lc-serif); font-weight: 700; font-size: 20px; line-height: 1.3; margin: 0; color: var(--lc-marfil); }
.lc-post p { margin: 0; color: var(--lc-gris); font-size: 14.5px; line-height: 1.7; flex: 1; }
.lc-post span { color: var(--lc-dorado); font-size: 13.5px; }
@media (max-width: 860px) { .lc-blog-grid, .lc-blog-grid.lc-dos { grid-template-columns: minmax(0, 1fr); } .lc-blog { padding: 64px 6vw; } }

/* ── Precio "desde" dentro de las páginas de servicio ── */
.lc-precio { font-family: var(--lc-sans); font-size: 15px; color: var(--lc-gris); margin: 0 0 18px; }
.lc-precio b { font-family: var(--lc-serif); font-size: 24px; font-weight: 700; color: var(--lc-dorado); margin: 0 2px; }

/* ── Franja de logos de clientes ── */
.lc-clientes { background: var(--lc-negro); border-top: .5px solid var(--lc-linea); border-bottom: .5px solid var(--lc-linea); padding: 40px 0 44px; font-family: var(--lc-sans); }
.lc-clientes p { margin: 0 0 26px; text-align: center; font-size: 11px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase; color: var(--lc-dorado); }
.lc-clientes-ventana { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.lc-clientes-pista, .lc-clientes-copia { display: flex; align-items: center; gap: 80px; }
.lc-clientes-pista { width: max-content; padding-right: 80px; animation: lc-desfile 38s linear infinite; }
.lc-clientes:hover .lc-clientes-pista { animation-play-state: paused; }
.lc-clientes img { width: auto; max-width: 180px; object-fit: contain; opacity: .6; transition: opacity .25s; }
.lc-clientes img:hover { opacity: 1; }
@keyframes lc-desfile { to { transform: translateX(-50%); } }
@media (max-width: 600px) { .lc-clientes-pista, .lc-clientes-copia { gap: 52px; } .lc-clientes-pista { padding-right: 52px; } .lc-clientes img { transform: scale(.8); } }
@media (prefers-reduced-motion: reduce) and (max-width: 1px) {
  .lc-clientes-pista { animation: none; width: auto; flex-wrap: wrap; justify-content: center; padding: 0 6vw; gap: 36px 56px; }
  .lc-clientes-copia { display: none; }
}

/* ── Vitrina de modelos (página de Páginas web): explicación a la izquierda, diseño de la página girado y saliéndose del marco ── */
.lc-ejemplos { scroll-margin-top: var(--lc-alto, 106px); background: var(--lc-negro); padding: 104px 6vw; font-family: var(--lc-sans); color: var(--lc-marfil); overflow: hidden; }
.lc-ej-head { max-width: 760px; margin: 0 auto 64px; text-align: center; }
.lc-ejemplos h2 { font-family: var(--lc-serif); font-weight: 700; font-size: clamp(32px, 4.4vw, 54px); line-height: 1.1; margin: 0 0 16px; color: var(--lc-marfil); }
.lc-ejemplos h2 em { color: var(--lc-dorado); font-style: italic; }
.lc-ej-head p { margin: 0; color: var(--lc-gris); font-size: 16px; line-height: 1.75; }
.lc-modelos { display: flex; flex-direction: column; gap: 36px; max-width: 1240px; margin: 0 auto; }
.lc-modelo { position: relative; display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: center; min-height: 600px; border-radius: 32px; overflow: hidden;
  background: radial-gradient(70% 90% at 85% 40%, rgba(201,168,76,.13), transparent 60%), linear-gradient(160deg, #181816 0%, #0F0F0E 100%);
  border: 1px solid rgba(201,168,76,.2); }
.lc-mod-texto { position: relative; z-index: 3; display: flex; flex-direction: column; align-items: flex-start; padding: 64px 0 64px 64px; min-width: 0; }
.lc-pill { display: inline-flex; align-items: center; gap: 12px; background: #1E1D1A; border: 1px solid rgba(201,168,76,.35); color: var(--lc-marfil); border-radius: 999px; padding: 9px 22px 9px 9px; font-size: 16px; font-weight: 500; margin-bottom: 72px; }
.lc-pill svg { width: 34px; height: 34px; }
.lc-modelo h3 { font-family: var(--lc-serif); font-weight: 700; font-size: clamp(34px, 3.8vw, 54px); line-height: 1.08; letter-spacing: -.5px; margin: 0 0 18px; color: var(--lc-marfil); }
.lc-modelo p { margin: 0 0 28px; font-size: 15.5px; line-height: 1.7; color: var(--lc-gris); max-width: 28em; }
.lc-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }
.lc-tags span { border: 1px solid rgba(244,239,227,.18); color: var(--lc-marfil); border-radius: 999px; padding: 12px 22px; font-size: 15px; font-weight: 500; background: rgba(244,239,227,.04); }
.lc-tags span:first-child { background: var(--lc-dorado); border-color: var(--lc-dorado); color: var(--lc-negro); }
.lc-mod-vivo { color: var(--lc-dorado); font-weight: 600; font-size: 15px; text-decoration: none; }
.lc-mod-vivo:hover { text-decoration: underline; }
/* Las dos pantallas: la de atrás muestra otras secciones; la del frente es la portada */
.lc-mod-vis { position: absolute; inset: 0 0 0 47%; perspective: 2200px; pointer-events: none; }
.lc-pantalla { position: absolute; border-radius: 14px; overflow: hidden; background: #fff; transform-origin: center;
  box-shadow: 0 40px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08); }
.lc-pantalla img { width: 100%; display: block; }
.lc-pantalla:not(.lc-atras) { width: 84%; height: 118%; left: 0; top: 10%; transform: rotateX(10deg) rotateY(-6deg) rotateZ(-8deg); z-index: 2; pointer-events: auto;
  transition: transform 1.2s cubic-bezier(.2,.7,.2,1), opacity .9s ease; }
.lc-pantalla:not(.lc-atras) img { transition: transform 8s cubic-bezier(.45,0,.2,1); }
.lc-pantalla.lc-atras { width: 80%; height: 130%; left: 56%; top: -16%; transform: rotateX(10deg) rotateY(-6deg) rotateZ(-8deg); opacity: .5; z-index: 1; }
.lc-pantalla.lc-atras img { transform: translateY(-34%); }
.lc-modelo:hover .lc-pantalla:not(.lc-atras) img { transform: translateY(calc(-100% + 560px)); }
/* Entrada: la pantalla sube y se gira */
.lc-modelo.lc-anim { opacity: 1; transform: none; }
.lc-modelo.lc-anim .lc-pantalla:not(.lc-atras) { opacity: 0; transform: rotateX(0) rotateY(0) rotateZ(0) translateY(140px); }
.lc-modelo.lc-anim.lc-in .lc-pantalla:not(.lc-atras) { opacity: 1; transform: rotateX(10deg) rotateY(-6deg) rotateZ(-8deg); }
.lc-modelo.lc-anim .lc-pantalla.lc-atras { transition: opacity 1.4s .3s ease; opacity: 0; }
.lc-modelo.lc-anim.lc-in .lc-pantalla.lc-atras { opacity: .5; }
@media (max-width: 980px) {
  .lc-modelo { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .lc-mod-texto { padding: 40px 28px 0; }
  .lc-pill { margin-bottom: 28px; }
  .lc-mod-vis { position: relative; inset: auto; height: 380px; }
  .lc-pantalla:not(.lc-atras) { width: 86%; height: 130%; left: 7%; top: 12%; }
  .lc-pantalla.lc-atras { display: none; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 1px) { .lc-pantalla img { transition: none !important; } .lc-modelo:hover .lc-pantalla img { transform: none; } .lc-modelo.lc-anim .lc-pantalla { opacity: 1 !important; } }

/* ── Íconos animados (reemplazan los emojis): se dibujan al aparecer y luego tienen su propio movimiento ── */
@property --lc-ang { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.lc-ico { position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 15px; color: var(--lc-dorado);
  background: linear-gradient(145deg, rgba(201,168,76,.10), rgba(201,168,76,.02) 60%), #121211; border: 1px solid rgba(201,168,76,.16);
  box-shadow: 0 12px 30px rgba(0,0,0,.35); margin-bottom: 4px; }
/* Brillo dorado que recorre el borde */
.lc-ico:not(.lc-ico-mini)::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; z-index: -1;
  background: conic-gradient(from var(--lc-ang), transparent 0 62%, rgba(232,201,106,.95) 80%, transparent 96%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  animation: lc-borde 4.5s linear infinite; }
@keyframes lc-borde { to { --lc-ang: 360deg; } }
.lc-ico svg { width: 28px; height: 28px; overflow: visible; }
.lc-ico-mini { width: 1.35em; height: 1.35em; border: 0; background: none; box-shadow: none; border-radius: 0; vertical-align: -.3em; margin: 0 .35em 0 0; }
.lc-ico-mini svg { width: 100%; height: 100%; }
.lc-ico circle:not(.p), .lc-ico rect:not(.p), .lc-ico .lc-a-sale path, .lc-ico .lc-relleno { fill: currentColor; stroke: none; }
.lc-ico .p { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s cubic-bezier(.6,0,.2,1); }
.lc-ico.lc-in .p, .lc-ico-mini .p { stroke-dashoffset: 0; }
.lc-ico [class*="lc-a-"] { transform-box: fill-box; transform-origin: center; }
.lc-ico.lc-in .lc-a-temblor { animation: lc-temblor 2.6s 1.3s infinite; }
.lc-ico.lc-in .lc-a-parpadeo { animation: lc-parpadeo 2s 1.3s infinite; }
.lc-ico.lc-in .lc-a-vuela { animation: lc-vuela 2.4s 1.3s infinite; }
.lc-ico.lc-in .lc-a-girax { animation: lc-girax 3s 1.3s ease-in-out infinite; }
.lc-ico .lc-a-crece { transform-origin: 50% 100%; }
.lc-ico.lc-in .lc-a-crece { animation: lc-crece 1.8s 1s ease-in-out infinite alternate; }
.lc-ico.lc-in .lc-a-crece.n2 { animation-delay: 1.2s; } .lc-ico.lc-in .lc-a-crece.n3 { animation-delay: 1.4s; }
.lc-ico.lc-in .lc-a-pulso { animation: lc-pulso 1.6s 1.3s infinite; }
.lc-ico.lc-in .lc-a-flecha { animation: lc-flecha 2.4s 1.3s infinite; }
.lc-ico.lc-in .lc-a-punto { animation: lc-punto 1.2s 1s infinite; }
.lc-ico.lc-in .lc-a-punto.n2 { animation-delay: 1.15s; } .lc-ico.lc-in .lc-a-punto.n3 { animation-delay: 1.3s; }
.lc-ico.lc-in .lc-a-flash { animation: lc-flash 1.8s 1.3s infinite; }
.lc-ico.lc-in .lc-a-salta { animation: lc-salta 2s 1.3s infinite; }
.lc-ico.lc-in .lc-a-traza { animation: lc-traza 3s 1.3s infinite; }
.lc-ico.lc-in .lc-a-gira { animation: lc-gira 6s 1.3s linear infinite; }
.lc-ico .lc-a-golpe { transform-origin: 0% 100%; }
.lc-ico.lc-in .lc-a-golpe { animation: lc-golpe 2.2s 1.3s infinite; }
.lc-ico.lc-in .lc-a-relleno { animation: lc-relleno 1.6s 1.3s infinite; fill: currentColor; }
.lc-ico.lc-in .lc-a-voltea { animation: lc-voltea 4s 1.3s infinite; }
.lc-ico.lc-in .lc-a-sale { animation: lc-sale 3s 1.3s infinite; }
.lc-ico.lc-in .lc-a-apila { animation: lc-apila 3.2s infinite; }
.lc-ico.lc-in .lc-a-apila.n2 { animation-delay: .25s; } .lc-ico.lc-in .lc-a-apila.n3 { animation-delay: .5s; }
.lc-ico.lc-in .lc-a-escribe { animation: lc-escribe 1.2s 1.3s ease-in-out infinite alternate; }
.lc-ico .lc-a-manecilla { transform-origin: 50% 100%; }
.lc-ico.lc-in .lc-a-manecilla { animation: lc-gira 4s 1s linear infinite; }
.lc-ico .lc-a-fondo { opacity: .22; }
.lc-ico .lc-a-carga { transform-origin: 0% 50%; transform: scaleX(.05); }
.lc-ico.lc-in .lc-a-carga { animation: lc-carga 3.6s 1s cubic-bezier(.3,0,.2,1) infinite; }
.lc-ico.lc-in .lc-a-desarma { animation: lc-desarma 2.2s 1.2s ease-in-out infinite; }
.lc-ico.lc-in .lc-a-desarma.n2 { animation-delay: 1.4s; } .lc-ico.lc-in .lc-a-desarma.n3 { animation-delay: 1.6s; }
@keyframes lc-temblor { 0%,70%,100% { transform: rotate(0); } 74% { transform: rotate(-9deg); } 78% { transform: rotate(9deg); } 82% { transform: rotate(-6deg); } 86% { transform: rotate(5deg); } 90% { transform: rotate(0); } }
@keyframes lc-parpadeo { 0%,100% { opacity: 1; } 50% { opacity: .2; } }
@keyframes lc-vuela { 0% { transform: translate(0,0); opacity: 1; } 55% { transform: translate(7px,-10px) rotate(-10deg); opacity: 0; } 56% { transform: translate(0,7px); opacity: 0; } 100% { transform: translate(0,0); opacity: 1; } }
@keyframes lc-girax { 0%,100% { transform: scaleX(1); } 50% { transform: scaleX(.12); } }
@keyframes lc-crece { from { transform: scaleY(.35); } to { transform: scaleY(1); } }
@keyframes lc-pulso { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.4); opacity: .55; } }
@keyframes lc-flecha { 0% { transform: translate(12px,-12px); opacity: 0; } 25% { transform: translate(0,0); opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; } }
@keyframes lc-punto { 0%,60%,100% { transform: translateY(0); } 30% { transform: translateY(-5px); } }
@keyframes lc-flash { 0%,100% { opacity: .25; transform: scale(.8); } 15% { opacity: 1; transform: scale(1.5); } 40% { opacity: .5; transform: scale(1); } }
@keyframes lc-salta { 0%,45%,100% { transform: translateY(0); } 15% { transform: translateY(-5px); } 30% { transform: translateY(0); } 37% { transform: translateY(-2px); } }
@keyframes lc-traza { 0% { stroke-dashoffset: 1; opacity: 1; } 55%,88% { stroke-dashoffset: 0; opacity: 1; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes lc-gira { to { transform: rotate(360deg); } }
@keyframes lc-golpe { 0%,55%,100% { transform: rotate(0); } 68% { transform: rotate(-16deg); } 78% { transform: rotate(0); } }
@keyframes lc-relleno { 0%,100% { fill-opacity: 0; } 30% { fill-opacity: .85; } }
@keyframes lc-voltea { 0%,40% { transform: rotate(0); } 50%,90% { transform: rotate(180deg); } 100% { transform: rotate(360deg); } }
@keyframes lc-sale { 0% { transform: translate(0,0); opacity: 1; } 50% { transform: translate(12px,-2px); opacity: 1; } 70% { transform: translate(22px,-4px); opacity: 0; } 72% { transform: translate(0,0); opacity: 0; } 100% { opacity: 1; } }
@keyframes lc-apila { 0% { transform: translateY(-14px); opacity: 0; } 20%,85% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(0); opacity: 0; } }
@keyframes lc-escribe { from { transform: translateX(-2px); } to { transform: translateX(4px); } }
@keyframes lc-carga { 0% { transform: scaleX(.05); } 55% { transform: scaleX(.38); } 90% { transform: scaleX(.42); } 100% { transform: scaleX(.05); } }
@keyframes lc-desarma { 0%,100% { transform: translate(0,0) rotate(0); } 25% { transform: translate(-3px,1px) rotate(-7deg); } 55% { transform: translate(4px,-1px) rotate(6deg); } 80% { transform: translate(-1px,0) rotate(-2deg); } }

/* ── Portadas animadas del blog ── */
.lc-portada { position: relative; overflow: hidden; background: #0B0B0A; }
.lc-portada svg { display: block; width: 100%; height: 100%; }
.card-visual .lc-portada { position: absolute; inset: 0; }
.card-visual:has(.lc-portada) { height: auto !important; aspect-ratio: 2 / 1; }
.card-visual:has(.lc-portada)::after { background: linear-gradient(to top, rgba(10,10,10,.85) 0%, transparent 30%) !important; }
.lc-post .lc-portada { margin: -30px -28px 8px; aspect-ratio: 2 / 1; border-radius: 16px 16px 0 0; }
.card > .lc-portada { aspect-ratio: 2 / 1; border-radius: 10px; margin-bottom: 18px; }
.lc-pf-etq { font: 600 11px 'DM Sans', sans-serif; fill: rgba(244,239,227,.62); letter-spacing: .4px; }
.lc-pf-mini { font: 600 8px 'DM Sans', sans-serif; fill: rgba(244,239,227,.62); }
.lc-pf-boton { font: 700 7.5px 'DM Sans', sans-serif; fill: #0A0A0A; }
.lc-pf-signo { font: 800 12px 'DM Sans', sans-serif; fill: #3A2C0C; }
.lc-pf-cero { font: 700 30px 'Playfair Display', serif; fill: #C9A84C; }
.lc-portada [class*="lc-pf-"] { transform-box: fill-box; transform-origin: center; }
.lc-portada.lc-in .lc-pf-moneda { animation: lc-moneda 2.8s linear infinite; opacity: 0; }
.lc-portada.lc-in .lc-pf-moneda.n2 { animation-delay: .7s; } .lc-portada.lc-in .lc-pf-moneda.n3 { animation-delay: 1.4s; } .lc-portada.lc-in .lc-pf-moneda.n4 { animation-delay: 2.1s; }
.lc-portada .lc-pf-encoge { transform-origin: 0% 50%; }
.lc-portada.lc-in .lc-pf-encoge { animation: lc-encoge 5.6s ease-in-out infinite; }
.lc-portada .lc-pf-traza { stroke-dasharray: 1; }
.lc-portada.lc-in .lc-pf-traza { animation: lc-traza 4s infinite; }
.lc-portada.lc-in .lc-pf-pulso { animation: lc-latido 2.8s ease-in-out infinite; }
.lc-portada.lc-in .lc-pf-brillo { animation: lc-brillo 2.4s ease-in-out infinite; }
.lc-portada.lc-in .lc-pf-flujo { animation: lc-flujo 1s linear infinite; }
.lc-portada.lc-in .lc-pf-tile { animation: lc-tile 4.5s infinite; }
.lc-portada.lc-in .lc-pf-tile.n2 { animation-delay: .2s; } .lc-portada.lc-in .lc-pf-tile.n3 { animation-delay: .4s; } .lc-portada.lc-in .lc-pf-tile.n4 { animation-delay: .6s; }
.lc-portada.lc-in .lc-pf-tile.n5 { animation-delay: .8s; } .lc-portada.lc-in .lc-pf-tile.n6 { animation-delay: 1s; } .lc-portada.lc-in .lc-pf-tile.n7 { animation-delay: 1.2s; }
.lc-portada.lc-in .lc-pf-tile.n8 { animation-delay: 1.4s; } .lc-portada.lc-in .lc-pf-tile.n9 { animation-delay: 1.6s; }
.lc-portada.lc-in .lc-pf-corazon { animation: lc-corazon 3s ease-out infinite; opacity: 0; }
.lc-portada.lc-in .lc-pf-corazon.n2 { animation-delay: 1s; } .lc-portada.lc-in .lc-pf-corazon.n3 { animation-delay: 2s; }
.lc-portada .lc-pf-arma { transform-origin: 0% 50%; }
.lc-portada.lc-in .lc-pf-arma { animation: lc-arma 6s cubic-bezier(.6,0,.2,1) infinite; }
.lc-portada.lc-in .lc-pf-arma.n2 { animation-delay: .35s; } .lc-portada.lc-in .lc-pf-arma.n3 { animation-delay: .7s; }
.lc-portada.lc-in .lc-pf-arma.n4 { animation-delay: 1.05s; } .lc-portada.lc-in .lc-pf-arma.n5 { animation-delay: 1.4s; }
.lc-portada.lc-in .lc-pf-cursor { animation: lc-cursor 6s ease-in-out infinite; }
.lc-portada.lc-in .lc-pf-toast { animation: lc-toast 6s ease-out infinite; }
@keyframes lc-moneda { 0% { transform: translateY(0); opacity: 0; } 10% { opacity: 1; } 68% { transform: translateY(118px); opacity: 1; } 80% { transform: translateY(126px) scale(.4); opacity: 0; } 100% { opacity: 0; } }
@keyframes lc-encoge { 0%,8% { transform: scaleX(1); } 80%,92% { transform: scaleX(.1); } 100% { transform: scaleX(1); } }
@keyframes lc-latido { 0%,100% { transform: scale(1); } 50% { transform: scale(1.04); } }
@keyframes lc-brillo { 0%,100% { opacity: .35; transform: scale(.9); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes lc-flujo { to { stroke-dashoffset: -20; } }
@keyframes lc-tile { 0% { transform: scale(0); } 10%,84% { transform: scale(1); } 96%,100% { transform: scale(0); } }
@keyframes lc-corazon { 0% { transform: translateY(20px) scale(.6); opacity: 0; } 25% { transform: translateY(0) scale(1); opacity: 1; } 100% { transform: translateY(-80px) scale(.8); opacity: 0; } }
@keyframes lc-arma { 0% { transform: scaleX(0); } 10%,86% { transform: scaleX(1); } 96%,100% { transform: scaleX(0); } }
@keyframes lc-cursor { 0%,32% { transform: translate(70px,45px); opacity: 0; } 42% { opacity: 1; } 58% { transform: translate(0,0); } 62% { transform: translate(0,0) scale(.82); } 66% { transform: translate(0,0) scale(1); } 90% { opacity: 1; } 100% { transform: translate(0,0); opacity: 0; } }
@keyframes lc-toast { 0%,64% { transform: translateY(10px); opacity: 0; } 70%,92% { transform: translateY(0); opacity: 1; } 100% { opacity: 0; } }

/* ── Movimiento propio de la página de Páginas web (y de las que comparten su diseño) ── */
.lc-pw-hero { position: absolute; right: 3.5vw; top: 50%; width: min(600px, 42vw); transform: translateY(-44%); z-index: 2; background: none !important; overflow: visible !important; }
.lc-pw-hero svg { width: 100%; height: auto; overflow: visible; }
.lc-pw-hero.lc-in .lc-pw-flota { animation: lc-flotar 6s ease-in-out infinite; }
.lc-pw-hero.lc-in .lc-pw-d2 { animation-delay: -3s; }
@keyframes lc-flotar { 50% { transform: translateY(-10px); } }
@media (max-width: 1100px) { .hero-landing:has(.lc-pw-hero) { flex-direction: column; } .lc-pw-hero, .mw .lc-pw-hero { position: relative; right: auto; top: auto; transform: none; width: min(520px, 92vw); margin: 0 auto 56px; } }
/* Pasos del proceso: anillo dorado que gira alrededor de cada número y late por turnos */
.process-grid .card > div:first-child { position: relative; }
.process-grid .card > div:first-child::before { content: ""; position: absolute; inset: -9px; border-radius: 50%; border: 1px dashed rgba(201,168,76,.55); animation: lc-gira 14s linear infinite; }
.process-grid .card > div:first-child::after { content: ""; position: absolute; inset: -1px; border-radius: 50%; box-shadow: 0 0 0 0 rgba(201,168,76,.55); animation: lc-latir 3.6s ease-out infinite; }
.process-grid .card:nth-child(2) > div:first-child::after { animation-delay: 1.2s; }
.process-grid .card:nth-child(3) > div:first-child::after { animation-delay: 2.4s; }
@keyframes lc-latir { 0% { box-shadow: 0 0 0 0 rgba(201,168,76,.55); } 40%,100% { box-shadow: 0 0 0 22px rgba(201,168,76,0); } }
.process-grid .card, .pain-grid .card { transition: transform .45s cubic-bezier(.2,.7,.2,1), border-color .45s, box-shadow .45s; }
.process-grid .card:hover, .pain-grid .card:hover { transform: translateY(-6px); border-color: rgba(201,168,76,.45); box-shadow: 0 24px 50px rgba(0,0,0,.4); }
/* Lo que incluye: entra en cascada y cada estrella titila por turnos */
.reveal .includes-grid .include-item { opacity: 0; transform: translateX(-18px); }
.reveal.visible .includes-grid .include-item { animation: lc-entra .7s cubic-bezier(.2,.7,.2,1) forwards; }
.includes-grid .include-item:nth-child(2) { animation-delay: .08s !important; } .includes-grid .include-item:nth-child(3) { animation-delay: .16s !important; }
.includes-grid .include-item:nth-child(4) { animation-delay: .24s !important; } .includes-grid .include-item:nth-child(5) { animation-delay: .32s !important; }
.includes-grid .include-item:nth-child(6) { animation-delay: .4s !important; } .includes-grid .include-item:nth-child(7) { animation-delay: .48s !important; }
.includes-grid .include-item:nth-child(8) { animation-delay: .56s !important; }
@keyframes lc-entra { to { opacity: 1; transform: none; } }
.includes-grid .include-item { transition: border-color .3s, background .3s; }
.includes-grid .include-item:hover { border-color: rgba(201,168,76,.5); background: #1E1D1A; }
.includes-grid .include-item > span:first-child { display: inline-block; animation: lc-destello 3.2s ease-in-out infinite; }
.includes-grid .include-item:nth-child(2n) > span:first-child { animation-delay: -1.1s; } .includes-grid .include-item:nth-child(3n) > span:first-child { animation-delay: -2.2s; }
@keyframes lc-destello { 0%,100% { transform: scale(1) rotate(0); opacity: 1; } 50% { transform: scale(.55) rotate(90deg); opacity: .5; } }
/* La foto en blanco y negro: se ve la cabeza completa y se revela de abajo hacia arriba */
img[src*="retrato-blanco-negro"] { object-position: center 6% !important; }
.reveal img[src*="retrato-blanco-negro"] { clip-path: inset(100% 0 0 0); transform: scale(1.08); transition: clip-path 1.4s cubic-bezier(.7,0,.2,1) .25s, transform 2s cubic-bezier(.2,.7,.2,1) .25s; }
.reveal.visible img[src*="retrato-blanco-negro"] { clip-path: inset(0 0 0 0); transform: none; }
@media (prefers-reduced-motion: reduce) and (max-width: 1px) {
  .reveal .includes-grid .include-item { opacity: 1; transform: none; }
  .reveal img[src*="retrato-blanco-negro"] { clip-path: none; transform: none; }
}

/* ── Pie de página ── */
footer.lc-footer { all: revert; display: block; background: var(--lc-negro); border-top: .5px solid var(--lc-linea); padding: 72px 8vw 32px; font-family: var(--lc-sans); color: var(--lc-gris); }
.lc-footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; margin-bottom: 48px; }
.lc-footer p { margin: 0; font-size: 14px; line-height: 1.75; max-width: 300px; color: var(--lc-gris); }
.lc-footer .lc-brand { margin-bottom: 18px; }
.lc-footer h4 { font-family: var(--lc-sans); font-size: 11px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--lc-dorado); margin: 0 0 18px; }
.lc-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.lc-footer ul a { color: var(--lc-gris); text-decoration: none; font-size: 14px; transition: color .2s; }
.lc-footer ul a:hover { color: var(--lc-dorado); }
.lc-social { display: flex; gap: 12px; margin-top: 22px; }
.lc-social a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--lc-linea); display: flex; align-items: center; justify-content: center; color: var(--lc-gris); transition: color .2s, border-color .2s; }
.lc-social a:hover { color: var(--lc-dorado); border-color: var(--lc-dorado); }
.lc-social svg { width: 16px; height: 16px; }
.lc-footer-base { border-top: .5px solid rgba(255,255,255,.08); padding-top: 26px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: 12.5px; }
@media (max-width: 900px) { .lc-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .lc-footer-grid { grid-template-columns: minmax(0, 1fr); } footer.lc-footer { padding: 56px 6vw 28px; } }

/* ── Botón flotante de WhatsApp ── */
.lc-wa { position: fixed; right: 24px; bottom: 24px; z-index: 250; width: 58px; height: 58px; border-radius: 50%; background: #25D366; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(37,211,102,.35); transition: transform .2s; }
.lc-wa:hover { transform: scale(1.07); }
.lc-wa svg { width: 28px; height: 28px; }
@media (max-width: 520px) { .lc-wa { right: 16px; bottom: 16px; width: 54px; height: 54px; } }

.lc-header a:focus-visible, .lc-mmenu a:focus-visible, .lc-footer a:focus-visible, .lc-blog a:focus-visible, .lc-burger:focus-visible, .lc-wa:focus-visible { outline: 2px solid var(--lc-dorado); outline-offset: 3px; }

/* Quien pidió menos movimiento en su celular o computador ve todo quieto y visible */
@media (prefers-reduced-motion: reduce) and (max-width: 1px) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .reveal, .reveal-left, .reveal-right, .r { opacity: 1 !important; transform: none !important; }
}
