.product_meta .sku_wrapper {
    display: none !important;
}
.product_meta .sku_wrapper,
.product_meta .tagged_as {
    display: none !important;
}

/* Mobile: turn Services into a horizontal swipe section */
@media (max-width: 768px) {
  .services-slider {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 1.5rem;
    padding-bottom: 1rem;
  }

  .services-slider > .wp-block-column {
    min-width: 80%;              /* how wide each "card" is on mobile */
    flex: 0 0 auto;
    scroll-snap-align: start;
  }
}


/* Make 4-image section swipeable on mobile */
@media (max-width: 768px) {
  .image-slider {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 1rem;
    padding-bottom: 1rem;
  }

  .image-slider img {
    width: 100%;
    height: auto;
    border-radius: 8px; /* optional styling */
  }

  .image-slider > * {
    flex: 0 0 auto;
    min-width: 75%; /* Adjust how much of the screen each image takes */
    scroll-snap-align: start;
  }
}








/* Fix vertical Contact button on mobile */
@media (max-width: 768px) {
  /* Case 1: class is on the wrapper .wp-block-button */
  .homepage-contact-button.wp-block-button,
  .homepage-contact-button.wp-block-button .wp-block-button__link,
  /* Case 2: class is on the link itself */
  .homepage-contact-button.wp-block-button__link {
    writing-mode: horizontal-tb !important;
    transform: none !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    justify-content: center;
    align-items: center;
    width: auto;
    min-width: 140px;
    padding: 0.75rem 1.75rem;
    font-size: 0.9rem;
    text-align: center;
  }

  /* If the button is inside a Buttons block that’s too narrow */
  .wp-block-buttons .homepage-contact-button {
    width: auto !important;
  }
}





@media (max-width: 768px) {
  .easyordering-slider {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: scroll !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important; /* smooth scroll on iOS */
    scroll-snap-type: x mandatory !important;
    gap: 1rem !important;
    width: 100% !important;
  }

  .easyordering-slider::-webkit-scrollbar {
    display: none; /* hide scrollbar for clean look */
  }

  .easyordering-slider > * {
    flex: 0 0 auto !important;
    width: 75% !important; /* how much screen each card takes */
    max-width: 80% !important;
    scroll-snap-align: start !important;
    box-sizing: border-box !important;
  }

  .easyordering-slider img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 8px; /* optional */
  }
}



/* Arrow indicator on the right edge in #004aad */
@media (max-width: 768px) {
  .services-slider,
  .image-slider,
  .easyordering-slider {
    position: relative;
  }

  .services-slider::after,
  .image-slider::after,
  .easyordering-slider::after {
    content: "→";
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5rem;
    color: #004aad; /* your custom blue */
    animation: nudge 1.5s ease-in-out infinite;
    pointer-events: none;
    opacity: 0.8;
  }

  @keyframes nudge {
    0%, 100% {
      transform: translate(0, -50%);
      opacity: 0.6;
    }
    50% {
      transform: translate(6px, -50%);
      opacity: 1;
    }
  }
}




/* Style all form fields consistently */
textarea,
input[type="text"],
input[type="email"],
select {
  border: 1.5px solid #5B2C2C !important; /* Dandelion brown */
  border-radius: 6px;
  padding: 8px 10px;
  font-family: 'Manrope', sans-serif;
  font-size: 15px;
  color: #333;
  box-shadow: none !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* On focus (when typing or selecting) */
textarea:focus,
input[type="text"]:focus,
input[type="email"]:focus,
select:focus {
  border-color: #004aad !important; /* your Dandelion blue */
  box-shadow: 0 0 4px rgba(0, 74, 173, 0.25);
  outline: none !important;
}

/* Optional: ensure placeholder text is easy to see */
textarea::placeholder,
input::placeholder {
  color: #999;
  opacity: 1;
}





/* Fix Gutenberg Cover zoom on mobile */
@media (max-width: 768px) {
  .homepage-hero {
    min-height: 280px !important; /* sets a rectangular shape */
  }

  .homepage-hero img.wp-block-cover__image-background {
    object-fit: contain !important; /* stops the zoom */
    object-position: center center !important;
    height: auto !important;
    width: 100% !important;
  }

  .homepage-hero .wp-block-cover__inner-container {
    padding: 40px 20px !important; /* adjusts spacing for text */
  }
}





/* Reduce spacer height on mobile */
@media (max-width: 768px) {
  .hero-spacer {
    height: 80px !important; /* smaller gap for mobile */
  }
}




/* Hide mobile-only spacer on desktop */
.mobile-only-spacer {
  display: none !important; /* hidden by default */
}

/* Show it only on mobile screens */
@media (max-width: 768px) {
  .mobile-only-spacer {
    display: block !important;
  }
}





/* Make intro text smaller on mobile */
@media (max-width: 768px) {
  .homepage-intro-text {
    font-size: 15px !important;   /* try 15–16px to start */
    line-height: 1.5 !important;  /* keeps it readable */
  }
}