/* Import fonts from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');

/* Torn Paper Effects */
@layer utilities {
  .torn-fine {
    clip-path: polygon(0% 0%, 100% 0%, 100% 90.2%, 95% 90.7%, 90% 93.3%, 85% 93%, 80% 98.5%, 75% 94.8%, 70% 95.1%, 65% 95.1%, 60% 95.2%, 55% 95.1%, 50% 93.4%, 45% 98.2%, 40% 97.3%, 35% 91.8%, 30% 96.7%, 25% 96%, 20% 98.6%, 15% 94.1%, 10% 98.3%, 5% 94.5%, 0% 94.7%);
  }
  .torn-coarse {
    clip-path: polygon(0% 0%, 100% 0%, 100% 84.1%, 87.5% 83.8%, 75% 97.4%, 62.5% 91.2%, 50% 95.4%, 37.5% 88.4%, 25% 94.7%, 12.5% 83%, 0% 96.3%);
  }
  .torn-deep {
    clip-path: polygon(0% 0%, 100% 0%, 100% 93.5%, 92.9% 74.2%, 85.7% 79.3%, 78.6% 92.2%, 71.4% 94.8%, 64.3% 98.7%, 57.1% 87.2%, 50% 90.2%, 42.9% 98.7%, 35.7% 88.8%, 28.6% 86.5%, 21.4% 82.9%, 14.3% 94.5%, 7.1% 89.5%, 0% 94%);
  }
  .torn-soft {
    clip-path: polygon(0% 0%, 100% 0%, 100% 94.2%, 90.9% 97.5%, 81.8% 96%, 72.7% 93.2%, 63.6% 93.6%, 54.5% 94.5%, 45.5% 98.4%, 36.4% 95.4%, 27.3% 93%, 18.2% 95.7%, 9.1% 96.2%, 0% 97.1%);
  }
  .torn-regular {
    clip-path: polygon(0% 0%, 100% 0%, 100% 88.3%, 92.3% 88.9%, 84.6% 92.4%, 76.9% 92%, 69.2% 99.3%, 61.5% 94.5%, 53.8% 94.8%, 46.2% 94.8%, 38.5% 94.9%, 30.8% 94.8%, 23.1% 92.5%, 15.4% 99%, 7.7% 97.7%, 0% 90.4%);
  }
}

/* =======================
    SITE NAVBAR / HEADER
========================== */

.site-navbar {
    background-color: #480c0d;
    font-family: "Source Serif 4";
    color: #480c0d;
}

.site-navbar-site-name {
    color: #f3e7c3;
}