/* impacto.css — francobovone.com (Point Web, 3-nov-2026): la entrada, el pase entre páginas y el movimiento al recorrer.
   Fuente: Claudecode/francobovone-sitio/impacto/mu/fb-impacto/impacto.css · lo carga mu-plugins/fb-impacto.php.
   El <head> pone el modo: html.fbi-intro (primera página de la visita) o html.fbi-llega (vino por un link del sitio), los dos
   con fbi-cubre (la página arranca tapada). impacto.js pone html.fbi-ya (+ --fbi-lev y --fbi-d0) cuando está listo: se va el
   telón o la cortina y entra la cabecera. Sin JS, el telón se va solo a los 4,5 s y la cortina a los 4 s.
   Todo el movimiento usa translate / scale / rotate (las propiedades sueltas): se SUMAN a los transform que ya tiene el
   sitio (el muro inclinado, el hover de las tarjetas) en lugar de pisarlos. Nada de naranja como resplandor sobre tinta. */
/* FUENTE-TELON (generado por impacto/fuente_telon.py: no editar a mano) */
@font-face{font-family:'FBI Nombre';font-style:normal;font-weight:800;font-display:block;src:url(data:font/woff2;base64,d09GMgABAAAAAARgAA8AAAAAB9gAAAQGAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhYbgXQcMAZgP1NUQVREAHQRCAqGHIR9ATYCJAMsCxgABCAFgQQHIBsgBlFUT+4RfXFgG9MauggTxYIQBq1r7SvNLybpG+DFsZMl7uLh+XV8596Z+QsxgcmsfyOMvJXKGyJTYAP0/ifP+mmdtCOkGDEdOxkwY/G0Egc+rXDet/lfD1DE34kAwfs/19S7Bu41luAAR/jvvzeKomiL1Aob0IQHvDcqodNFi48mPABJ22xZSIGM7ncMEltjxfDXXxHoCEghtBMC7U3gjjV/YXAU4OvqK4oA31SRXQj49vSqEsCxoBSB2LahogR4CIRaaiu0lXZj4agJbbWANlC+A+Ur5RMQfSyR8kaoD2r5zRAi5atu+q6h/Cu/yhP/dckQwHKjhXlI021UGcuVlFG61mS2jCHDpFV80rS8dADL61xRaWOTZzIOWMZZYiXr8CPuQZfW5V7a7hmqpnpWGurWeIyAHJy3MHTOU2or0RMDIzEObcqrQoAt+9OLEAlErSsEol+lDVRCxmCAAIkKPSPcBJbVnkoBU20ob6R0mbKVqlBT4DIlj1lee+ieO2675ZILzhagb4hSdEHoAHoDXfCVmApADVKp8LJBXa9UUuKUgobUSF0BzTyMLWRlCNkCugxuwOn1ddQCdREagw2+RdrfoCiyQMs25EHAikGEIERwpP0DOrBuHHNzCxvcgEwb2NxE2re2MAzQgWvQdh0bfCmKXltP98Fy0VFn3kQNz85pO/9893xrEb2OX7bPqQgQYdTqhRdNoOT9eS/Nom+tY2wM3C9KOVFm+4MbExjdsfX1mOb0xWg37RV8RspiMHPk6k2uAywFi0cTsSTjW/8/4ZdomQjkOQO9WbS9Y3iOjPIILDZ3jXJLnMgavjxyxMZbX9/b5lL/jLWirq6CdR+QG8yn6gn/zs+bh77sZzfGprkahWlc9mg7aBvq2TVW106E87zizWRBFtbW/vmGUW2ZObIQTc1kHS3ZXU2/rzGOECFhiAproemw5iEyIak7REROBBpU6OgkfzMx/Z6so1NhcICBf5cQJ23EP7QlIiK4pZeMDu/0DGlOQDXR01n+lIj1mNDVJa4YSIz5h2bGPVczcwvKzcFNennB/Eehs69HtrVzfpT9HXXnT6ZS/CrBgWDx/VRoC02HNveT8fEDZEgzTYe0DFBxMzrEronJNqGjTXxj9Acx5LxXTjUVuoacvK+NOVPu1D/rh5KH55kybrhcAlAeFWjHpZnfS5V3/aZD9RIef3cXXnQpJ1x+5PO8hxYJgj8ZqSIkvmLXMAodchnjNW9hdpyNVaSZSFRrUrhmRi4wEje5qagcI4BAB6OGj8GyxlxMUbeTOlPbBR11tvWjBLcNIjDmJRsMNRktW65qRdJViJUtX648VfzUqVIhnbdSRbIEqJKuSL5MtFLF0pVgAuVakwgAAA==) format('woff2')}
@font-face{font-family:'FBI Rol';font-style:normal;font-weight:600;font-display:block;src:url(data:font/woff2;base64,d09GMgABAAAAAAWgAA8AAAAACowAAAVHAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhYbg2gcMAZgP1NUQVREAHQRCAqJLIcjATYCJANMCygABCAFgQIHIBtYCFFUbeYA+HkYE5muY9FarVZzOtw/nxdRTPGOB1y2WiQe/N9Pb/JfB0hKAbqd2iHo2eoJ46ZUfPjvtD93ZqK50UIp7KT7klQIau66dJ7kpAt9ikwg9z9A/PT5v9+rP5IqOEPsI976UUlVS3tnQgPcGQ6o0rpBRjSQAhyJ7rnMIWD9NCqXldlkv/0TJMAEgEQQSgQBY0Kl4o5Ps4qgeupe0QbV24r6Vqi+q1d1QIUDyl6A+HpZ0QExSAQkYfRgiBFiTEjBQWyEmpwE0IO6mrrglmMBvbqfupy6HwDqVoC672pzdUdSxwJ1NasSdUdvuOwCYFggtrM/dbv0H6ZO58KH3FHHrOCOO7iSdgbnJ7SblRupgwJ7BF1Nk7z9x0bnO+571BjGmFCCubDy1LdmiRAcMYYkbiMeJSUjILyWm4tDkLy1ooi4LILu3Pnmd2CN800DeZJbp831vmt1oGAsc37Q+S1znSnDWi01aSKA/JOlcLWSuBUeqcC182L96zRXG+z4pyOA1o+tEUAupQ3sYJH8jwILGHCA+X1rWkUAf2VyIk4IjrINYnF/vLLIhDMwI5xXcMGPZDGnCp/21Tiu1F6glylPMaN/yh470qR7pNkKPqfbYL1ZNlb/+08pYvjagZS9aRDmAY7AFsQNxH9AAySHyfdGOq4YV4NonJibO0eplBBybVXlxPyFE+VUxtFg8Vw9RgV1zxqZQMq30ma+hTYZjbJi+xzLPgz27uVDZMTb8QZqOUCG9/M8+eA4zDgAMfHkMMHMvFeC9SRXUp0pZzQ00roiU13WYKy3xup5ml/Ol1AT30AZijfz/hjfMueqZ/Y3IRk+UKKWfdvE9hqIAGD/jCmOgZOaRZ8vZEhBdsHC4qElMgMtrumj1TP7k42z+2y+X7i0bv/+7RAV4or+30D1I4ZmycPHqYAnCoyl1SYsZYbWYmVyr6yClvOVs7CMr7gv48w6MryeWmYxZPO1PbF9v7Q0tBSCeOtQgnVKviZStob/zL2+h+4VFTbdwGhNYWxEjsE/Yl5CuX90flLJdO3Uofrd+uyQqMjsUP3R+k3pupDQMIin/7tmlfAVPxgrP2hprvxQXn3FL+3f56xMSG7V6ZNb5HjO9zEb2n/6T1va3wxqLWuFZSSXpx3lHfqeIzbs+lL4Xkff66Eabc5d337JBppcXJH9ESpsrWHPYwOft7L24vGa/ft49nvnJ67u36ooh2FxVXwlKZiOqq+KGcnJaUAGeiW/YMqmHK2vnFpleZTZI03taYqORoAA21FRJg81iqM8zauhwuZaPpag7czORoB7lx/8UPTo490Gg06tMWgNuz+Jabq8+PHo6irsGItf632R7tdnlt+e7Xn4USBH//7RkoK3gv8MrHu1NyAtRrPoocp1v26haZ5JpfMP0sbGJVb0xVal9Loc8627UqsKjlYvueTguk23wDzftETnF6iNiW3n74/F1ZyLHQUdF3MwI3n188/es4xMtJVVFxeXVrdNDFnes+4O9oJ1cnuXZn9X186utD1dfe2DzqyL99wYj5c2uT/z9nrm7nnMy/sYALD7FAQggY9ubvq4UpF4T0zZiwAcvY8fAeCCwj5gf1L3WzmzDSBEAgACP17+rgjaE7KSOgzPYzLhy1wrQ/kIFWx85zMf0/p5JIXHHOKzVh7Tn3OGwNzfbR75NVbzyBJct4CpdXGI+RAbEhEwLxgLCOWwHjUWaRIw5KBbEWCCXLuAkkrrRMr/D+aMF61AvUartam2glG9Zo2arFKoXrtmap3a1NFbpVqbZrUKdGpXrQMLUB8WDgAA) format('woff2')}
/* /FUENTE-TELON */
:root{--fbi-lev:0s;--fbi-d0:.2s;--fbi-tinta:#0D0E12;--fbi-naranja:#F26522;--fbi-gris:#A3A9B5}
@keyframes fbi-sube{from{opacity:0;translate:0 30px}to{opacity:1;translate:none}}

/* ═══ 1 · LA ENTRADA: su nombre sube, cae el punto naranja de su firma y se levanta el telón con filo naranja ═══ */
.fbi-telon,.fbi-cortina{display:none}
html.fbi-intro .fbi-telon{display:flex;align-items:center;justify-content:center;position:fixed;left:0;top:0;width:100%;height:100%;
  z-index:100001;overflow:hidden;background:var(--fbi-tinta);animation:fbi-telon-seguro .9s cubic-bezier(.76,0,.24,1) 4.5s forwards}
html.fbi-intro.fbi-ya .fbi-telon{animation:fbi-telon .9s cubic-bezier(.76,0,.24,1) var(--fbi-lev) forwards}
.fbi-telon::before,.fbi-cortina::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:64px 64px;background-position:center;
  -webkit-mask-image:radial-gradient(ellipse 62% 58% at 50% 50%,#000 10%,transparent 78%);mask-image:radial-gradient(ellipse 62% 58% at 50% 50%,#000 10%,transparent 78%)}
.fbi-telon::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--fbi-naranja)}
.fbi-telon-centro{position:relative;display:flex;flex-direction:column;align-items:center;gap:24px;padding:0 20px;text-align:center}
html.fbi-intro.fbi-ya .fbi-telon-centro{animation:fbi-centro-sale .9s cubic-bezier(.76,0,.24,1) var(--fbi-lev) forwards}
.fbi-nombre{display:flex;align-items:baseline;justify-content:center;gap:.25em;white-space:nowrap;color:#fff;
  font:800 clamp(36px,8.2vw,112px)/1 'FBI Nombre',Montserrat,Arial,sans-serif;letter-spacing:-.045em}
.fbi-tm{display:inline-block;overflow:hidden;padding:.1em .03em .24em;margin:-.1em 0 -.24em}
.fbi-tm>i{display:inline-block;font-style:normal;translate:0 115%}
.fbi-tm:nth-child(1)>i::before{content:'Franco'}
.fbi-tm:nth-child(2)>i::before{content:'Bovone'}
.fbi-telon .fbi-punto{display:inline-block;width:.19em;height:.19em;margin-left:-.21em;border-radius:50%;background:var(--fbi-naranja);opacity:0}
.fbi-raya{width:96px;height:3px;border-radius:2px;background:var(--fbi-naranja);transform-origin:50% 50%;scale:0 1}
.fbi-rol{max-width:min(92vw,620px);color:var(--fbi-gris);font:600 clamp(11px,1.05vw,13px)/1.6 'FBI Rol',Montserrat,Arial,sans-serif;
  letter-spacing:.24em;text-transform:uppercase;opacity:0}
.fbi-rol::before{content:'Empresario · Speaker · Fundador de Point Web'}
@media (max-width:600px){.fbi-rol{white-space:pre-line;letter-spacing:.2em}.fbi-rol::before{content:'Empresario · Speaker\A Fundador de Point Web'}}
/* corre sola desde el primer cuadro: la letra está incrustada (FUENTE-TELON), no hay nada que esperar */
html.fbi-intro .fbi-tm>i{animation:fbi-letra .8s cubic-bezier(.16,1,.3,1) .08s both}
html.fbi-intro .fbi-tm:nth-child(2)>i{animation-delay:.16s}
html.fbi-intro .fbi-telon .fbi-punto{animation:fbi-punto .7s cubic-bezier(.3,1.55,.45,1) .5s both}
html.fbi-intro .fbi-raya{animation:fbi-raya .55s cubic-bezier(.65,0,.35,1) .62s both}
html.fbi-intro .fbi-rol{animation:fbi-sube .65s cubic-bezier(.16,1,.3,1) .7s both}
@keyframes fbi-letra{from{translate:0 115%}to{translate:none}}
@keyframes fbi-punto{0%{opacity:0;translate:0 -1.6em;scale:.3}50%{opacity:1}100%{opacity:1;translate:none;scale:1}}
@keyframes fbi-raya{to{scale:1 1}}
@keyframes fbi-centro-sale{to{translate:0 -16vh;opacity:0}}
@keyframes fbi-telon{to{translate:0 -100%;visibility:hidden}}
@keyframes fbi-telon-seguro{to{translate:0 -100%;visibility:hidden}}

/* ═══ 2 · EL PASE ENTRE PÁGINAS: sube la cortina tinta con el punto que late; en la página nueva sigue subiendo y se va ═══ */
html.fbi-sale .fbi-cortina,html.fbi-llega .fbi-cortina{display:flex;align-items:center;justify-content:center;position:fixed;left:0;top:-4px;
  width:100%;height:calc(100% + 8px);z-index:100000;pointer-events:none;overflow:hidden;background:var(--fbi-tinta);
  border-top:4px solid var(--fbi-naranja);border-bottom:4px solid var(--fbi-naranja)}
html.fbi-sale .fbi-cortina{pointer-events:auto;animation:fbi-cortina-in .5s cubic-bezier(.76,0,.24,1) both}
html.fbi-llega .fbi-cortina{animation:fbi-cortina-seguro .7s cubic-bezier(.76,0,.24,1) 4s both}
html.fbi-llega.fbi-ya .fbi-cortina{animation:fbi-cortina-out .7s cubic-bezier(.76,0,.24,1) var(--fbi-lev) both}
.fbi-cortina .fbi-punto{position:relative;width:14px;height:14px;border-radius:50%;background:var(--fbi-naranja);
  animation:fbi-late .8s ease-in-out infinite alternate}
@keyframes fbi-cortina-in{from{translate:0 100%}to{translate:none}}
@keyframes fbi-cortina-out{from{translate:none}to{translate:0 -100%;visibility:hidden}}
@keyframes fbi-cortina-seguro{from{translate:none}to{translate:0 -100%;visibility:hidden}}
@keyframes fbi-late{from{scale:.7;opacity:.55}to{scale:1.15;opacity:1}}
html.fbi-tarde .fbi-telon,html.fbi-tarde .fbi-cortina{display:none!important}

/* ═══ 3 · LA BARRA DE AVANCE: cuánto falta de la página ═══ */
.fbi-progreso{position:fixed;left:0;top:0;width:100%;height:3px;z-index:100002;pointer-events:none;transform-origin:0 50%;transform:scaleX(0);
  background:var(--fbi-naranja)}

/* ═══ 4 · LA CABECERA (solo cuando la página arrancó tapada): todo entra en orden, la foto sube, las tarjetas flotantes
       aparecen con rebote; después, en la compu, la foto y las tarjetas se mueven en capas con el mouse y al bajar ═══ */
html.fbi-cubre .fbi-entra{opacity:0}
html.fbi-cubre.fbi-ya .fbi-entra{animation:fbi-sube .95s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--fbi-d0) + var(--fbi-i,0)*90ms)}
html.fbi-cubre.fbi-ya .fbi-foto-hero{animation:fbi-foto-hero 1.35s cubic-bezier(.16,1,.3,1) calc(var(--fbi-d0) + .05s) both}
html.fbi-cubre .fbi-pop{opacity:0}
html.fbi-cubre.fbi-ya .fbi-pop{animation:fbi-pop .85s cubic-bezier(.3,1.45,.5,1) both;animation-delay:calc(var(--fbi-d0) + .6s + var(--fbi-i,0)*170ms)}
@keyframes fbi-foto-hero{from{translate:0 70px;scale:.94}to{translate:none;scale:1}}
@keyframes fbi-pop{from{opacity:0;translate:0 26px;scale:.86}to{opacity:1;translate:none;scale:1}}
.fbi-capa-1{translate:calc(var(--fbi-mx,0)*-14px) calc(var(--fbi-my,0)*-10px + var(--fbi-sp,0)*80px)}
.fbi-capa-2{translate:calc(var(--fbi-mx,0)*22px) calc(var(--fbi-my,0)*16px + var(--fbi-sp,0)*36px)}

/* ═══ 5 · LOS TÍTULOS caen palabra por palabra (el H1 al irse el telón, cada H2 cuando aparece) ═══ */
.fbi-pm{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.14em 0 .22em;margin:-.14em 0 -.22em}
.fbi-p{display:inline-block}
.fbi-partido:not(.fbi-listo) .fbi-p{translate:0 120%}
.fbi-listo .fbi-p{animation:fbi-palabra 1s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--fbi-dt,0s) + var(--fbi-w,0)*60ms)}
.fbi-fin .fbi-pm{overflow:visible}
.fbi-fin .fbi-p{animation:none!important;translate:none!important;rotate:none!important}
@keyframes fbi-palabra{from{translate:0 120%;rotate:3deg}to{translate:none;rotate:none}}

/* ═══ 6 · AL BAJAR: las tarjetas suben en cascada y las fotos se revelan de abajo hacia arriba ═══ */
.fbi-rv:not(.fbi-in){opacity:0;translate:0 44px;scale:.97}
.fbi-rv.fbi-in{animation:fbi-rv .95s cubic-bezier(.16,1,.3,1) var(--fbi-rd,0s) both}
@keyframes fbi-rv{from{opacity:0;translate:0 44px;scale:.97}to{opacity:1;translate:none;scale:1}}
.fbi-fo:not(.fbi-in){clip-path:inset(100% 0 0 0)}
.fbi-fo.fbi-in{animation:fbi-fo 1.15s cubic-bezier(.65,0,.2,1) var(--fbi-rd,0s) both}
.fbi-fo.fbi-in img{animation:fbi-fo-img 1.5s cubic-bezier(.16,1,.3,1) var(--fbi-rd,0s) both}
@keyframes fbi-fo{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes fbi-fo-img{from{scale:1.14}to{scale:1}}

/* ═══ 7 · LA LINTERNA (compu con mouse): la grilla se ilumina alrededor del cursor en la cabecera y en las secciones tinta ═══ */
.fbi-con-linterna{isolation:isolate}
.fbi-linterna{position:absolute!important;inset:0!important;z-index:-1!important;margin:0!important;pointer-events:none;opacity:0;transition:opacity .45s ease;
  background-image:radial-gradient(circle 300px at var(--fbi-lx,50%) var(--fbi-ly,50%),var(--fbi-lg,transparent),transparent 70%),
    linear-gradient(var(--fbi-lc) 1px,transparent 1px),linear-gradient(90deg,var(--fbi-lc) 1px,transparent 1px);
  background-size:auto,64px 64px,64px 64px;
  -webkit-mask-image:radial-gradient(circle 240px at var(--fbi-lx,50%) var(--fbi-ly,50%),#000 0,rgba(0,0,0,.5) 45%,transparent 100%);
  mask-image:radial-gradient(circle 240px at var(--fbi-lx,50%) var(--fbi-ly,50%),#000 0,rgba(0,0,0,.5) 45%,transparent 100%)}
.fbi-linterna.on{opacity:1}
.fbi-linterna--clara{--fbi-lc:rgba(13,14,18,.10)}
.fbi-linterna--tinta{--fbi-lc:rgba(255,255,255,.11);--fbi-lg:rgba(255,255,255,.045)}

/* ═══ Quieto: «reducir movimiento» del sistema y al imprimir ═══ */
@media (prefers-reduced-motion:reduce){
  .fbi-telon,.fbi-cortina,.fbi-progreso,.fbi-linterna{display:none!important}
  .fbi-entra,.fbi-pop,.fbi-foto-hero,.fbi-rv,.fbi-fo,.fbi-fo img,.fbi-p{animation:none!important;opacity:1!important;translate:none!important;scale:none!important;clip-path:none!important}}
@media print{
  .fbi-telon,.fbi-cortina,.fbi-progreso,.fbi-linterna{display:none!important}
  .fbi-entra,.fbi-pop,.fbi-foto-hero,.fbi-rv,.fbi-fo,.fbi-fo img,.fbi-p{animation:none!important;opacity:1!important;translate:none!important;scale:none!important;clip-path:none!important}}