body{
margin:0;
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto;
background:#0b0b0d;
color:#f2f2f4;
}

/* container */

.article{
max-width:1100px;
margin:auto;
padding:80px 20px;
}

/* titre */

.title{
text-align:center;
font-size:44px;
margin-bottom:40px;
}

/* layout */

.article__layout{
display:grid;
grid-template-columns:420px 1fr;
gap:60px;
margin-bottom:40px;
}

/* image */

.article__image{
width:100%;
border-radius:16px;
position:sticky;
top:120px;
}

/* intro */

.article__intro{
font-size:18px;
line-height:1.8;
color:#c7c7cc;
}

/* contenu */

.article__content{
max-width:760px;
margin:auto;
font-size:18px;
line-height:1.8;
color:#c7c7cc;
}

.article__content h2{
margin-top:40px;
color:white;
}

/* bouton */

.back{
display:inline-block;
margin-top:60px;
border:1px solid #df437c;
padding:12px 20px;
border-radius:8px;
text-decoration:none;
color:white;
}

/* ========================= */
/* TABLETTE */
/* ========================= */

@media (max-width:900px){

.article__layout{
grid-template-columns:1fr;
gap:40px;
}

.article__image{
position:relative;
top:0;
}

.title{
font-size:34px;
}

.article{
padding:60px 20px;
}

}

/* ========================= */
/* MOBILE */
/* ========================= */

@media (max-width:600px){

.title{
font-size:28px;
margin-bottom:30px;
}

.article__intro{
font-size:16px;
}

.article__content{
font-size:16px;
}

.article__content h2{
font-size:22px;
}

.back{
margin-top:40px;
padding:10px 16px;
}

}

/* ========================= */
/* PETIT MOBILE */
/* ========================= */

@media (max-width:400px){

.article{
padding:50px 16px;
}

.title{
font-size:24px;
}

.article__intro{
font-size:15px;
}

.article__content{
font-size:15px;
}

.article__content h2{
font-size:20px;
}

}

/* ========================= */
/* 320px */
/* ========================= */

@media (max-width:320px){

.title{
font-size:22px;
}

.article__intro,
.article__content{
font-size:14px;
line-height:1.7;
}

.article{
padding:40px 14px;
}

.back{
font-size:14px;
padding:8px 14px;
}

}