/* =========================================
   FLOATING MENU BAR
   ========================================= */
.floating-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  text-align: center;
  padding: 10px 0;
}

/* =========================================
   REMOVE PAGE MARGINS
   ========================================= */
body {
  margin: 0;
}

/* =========================================
   HIDE SPECIFIC FOOTER WIDGET TITLES
   ========================================= */
.footer-recent-posts h5,
.footer-products h5 {
  display: none;
}

/* =========================================
   HIDE CUSTOM HTML BLOCK ON SPLASH PAGE
   ========================================= */
#splash-css {
  display: none;
}

/* =========================================
   HIDE PAGE TITLES
   WordPress.com / Hello Elementor
   ========================================= */
h1.entry-title,
h1.page-title,
header.entry-header {
  display: none !important;
}

/* =========================================
   HIDE CUSTOM WOOCOMMERCE PRODUCT TEXT & BUTTONS
   ========================================= */
.woo-custom-products ul.products li.product h2,
.woo-custom-products ul.products li.product .price,
.woo-custom-products ul.products li.product .woocommerce-product-details__short-description,
.woo-custom-products ul.products li.product .button {
  display: none !important;
}

/* Ensure products are top-aligned */
.woo-custom-products ul.products {
  align-items: flex-start;
}

/* Product container alignment */
.woo-custom-products ul.products li.product {
  padding: 0;
  margin: 0;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

/* Image-only Woo products – scale + border */
.woo-custom-products ul.products li.product img {
  transform: scale(0.6); /* adjust: 0.6–0.85 */
  transform-origin: top center;
  border: 5px solid #444444; /* change color if needed */
  box-sizing: border-box;
  display: block;
}

/* =========================================
   CUSTOM SPLASH PAGE BUTTON SWAP
   ========================================= */
.splash-buttonswap-1 img {
  content: url("https://pressxstudio.com/wp-content/uploads/2026/02/path87.png");
  transition: 0.25s ease-in-out;
}

.splash-buttonswap-1:hover img {
  content: url("https://pressxstudio.com/wp-content/uploads/2026/02/path196.png");
}



/* =========================================
   UNIVERSAL HUE WAVE BACKGROUND – SYNCHRONIZED
   Targets splash and footer
   ========================================= */

.splash-background,
.custom-footer {
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center;

  /* CSS variable to control rotation speed */
  --hue-rotation-duration: 50000ms; /* 50s default */
}

/* DESKTOP: Pseudo-element layers for wave motion only */
.splash-background::before,
.splash-background::after,
.custom-footer::before,
.custom-footer::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: inherit;
  background-size: inherit;
  background-position: inherit;
  pointer-events: none;
  transform: translateZ(0);
  will-change: transform;
  z-index: -1; /* behind content */
}

/* Layer 1 – primary wave motion */
.splash-background::before,
.custom-footer::before {
  transform: scale(1.1);
  animation: wave1 40s ease-in-out infinite;
  mix-blend-mode: normal;
  opacity: 0.9;
}

/* Layer 2 – offset wave motion */
.splash-background::after,
.custom-footer::after {
  transform: scale(1.15);
  animation: wave2 40s ease-in-out infinite;
  mix-blend-mode: overlay;
  opacity: 0.6;
}

/* Wave animations (position only) */
@keyframes wave1 {
  0% { transform: translate3d(0,0,0) scale(1.1); }
  50% { transform: translate3d(80px,40px,0) scale(1.15); }
  100% { transform: translate3d(0,0,0) scale(1.1); }
}

@keyframes wave2 {
  0% { transform: translate3d(0,0,0) scale(1.15); }
  50% { transform: translate3d(-90px,-50px,0) scale(1.2); }
  100% { transform: translate3d(0,0,0) scale(1.15); }
}

/* Mobile fallback: hide pseudo-elements */
@media (max-width: 768px) {
  .splash-background::before,
  .splash-background::after,
  .custom-footer::before,
  .custom-footer::after {
    display: none;
  }

  .splash-background {
    height: 100svh;
  }
}
