/* --- RESET --- */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}

body {
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

ul,
ol {
  list-style: none;
}

button {
  border: none;
  background: none;
  cursor: pointer;
}

/* --- Poppins --- */
@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-ExtraLightItalic.ttf") format("truetype");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-ExtraBoldItalic.ttf") format("truetype");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins/Poppins-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

/* --- DM Serif Display --- */
@font-face {
  font-family: "DM Serif Display";
  src: url("../fonts/DM_Serif_Display/DMSerifDisplay-Regular.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "DM Serif Display";
  src: url("../fonts/DM_Serif_Display/DMSerifDisplay-Italic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

/* --- ICONS --- */

:root {
  --font-heading: "DM Serif Display", Georgia, serif;
  --font-body: "Poppins", -apple-system, BlinkMacSystemFont, sans-serif;

  --japonica-50: #fdf5f3;
  --japonica-100: #fbeae5;
  --japonica-200: #f9d8cf;
  --japonica-300: #f3bcae;
  --japonica-400: #eb957e;
  --japonica-500: #e07a5f;
  --japonica-600: #ca5738;
  --japonica-700: #a9462c;
  --japonica-800: #8d3c27;
  --japonica-900: #753727;
  --japonica-950: #3f1a10;

  --grandis-25: #fdfbf7;
  --grandis-50: #fdf8ef;
  --grandis-100: #fbf0d9;
  --grandis-200: #f6ddb2;
  --grandis-300: #f2cc8f;
  --grandis-400: #e9a44e;
  --grandis-500: #e48a2b;
  --grandis-600: #d57121;
  --grandis-700: #b1581d;
  --grandis-800: #8d461f;
  --grandis-900: #723b1c;
  --grandis-950: #3d1c0d;
  --grandis-1000: #1e0f08;

  --tawny-port-50: #faf5f8;
  --tawny-port-100: #f7ecf3;
  --tawny-port-200: #f0dae9;
  --tawny-port-300: #e4bdd6;
  --tawny-port-400: #d393bb;
  --tawny-port-500: #c272a2;
  --tawny-port-600: #ad5586;
  --tawny-port-700: #94426d;
  --tawny-port-800: #7b395b;
  --tawny-port-900: #5d2e46;
  --tawny-port-950: #3d1a2c;

  --gun-powder-50: #f5f6f9;
  --gun-powder-100: #e7eaf2;
  --gun-powder-200: #d5dae8;
  --gun-powder-300: #b8c2d8;
  --gun-powder-400: #95a3c5;
  --gun-powder-500: #7c89b5;
  --gun-powder-600: #6a73a6;
  --gun-powder-700: #5e6497;
  --gun-powder-800: #50547d;
  --gun-powder-900: #3d405b;
  --gun-powder-950: #2c2d3f;

  --merino-50: #f9f7f3;
  --merino-100: #f3efe4;
  --merino-200: #e4dac4;
  --merino-300: #d3c29e;
  --merino-400: #c0a477;
  --merino-500: #b38e5c;
  --merino-600: #a67c50;
  --merino-700: #8a6344;
  --merino-800: #70513c;
  --merino-900: #5b4333;
  --merino-950: #312219;

}

/* --- BASE TYPOGRAPHY --- */
/* Par défaut sur tout le site : interlignage 140% / letter-spacing -2% */
body {
  font-family: var(--font-body);
  line-height: 1.4;
  letter-spacing: -0.02em;
  color: var(--gun-powder-950);
  background-color: var(--grandis-25);
}

/* --- ICONS (Material Symbols Rounded, weight 300 / grade 0 / opsz 24) --- */
.material-symbols-rounded {
  font-variation-settings:
    "FILL" 0,
    "wght" 300,
    "GRAD" 0,
    "opsz" 24;
  font-size: 24px;
  line-height: 1;
}