* {
margin:0;
box-sizing: border-box;

}

body {
  --color-link: rgb(97, 220, 163);
  --clr: oklch(0.9889 0.0053 17.25);
width: 100vw;
height: 100%;
min-height: 100vh;
background: oklch(0.2264 0.0135 291.83);
color:var(--clr);
font-family: Palatino, Palatino Linotype, Palatino LT STD, Book Antiqua, Georgia, serif;
display:flex;
flex-direction: column;
place-content:center;
align-items:center;
flex-wrap: wrap;
}


img {
border-radius: 2rem;
box-shadow: 2px 2px 8px #111010;
border: 3px solid var(--clr);
margin-block:7rem;
  }
  .anim {
    transform : translateX(-100%);
    transition: all 1s cubic-bezier(.67,.07,.06,.98) ;
  }

h1 {
  font-size: clamp(2rem, 6.9vw - 1rem, 3.3rem);
  margin-block-start: 5rem;
  text-wrap: balance;
}

h3 {
  font-size: clamp(1.5rem, 8vw - 2rem, 3rem);
  margin-block-start: 3rem;
  text-wrap: balance;
}

  p {
font-size: clamp(.85rem, 4.3vw - 1rem, 1.65rem);
	text-align: justify;
  /*width: 55%;*/
	padding-inline: .45rem;
	hyphens: auto;
	margin-block: 1rem;
	line-height: 1.45;
  max-inline-size: clamp(36ch, 45ch, 50ch);
}

nav {
width:fit-content;
position: absolute;
bottom: .8em;
right: .8em;
padding: .5em .8em;
}

a.lien {
color: var(--color-link);
}

a.lien:hover {
color:var(--clr);
}

footer {
  border-top: 5px solid var(--clr);
  margin-block-start: 5rem;
}

footer p {
  width: fit-content;
}