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

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

:root {
  --pa-obsidian: #080b0f;
  --pa-petrol: #0d171c;
  --pa-petrol-deep: #091116;
  --pa-porcelain: #f2f3f2;
  --pa-silver: #b8bec2;
  --pa-slate: #8f999f;
  --pa-mineral: #d8d1c6;
  --pa-mineral-deep: #c9c0b3;
  --pa-ink: #151616;
  --pa-line: rgba(242, 243, 242, 0.16);
  --pa-line-dark: rgba(21, 22, 22, 0.2);
  --pa-font-wordmark: "Cinzel", Georgia, serif;
  --pa-font: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pa-page-gutter: clamp(22px, 4vw, 72px);
  --pa-section-y: clamp(72px, 8.5vw, 128px);
  --pa-nav-height: 76px;
  --pa-content: 1440px;
  --pa-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --pa-fast: 220ms;
  --pa-reveal: 520ms;
  --pa-radius: 2px;
}
