How to dynamically size a rectangular path with animated stroke width?

I have a Rectangle

and a Path

defined:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Rectangle Grid.Row="0" Stroke="Red" Width="{Binding RctWidth}"/>
    <Path Grid.Row="1" Stroke="Red">
        <Path.Data>
            <RectangleGeometry Rect="0,0,50,10"/>
        </Path.Data>
        <Path.Triggers>
            <EventTrigger RoutedEvent="Path.Loaded">
                <BeginStoryboard>
                    <Storyboard TargetProperty="StrokeThickness">
                        <DoubleAnimation RepeatBehavior="Forever" From="1" To="3" Duration="0:0:0.5"/>
                    </Storyboard>
                </BeginStoryboard>          
            </EventTrigger>
        </Path.Triggers>
    </Path>
</Grid>

      

        
        
        
      

    

The rectangle dynamically changes its width to match the anchor. The rectangular Path

has animation applied to it StrokeThickness

. I want the rectangle Path

to fit exactly to the size of the rectangle, but in a way that animating the stroke weight won't affect it (a thicker stroke should Path

actually do a little more than that Rectangle

- that's the intended behavior).

How can i do this?

Please note that I cannot use the property Stretch="Fill"

in Path

. In this case, the stroke weight will only grow inside the borders Path

, but I want the default stroke behavior to increase in both the inward and outward directions.

Also, I cannot change the view model to which the width is bound Rectangle

. This is an external component that I am not allowed to modify.

I could Rectangle

really get rid of it . Path

Its dynamically changing width is also important to me .