.generic-info-box {
    display: flex;
    flex-direction: column-reverse;
}

.generic-info-box__content {
    background-color: #fff;
    padding: 26px 16px 16px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    position: relative;
}

.generic-info-box__title {
    color: #2E2D31;
    font-family: "Playfair Display";
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: unset;
    padding: unset;
    display: flex;
    flex-direction: column;
}

.generic-info-box__title p {
    margin: unset;
    padding: unset;
}

.generic-info-box__text {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.generic-info-box__text p {
    color: rgba(46, 45, 49, 0.75);
    font-feature-settings: 'dlig' on;
    font-family: "Nunito Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 21px */
    margin: unset;
    padding: unset;
}

.generic-info-box__image-container img {
    display: block;
    width: 100%;
    aspect-ratio: 359 / 292;
}

.generic-info-box .frame {
    position: absolute;
    z-index: 1;
    width: 130px;
    aspect-ratio: 130 / 136;
    right: 24px;
    top: -54px;
}

.generic-info-box .frame .frame-inner {
    position: absolute;
    width: 100%;
    height: 100%;
}

.generic-info-box .frame .frame-inner::before {
    content: '';
    position: absolute;
    z-index: -2;
    left: -50%;
    top: -50%;
    width: 200%;
    height: 200%;
    background-image: linear-gradient(to bottom right, #CAA969 50%, #FFF 80%);
    display: none;
}

/*.generic-info-box .frame .frame-inner {
    clip-path: polygon(
            0% 1%,
            100% 1%,
            100% 60%,
            99% 60%,
            99% 30%,
            99% 2%,
            1% 2%,
            1% 99%,
            30% 99%,
            30% 100%,
            100% 100%,
            0% 100%
    );

    rotate: 90deg
} v1 implementation */


.generic-info-box:hover .frame .frame-inner::before {
    animation: rotate 3s linear infinite;
}

.generic-info-box .frame .frame-inner svg {
    width: 130px;
    height: 136px;
}

.generic-info-box .frame .frame-inner svg rect {
    width: 130px;
    height: 136px;
    stroke-dasharray: 604 150;
    stroke-dashoffset: 260;
    stroke-width: 3px;
    fill: transparent;
    stroke: #cfa04f;
    left: -50px;
    transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
}

.generic-info-box:hover .frame .frame-inner svg rect {
    stroke-width: 8px;
    stroke-dashoffset: 614;
    stroke-dasharray: 400 153;
}

@media (min-width: 1200px) {
    .generic-info-box {
        flex-direction: row;
        gap: 0;
        align-items: center;
        justify-content: center;
    }

    .generic-info-box__content {
        padding: 59px 57px;
        width: 425px;
        min-width: 425px;
    }

    .generic-info-box__title {
        font-size: 32px;
    }

    .generic-info-box__text p {
        font-size: 16px;
    }

    .generic-info-box__image-container {
        max-width: 670px;
        padding-bottom: 64px;
    }

    .generic-info-box__image-container img {
        display: block;
        width: 100%;
        aspect-ratio: 670 / 484;
    }

    .generic-info-box .frame {
        width: 166px;
        aspect-ratio: 166 / 135;
        right: 54px;
        top: -81.5px;
    }

    /*.generic-info-box .frame .frame-inner {
        rotate: 0deg;
    } v1 implementation */

    .generic-info-box .frame .frame-inner::before {
        display: none;
    }

    .generic-info-box .frame .frame-inner svg {
        height: 135px;
        width: 166px;
    }

    .generic-info-box .frame .frame-inner svg rect {
        height: 135px;
        width: 166px;
        stroke-dasharray: 524 172;
        stroke-dashoffset: 276;
        stroke-width: 3px;
        fill: transparent;
        stroke: #cfa04f;
        left: -50px;
        transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
    }

    .generic-info-box:hover .frame .frame-inner svg rect {
        stroke-width: 8px;
        stroke-dashoffset: -420;
        stroke-dasharray: 300 172;
    }
}
