@import url("base.css");

main > div:nth-last-child(1) {
    border-radius: 0 5rem 0 0;
    background: url('./assets/IMG_1318.JPG'), var(--blue);
    background-blend-mode: multiply;
    background-size: 100%;
}

/* CORRECTIF: le "t" parasite ligne 9 a été supprimé */

.right > div:nth-child(1) {
    width: 500px;
    flex: 0.45 1 0;
}

.right > div:nth-child(2) {
    flex: 0.55 1 0;
    border-radius: 2rem 0 0 2rem;
}

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

.grid > .content > div {
    display: flex;
    flex-direction: column;
    font-size: 2rem;
}

.grid > .content:nth-last-child(1) {
    border-radius: 2rem;
}

.grid > .content > div > h2 {
    padding: 1rem 0;
}

.mobile {
    display: none;
}

.no-mobile > img {
    width: 75%;
    margin-top: 5rem;
    margin-bottom: 5rem;
}

.right > .no-mobile > img {
    border-radius: 5rem 0 0 5rem;
    padding-right: 0;
}

.left > .no-mobile > img {
    border-radius: 0 5rem 5rem 0;
    padding-left: 0;
}

.about-section > section {
    display: flex;
}

.left > div:nth-child(1) {
    flex: 1 1 0;
    margin-top: auto;
    margin-bottom: auto;
}

/* CORRECTIF: font-size relevé de 0.80rem à 1rem, max-width élargi */
.left > div:nth-child(2) {
    padding-right: 5rem;
    padding-top: 5rem;
    display: inline;
    width: 400px;
    height: auto;
    text-align: left;
    font-size: 1rem;
    line-height: 1.7;
    margin-top: auto;
    margin-bottom: auto;
}

/* CORRECTIF: font-size relevé à 1rem, max-width supprimé */
.left > div > p {
    font-size: 1rem;
    line-height: 1.7;
    max-height: none;
    max-width: 500px;
}

.right > div:nth-child(2) {
    flex: 1 1 0;
    margin-top: auto;
    margin-bottom: auto;
    justify-content: right;
    display: flex;
}

.right > div:nth-child(1) {
    padding-left: 5rem;
    padding-top: 5rem;
    display: inline;
    width: 400px;
    height: auto;
    text-align: right;
    /* CORRECTIF: font-size relevé à 1rem */
    font-size: 1rem;
    line-height: 1.7;
    margin-top: auto;
    margin-bottom: auto;
}

.right > div > p {
    font-size: 1rem;
    line-height: 1.7;
}

.about-section > .right {
    display: flex;
}

.about-section > section {
    display: flex;
}

.about-section {
    padding-bottom: 5rem;
}


.about > div > img {
    width: 30%;
    height: 100%;
}
