body{
background:white;
font-family:Arial, Helvetica, sans-serif;
margin:0;
text-align:center;
color:#333;
}

/* HEADER */

header{
position:relative;
height:140px;
overflow:hidden;
background:white;
}

.triangle{
position:absolute;
width:0;
height:0;
border-style:solid;
}

.t1{
border-width:140px 300px 0 0;
border-color:#3f8f5a transparent transparent transparent;
left:0;
top:0;
}

.t2{
border-width:140px 250px 0 0;
border-color:#4caf50 transparent transparent transparent;
right:0;
top:0;
}

.t3{
border-width:0 200px 120px 0;
border-color:transparent #66bb6a transparent transparent;
right:200px;
top:0;
}

/* LOGO + FORME */

.logo-container{
position:relative;
width:420px;
margin:60px auto 40px auto;
}

.logo{
position:relative;
width:350px;
z-index:2;
display:block;
margin:auto;
}

/* forme verte irrégulière */

.logo-shape{
position:absolute;
width:520px;   /* ≈ 1.2x */
height:240px;
background:#2e7d32;

clip-path: polygon(
10% 30%,
20% 10%,
70% 5%,
95% 30%,
90% 70%,
65% 90%,
25% 85%,
5% 60%
);

top:50%;
left:50%;
transform:translate(-50%,-50%);
z-index:1;
}

/* images */

.center{
margin:40px auto;
}

.center img{
max-width:90%;
height:auto;
display:block;
margin:auto;
}

.img-small{
transform: scale(0.4);
display:block;
margin:auto;
}

/* titre */

h1{
margin-top:20px;
font-size:36px;
font-weight:300;
}

/* contact */

.article{
max-width:500px;
margin:40px auto;
line-height:1.6;
font-size:18px;
}
.article ul,
.article ol {
    text-align: left;      /* force le texte des listes à être aligné à gauche */
    list-style-position: inside; /* les puces ou numéros restent à l’intérieur du bloc */
    margin-left: 1.5em;    /* espace entre le bord du div et la liste */
    padding-left: 0;        /* supprime le padding par défaut si nécessaire */
}

a{
color:#2e7d32;
text-decoration:none;
}

a:hover{
text-decoration:underline;
}

/* NAVIGATION */

.nav{
position:relative;
width:100%;
background:#2e7d32;
padding:10px 0;
z-index:1000;
}

/* cacher checkbox */

#menu-toggle{
display:none;
}

/* burger */

.burger{
display:flex;
flex-direction:column;
width:30px;
cursor:pointer;
margin-left:20px;
}

.burger span{
background:white;
border-radius:3px;
height:4px;
margin:4px 0;
transition:0.3s;
}

/* menu */

.menu{
list-style:none;
padding:0;
margin:0;
background:#2e7d32;
position:absolute;
top:50px;
left:0;
width:100%;
display:none;
text-align:center;

max-height:80vh;
overflow-y:auto;
z-index:1001;
}

.menu li{
padding:12px 0;
border-top:1px solid rgba(255,255,255,0.2);
}

.menu a{
color:white;
text-decoration:none;
font-size:18px;
}

/* ouverture */

#menu-toggle:checked + .burger + .menu{
display:block;
}

/* version desktop */

@media (min-width:768px){

.burger{
display:none;
}

.menu{
display:flex;
flex-direction:row;   /* force l'alignement horizontal */
justify-content:center;
align-items:center;
position:static;
width:100%;
}

.menu li{
display:block;
padding:15px 20px;
border:none;
}

.menu a{
font-size:17px;
}

}

.footer{
margin-top:60px;
padding:20px;
background:#f5f5f5;
font-size:14px;
text-align:center;
border-top:1px solid #ddd;
}

.footer a{
color:#2e7d32;
text-decoration:none;
margin:0 8px;
}

.footer a:hover{
text-decoration:underline;
}