How to format a column in the PnP Search Results Web Part

I'm trying to get a column in my PnP Search Results web part to be blue or grey for the background color, depending on the content in the column. The Visit Page column should be grey if the page is coming soon or blue if the page is available, so it should look like this:

For the Visit Page column, this is what I have:

<!-- If the URL length is less than or equal to 53, make the background grey -->

{{#if slot item root.slots.PreviewUrl.length <= 53}}

<a href="{{slot item root.slots.PreviewUrl}}" target="_blank" style = "

    padding: 10px 10px 10px 10px;

    cursor:pointer;

    border:none;

    color:white;

    font-weight:550;

    background-color:#A4A4A4;

    text-decoration:none;

    font-size:14px;

    text-align:center;

    display: flex;

    justify-content: center;

    ">

               {{slot item root.slots.VisitPage}}

</a>

<!-- If the URL length is greater than 53, make the background blue -->

    {{else}}

<a href="{{slot item root.slots.PreviewUrl}}" target="_blank" style = "

    padding: 10px 10px 10px 10px;

    cursor:pointer;

    border:none;

    color:white;

    font-weight:550;

    background-color:#0078d4;

    text-decoration:none;

    font-size:14px;

    text-align:center;

    display: flex;

    justify-content: center;

    ">

               {{slot item root.slots.VisitPage}}

</a>

    {{/if}}

When I try the code above I get a parse error: