.mobile-interactive-svg {
  transition: 
    transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    filter 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  transform-origin: center;
  cursor: pointer;

  /* Improves tap responsiveness */
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* Tap (finger down) state */
.mobile-interactive-svg:active {
  transform: scale(1.05);
  opacity: .95;

  filter:
    drop-shadow(0 0 1.5px rgba(255, 87, 87, 0.5))
    drop-shadow(0 0 3px rgba(250, 0, 0, 0.5))
    drop-shadow(0 0 6px rgba(82, 0, 0, 0.5));
}

.home-cover {
    min-height: 100vh;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* content at top */
    padding-top: calc(80px * 2.25); /* 175% of header height */
    box-sizing: border-box; /* include padding in height */
}

/* Full height cover specifically for mobile */
.home-cover-mobile {
    min-height: 100vh;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* content at top */
    padding-top: 5vh; 
    box-sizing: border-box; /* include padding in height */
}

/* Half height cover for desktop */
.half-cover {
    min-height: 50vh;
    height: 50vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* content at top */
    padding-top: calc(80px * 2.25); /* 175% of header height */
    box-sizing: border-box; /* include padding in height */
}



html {
    scroll-behavior: smooth;
}