* {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased
}

*,
*::after,
*::before {
  box-sizing: border-box;
}

a {
  color: currentColor;
  text-decoration: underline 1.5px;
  text-underline-offset: 3px;
}


button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
}


button {
  border: none;
  width: auto;
  overflow: visible;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: normal;
  -webkit-appearance: none;
}



h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 1rem;
  font-weight: normal;
}


:root {

  --font: "Archivo Narrow", sans-serif;
  font-family: var(--font);
  --font-title: "SCENE";
  --font-script: "Acte";

  --bg: white;
  --text: black;
  --red: #f6b9b8;
  --red-dark: #e14720;
  --blue: #c1d2ff;
  --blue-dark: #293fc2;
  --yellow: #faf598;
  --yellow-dark: #c3bb00;


  --border-w: 3px;
  --border: var(--border-w) solid var(--text);
  --padding-inline: 1.75rem;
  --header-h: 4.25rem;
  --breadcrumb-h: 3rem;
  --footer-h: 3rem;

  --z-header: 500;

  --fs-title-small: 1.5rem;
  --fs-title-medium: 2.25rem;
  --fs-title-big: 4rem;
  --underline: underline 1.5px;
}


@media screen and (max-width: 640px) {
  :root {
    --padding-inline: 1rem;
    --breadcrumb-h: 2.5rem;
    --footer-h: 2.5rem;
    --fs-title-big: 3rem;

  }

  html {
    width: 100vw;
    overflow-x: hidden;
  }
}

html {
  background-color: var(--bg);
  margin-top: calc(var(--header-h) + var(--breadcrumb-h));
  padding-bottom: var(--footer-h);
  scroll-behavior: smooth;
  line-height: 1.2;
}

:target {
  scroll-margin-top: calc(var(--header-h) + var(--breadcrumb-h));
}

.creation-agenda summary:hover,
button[aria-expanded="true"],
[aria-current="true"],
button:hover,
a:hover {
  color: currentColor;
  text-decoration: var(--underline) !important;
  text-underline-offset: 3px;
  cursor: pointer;
}

figure,
img {
  width: 100%;
  display: flex;
}