@font-face {
  font-family: 'Anta';
  src: url('../assets/fonts/Anta-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'JosefinSans';
  src: url('../assets/fonts/JosefinSans-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'JosefinSans';
  src: url('../assets/fonts/JosefinSans-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'JosefinSans';
  src: url('../assets/fonts/JosefinSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

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

:root {
  --bg: #262e34;
  --blue: #89bcd9;
  --blue-light: #a8d4e2;
  --white: #F8F5EC;
  --muted: #b8d0db;
  --nav-text: #1c2b3a;
}

html {
  scroll-behavior: auto;
  scrollbar-width: none;
  overflow-x: clip;
}

html::-webkit-scrollbar {
  display: none;
}

body {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  max-width: 100vw;
  font-family: 'Rajdhani', sans-serif;
  background-color: var(--bg);
  color: var(--white);
}

#p-hero, #p-navbar, #p-why-me, #p-skills, #p-projects,
#p-references, #p-contact, #p-legal, #p-privacy, #p-footer {
  display: contents;
}

body:has(#legal-notice.active) .hero,
body:has(#privacy-policy.active) .hero {
  display: none;
}