@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');


.quarto-title-banner h1,
.quarto-title-banner .title {
  font-weight: 600; /* semibold */
  font-family: 'Poppins', sans-serif;
}
.quarto-title-banner p {
  font-weight: 400; /* regular weight for subtitle */
  font-family: 'Poppins', sans-serif;
}
body {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 400; /* normal text weight */
}

/* Remove bottom margin from navbar so hero sits flush */
.navbar {
  margin-bottom: 0 !important;
  border-bottom: none !important;
}



/* Force hero/banner image to fill the viewport */
.quarto-title-banner {
  min-height: 100vh;       /* full screen height */
  background-size: cover;  /* scale image to cover area */
  background-position: center center; /* keep image centered */
  display: flex;           /* flexbox to center text */
  align-items: center;     /* vertical center */
  justify-content: center; /* horizontal center */
  margin-bottom: 0 !important;
  position: relative; /* Darken Quarto title-block banner background image */

}

.quarto-title-banner.page-columns.page-full {
  margin-bottom: 0 !important;
}


.quarto-title-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5); /* adjust opacity for desired darkness */
  z-index: 1;
}


/* Ensure text stays above the overlay */
.quarto-title-banner .quarto-title,
.quarto-title-banner .quarto-subtitle {
  position: relative;
  z-index: 2;
  color: #fff;
}


.quarto-title-block {
  text-align: center;           /* ensure block centers its children */
  display: flex;
  flex-direction: column;
  align-items: center;          /* center horizontally */
  justify-content: center;      /* center vertically */
  min-height: 60vh;             /* adjust hero height */
  padding: 0;                   /* remove top/bottom padding */
}


/* Force white headings inside the banner */
.quarto-title-banner h1,
.quarto-title-banner .h1,
.quarto-title-banner h2,
.quarto-title-banner .h2 {
  color: #fff !important;
  text-align: center;
  font-size: 64px !important;
}


/* Force the subtitle font (the <p> after the h1) */
.nav-fixed.fullcontent.quarto-light .quarto-title.column-body h1.title + p + p {
  font-size: 20px !important;
  color: #fff;
  text-align: center;
}


h2 {
  color: #FC0A58; /* your custom color */
  text-align: center;
  font-size: 32px;
}


html {
  scroll-behavior: smooth;
}