html {
    scroll-behavior: smooth;
}
[x-cloak] {
    display: none;
}

/* Light Mode Scrollbar (Default) */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-thumb {
    background-color: #57534e;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #000000;
}

::-webkit-scrollbar-track {
    background-color: #a8a29e; /* Light stone track for light mode */
}

.h-120{
height: 30rem;
}
.h-140{
height: 35rem;
}


/* Text */

.arizonia-regular {
  font-family: "Arizonia", cursive;
  font-weight: 400;
  font-style: normal;
}

.racing-sans-one-regular {
  font-family: "Racing Sans One", sans-serif;
  font-weight: 400;
  font-style: normal;
}


.bio-byline {
  font-style: italic;
  color: #555;
  text-align: right;
  margin-top: 1rem;
}


/* Headings */
h1 {
  font-size: 2.25rem; /* base: 36px */
  font-weight: 700;
}

h2 {
  font-size: 1.875rem; /* base: 30px */
  font-weight: 600;
}

h3 {
  font-size: 1.5rem; /* base: 24px */
  font-weight: 600;
}

h4 {
  font-size: 1.25rem; /* base: 20px */
  font-weight: 600;
}

h5 {
  font-size: 1rem; /* base: 16px */
  font-weight: 600;
}

h6 {
  font-size: 0.875rem; /* base: 14px */
  font-weight: 600;
}

/* Small screens and up (≥640px) */
@media (min-width: 640px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2.125rem; }
  h3 { font-size: 1.75rem; }
}

/* Medium screens and up (≥768px) */
@media (min-width: 768px) {
  h1 { font-size: 3rem; }
  h2 { font-size: 2.25rem; }
  h3 { font-size: 1.875rem; }
}

/* Large screens and up (≥1024px) */
@media (min-width: 1024px) {
  h1 { font-size: 3.5rem; }
  h2 { font-size: 2.5rem; }
}

/* Extra large screens (≥1280px) */
@media (min-width: 1280px) {
  h1 { font-size: 4rem; }
}


.showTex {
  font-size: 18px;
  line-height: 32px;
}

hr {
  height: 1px;
  background-color: #d5d5d5;
  border: none;
  margin: 0.5rem 0;
}