/* Mobile-specific styles */
@media only screen and (max-width: 767px) {
    /* Adjust padding and margin for the specific h2 element */
    h2.wp-block-heading.alignwide.has-text-align-left.has-raleway-font-family {
        margin-top: 10px !important; /* Reduced top margin */
        margin-bottom: 30px !important; /* Increased bottom margin */
    }

    /* Increase left margin/padding for h5, h2, and p classes under the specific wp-block-group */
    
    /* For h5 under the specific wp-block-group */
    .wp-block-column .wp-block-group .wp-block-heading.has-accent-primary-color {
        margin-left: 20px !important;  /* Adjust this value as needed */
    }

    /* For h2 under the specific wp-block-group */
    .wp-block-column .wp-block-group .wp-block-heading.has-text-align-left {
        margin-left: 20px !important;  /* Adjust this value as needed */
    }

    /* For p under the specific wp-block-group */
    .wp-block-column .wp-block-group p.has-text-align-left {
        margin-left: 20px !important;  /* Adjust this value as needed */
    }

    /* Exclude other h2 elements with different classes (the one you mentioned) */
    h2.wp-block-heading.alignwide.has-raleway-font-family {
        margin-left: 0 !important; /* Reset any margin for this specific h2 element */
    }

    /* Adjust Cover Image to show the full image on mobile */
    .wp-block-cover__image-background.wp-image-6 {
        display: block !important; /* Ensures the image takes full space */
        width: 100% !important; /* Ensures image takes full width */
        height: auto !important; /* Maintains aspect ratio */
        background: none !important; /* Remove any background if it’s a background image */
    }

    /* Ensure that image in cover block is displayed fully */
    .wp-block-cover img {
        width: 100% !important; /* Ensures the image takes full width */
        height: auto !important; /* Adjusts height proportionally */
        object-fit: contain !important; /* Ensures no cropping */
        object-position: center !important; /* Centers the image */
    }

    /* Adjust Padding and Margin for Blocks */
    .wp-block-cover {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        min-height: 400px !important;  /* You can adjust this height as needed */
    }

    .wp-block-obb-position-block {
        margin-top: -200px !important;
    }

    .wp-block-group {
        padding: 0 !important;
    }

    .wp-block-columns {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .wp-block-column {
        margin-bottom: 10px !important;
    }

    .wp-block-buttons {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    /* Adjust Header and Navigation on Mobile */
    h2.wp-block-heading {
        margin-top: 10px !important;
        padding-top: 0 !important;
        font-size: clamp(2rem, 2rem + ((1vw - 0.2rem) * 3), 4rem) !important;
    }

    .wp-block-group {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .wp-block-spacer {
        height: 0 !important;
    }

    .wp-block-group.site-nav-wrapper {
        margin-top: 0 !important;
    }

    .wp-block-navigation__container {
        font-size: 14px !important;
    }

    .wp-block-spacer[style*="height:62px"] {
        height: 0 !important;
    }
}

/* Adjust the site logo */
.wp-block-site-logo img.custom-logo {
    width: 120px;
    height: auto;
}

/* Reduce space between logo and navigation */
.wp-block-group.site-logo-wrapper {
    padding-right: 10px;
    margin-left: 30px;
    margin-right: auto;
}

/* Adjust navigation */
.wp-block-group.site-nav-wrapper {
    padding: 0 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Adjust the hamburger menu */
.wp-block-navigation__responsive-container-open {
    margin-left: 0;
    margin-right: auto;
}

.wp-block-navigation__responsive-container-open svg {
    width: 22px;
    height: 22px;
}

/* Ensure the dropdown aligns correctly */
.wp-block-navigation__submenu-container {
    left: 0 !important;
}

/* Hide hero block on mobile */
@media only screen and (max-width: 767px) {
    .wp-block-obb-hero-block {
        display: none !important;
    }
}

/* Full-width styling for the custom block class */
.full-width-block {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* If the block is a Group block and its parent needs full-width */
.full-width-block .wp-block-group {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Optional: If the layout container needs to be full width */
.full-width-block .wp-container-core-group-is-layout-53 {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Mobile-specific styles */
@media only screen and (max-width: 767px) {
    /* Make paragraph text smaller on mobile */
    p {
        font-size: 11px !important; /* Adjust to your desired size */
        line-height: 1. !important; /* Adjust line height if necessary */
    }
}
.full-width-block {
    min-height: 100px; /* Adjust this value to your preference */
    padding-top: 10px; /* Optional: Adjust vertical padding */
    padding-bottom: 10px; /* Optional: Adjust vertical padding */
    margin-top: 0px; /* Optional: Adjust spacing above the block */
    margin-bottom: 0px; /* Optional: Adjust spacing below the block */
    background-color: rgb(73, 83, 105); /* Ensure the background color is consistent */
}
/* Default Spacer Size */
.normal-space {
    height: 62px;  /* Adjust to the original size you want */
}

/* Mobile-Specific Styling to Keep the Same Size */
@media only screen and (max-width: 767px) {
    .normal-space {
        height: 30px !important;  /* Keeps the spacer height the same on mobile */
    }
}
@keyframes moveInFromLeft {
  from {
    transform: translateX(-100vw); /* Start off-screen to the left */
  }
  to {
    transform: translateX(0); /* End at the current position */
  }
}

/* Target all blocks with the 'move-right' class */
.move-right {
  animation: moveInFromLeft 1s ease-out; /* Adjust duration and easing as needed */
  will-change: transform; /* Optimizes performance for animations */
}
/* Hide elements with the 'hide-on-mobile' class on mobile devices */
@media only screen and (max-width: 767px) {
    .hide-on-mobile {
        display: none !important;
    }
}
@media screen and (max-width: 768px) {
    .high-spacer {
        height: 40px !important; /* Adjust the height as needed */
    }
}
