/* The figure reserves the same grid row as before. The film uses the unused
   room around that footprint without changing the text column or the next section. */
.hero.hero-with-visual .finn-plano-fijo {
  position:relative;
  width:100%;
  max-width:580px;
}
.finn-plano-fijo::before {
  content:"";
  display:block;
  width:min(100%,460px);
  aspect-ratio:6/5;
  margin-inline-start:auto;
}
.hero .finn-plano-fijo #finn-equipo {
  display:block;
  position:absolute;
  top:calc(50% + clamp(0px,10vw - 128px,28px));
  right:calc(-1 * min(3.4vw,46px));
  transform:translateY(-50%);
  width:min(690px,calc(100% + clamp(82px,8.5vw,124px)));
  max-width:none;
  height:auto;
  aspect-ratio:13/10;
  object-fit:contain;
}
@media (min-width:761px) and (max-width:1100px) {
  .hero .finn-plano-fijo #finn-equipo {top:50%;width:calc(100% + 49px);right:-20px}
}
@media (max-width:760px) {
  .hero.hero-with-visual .finn-plano-fijo {width:min(100%,390px);justify-self:center}
  .finn-plano-fijo::before {width:min(340px,100%);margin-inline:auto}
  .hero .finn-plano-fijo #finn-equipo {top:50%;width:calc(100% + 16px);right:-8px}
}

.finn-control{position:absolute;z-index:1;right:0;bottom:0;border:1px solid #8aa7af;background:white;color:#18546a;font:inherit;font-size:12px;border-radius:4px;padding:5px 9px;cursor:pointer}
@media(hover:hover){.finn-plano-fijo:not(:hover):not(:focus-within) .finn-control{opacity:0}.finn-control:focus-visible{opacity:1}}
