/*--- Article ---*/

.photo {
    width: 200%;
    margin: 0 -50%;
}

.text {
    display: grid;
    gap: 2rem;
    grid-template-columns: 1fr 1fr;
}

.ing,
.ins {
    grid-column: span 1;
}

frac {
    font-feature-settings: 'frac';
}

/*--- Small Screen Size ---*/

@media screen and (max-width:800px) {

    .photo {
        aspect-ratio: 1 / 1;
        width: 100%;
        margin: 0 auto;
    }

    .photo img {
        aspect-ratio: 1 / 1;
        height: 100%;
        object-fit: cover;
    }

    .text {
        grid-template-columns: 1fr;
    }

    .ing {
        order: 1;
    }

    .ins {
        order: 2;
    }

}