@keyframes a_floating {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}
.fixed-head {
  width: 100vw;
  height: calc(100vh + 1px);
  scroll-snap-type: y mandatory; /* Forces snapping on the vertical axis */
  scroll-behavior: smooth;
}

.fixed-head img {
  width: 100vw;
  height: calc(100vh + 1px);
  object-fit: cover;
} 
body.admin-bar .fixed-head {
  height: calc(100vh - 31px); /* Adjust for the admin bar height */
}
body.admin-bar .fixed-head img {
  height: calc(100vh - 31px); /* Adjust for the admin bar height */
}
.content-wrap {
  min-height: 100vh;
  scroll-snap-align: start; /* Ensures this section snaps to the start of the viewport */
  margin: 0; /* Removes default margin */
}
.content-wrap > header {
  /* transform: translateY(0); */
  transition: all 0.3s ease;
  position: -webkit-sticky; /* For Safari */ 
  position: sticky;
  top: 0;
  z-index: 1000;
}
.content-wrap > header::before {
  content: '';
  position: absolute;
  width: 100%;
  height: calc(100% + 2em);
  top: -1em;
  display: block;
  background: linear-gradient(
    to bottom,
    rgba(256, 255, 255, 0) 0,
    rgba(255, 255, 255, 1) 1em,
    rgba(256, 255, 255, 1) calc(100% - 1em),
    rgba(255, 255, 255, 0) 100%
  );
  /* opacity: 0; */
  transition: opacity 0.3s ease;
}


.content-wrap.off-screen > header {
  transform: translateY(-100%);
}
.content-wrap.off-screen > header::before {
  opacity: 1;
}
.content-wrap.off-screen > header .wp-block-navigation__responsive-container-open {
  display: none;
}
.scroll-down-to-content {
  display:none;
  cursor: pointer; /* Indicates that this element is clickable */
  width: 2.5rem;
  height: 2.5rem; /* Ensures the clickable area is square */
  animation: a_floating 1s ease-in-out infinite alternate running;
}

.content-wrap.off-screen .wp-block-site-title { 
  font-size: 2rem; /* Adjust the font size as needed */
}
.wp-block-site-title {
  font-size: 1.5rem;
  transition: all 0.3s ease;
}

@media (max-width: 600px) {
  .content-wrap.off-screen .scroll-down-to-content {
    display: inline-block;
  }
}