.portada{position:relative;isolation:isolate}.portada .portada__txt{position:relative;z-index:2;background:transparent}
/* The surround uses the video's coordinate system: 3 × width, 9/8 × height.
   Edge reflections reuse the original poster and meet its pixels at x=0 and x=100%.
   They fade into the outpainting outside the video; the video itself is untouched. */
.mf-forest{position:relative;isolation:isolate;min-width:0;width:100%;aspect-ratio:9/16;clip-path:inset(-6.25% -100% 0)}
.portada .mf-forest video.portada__video{position:relative;z-index:2;width:100%;max-width:none;border:0;border-radius:0;box-shadow:none;background:transparent}
.mf-frame{position:absolute;z-index:0;pointer-events:none;width:300%;max-width:none;height:112.5%;left:-100%;top:-6.25%;object-fit:fill;mask-image:linear-gradient(to right,transparent 12%,#000 33.333%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 5.5%,#000 94.5%,transparent);mask-composite:intersect}
.mf-forest::before,.mf-forest::after{content:"";position:absolute;z-index:1;pointer-events:none;top:0;width:100%;height:100%;background:url('/video/esto-somos-poster.jpg') 0 0/100% 100% no-repeat;transform:scaleX(-1)}
.mf-forest::before{left:-100%;mask-image:linear-gradient(to right,#000 0%,#000 2%,transparent 25%),linear-gradient(to bottom,transparent,#000 5%,#000 95%,transparent);mask-composite:intersect}
.mf-forest::after{right:-100%;mask-image:linear-gradient(to left,#000 0%,#000 2%,transparent 25%),linear-gradient(to bottom,transparent,#000 5%,#000 95%,transparent);mask-composite:intersect}
.mf-edge{position:absolute;z-index:1;pointer-events:none;left:0;width:100%;height:100%;background:url('/video/esto-somos-poster.jpg') 0 0/100% 100% no-repeat;transform:scaleY(-1)}
.mf-edge--top{top:-100%;mask-image:linear-gradient(to bottom,#000,transparent 6.25%)}
.mf-edge--bottom{display:none}
/* Clip the decoration at the viewport; keep native video controls clickable. */
main:has(.mf-forest){overflow:clip}.mf-scroll{position:fixed;z-index:40;left:28px;right:28px;bottom:max(12px,env(safe-area-inset-bottom));height:56px;pointer-events:none}.mf-track{position:absolute;left:28px;right:28px;bottom:4px;height:2px;background:#0d5c4c35}.mf-fill{height:100%;background:#0d5c4c;transform-origin:left}.mf-runner{position:absolute;width:64px;height:44px;bottom:0;transform:translateX(-50%);color:#0d5c4c}.mf-runner svg{display:block;width:100%;height:100%;filter:drop-shadow(0 1px 1px #edf2ea)}.leg{transform-box:fill-box;transform-origin:50% 0%;animation:mf-gallop .32s ease-in-out infinite alternate;animation-play-state:paused}.leg-b,.leg-c{animation-delay:-.32s}.is-running .leg{animation-play-state:running}.mf-pause{position:fixed;z-index:41;bottom:72px;right:12px;border:1px solid #0d5c4c;background:#edf2ea;color:#0d5c4c;border-radius:4px;padding:7px 10px;font:12px system-ui;opacity:1;pointer-events:auto}.mf-pause:focus-visible,.mf-pause:hover{opacity:1;pointer-events:auto;outline:2px solid #0d5c4c;outline-offset:3px}.mf-scroll:hover + .mf-pause{opacity:1}.mf-pause[hidden]{display:none}
@keyframes mf-gallop{from{transform:rotate(-28deg)}to{transform:rotate(28deg)}}
@media(min-width:861px){.portada .portada__txt{padding-right:14px}.mf-forest{margin-top:8px}}
@media(max-width:860px){.mf-forest{width:min(100%,244px);margin:16px auto 25px}.mf-frame{mask-image:linear-gradient(to right,transparent,#000 28%,#000 72%,transparent),linear-gradient(to bottom,transparent,#000 5.5%,#000 94.5%,transparent);mask-composite:intersect}.mf-scroll{left:8px;right:8px;height:38px}.mf-runner{width:48px;height:34px}.mf-pause{opacity:1;pointer-events:auto;bottom:52px;font-size:11px;padding:5px 8px}}
@media(prefers-reduced-motion:reduce){.mf-runner .leg{animation:none!important}html{scroll-behavior:auto!important}}
@media print{.mf-scroll,.mf-pause,.mf-frame{display:none}}
