.storefront-full-width-content.woocommerce-cart .entry-header,
  .storefront-full-width-content.woocommerce-checkout .entry-header,
  .storefront-full-width-content.woocommerce-account .entry-header,
  .storefront-full-width-content .woocommerce-products-header {
    padding: 0;
    }



.site-header .site-branding img {
    max-width: 500px;
}

.site-header {
padding-top: 00;
}
#masthead.site-header {
padding-bottom: 0;
}



@media screen and (min-width: 768px) {
  .site-branding {
    margin-bottom: 10;
  }
  
  .main-navigation ul.menu > li > a, .main-navigation ul.nav-menu > li > a {
    padding-top: 0;
  }
}

.site-content {
  margin-top: 10px;
}


button, 
html input[type="button"], 
input[type="reset"], 
input[type="submit"], 
a.button, 
a.button:visited, 
a.wp-block-button__link:not(.has-background) {
    border-radius: 15px;
}


/* =============================
   1. Cover meta above title
   ============================= */
.single-post header.entry-header {
    position: relative; /* positioning context for overlay */
}

.single-post header.entry-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 380px;       /* adjust width to cover meta but not the title */
    height: 28px;       /* adjust height to fully cover meta */
    background-color: #ffffff; /* match your page background */
    z-index: 50;        /* ensure overlay sits above meta text */
}

/* =============================
   2. Hide duplicate author below title
   ============================= */
.gh-author {
    display: none !important;
}

/* =============================
   3. Style custom author below title
   ============================= */
.single-post .gh-author {
    display: block;
    font-weight: bold;
    margin-top: 10px;      /* spacing below title */
    font-size: 1em;        /* optional: match theme size */
    color: #000;           /* optional: match theme text color */
    text-transform: capitalize; /* capital "B" in "By" */
    z-index: 20;
}

/* =============================
   4. Optional: make links in byline unclickable
        (if any remain)
   ============================= */
.single-post .byline a {
    pointer-events: none;  /* unclickable */
    text-decoration: none;
    color: inherit;
}

/* White overlay on meta for blog index */
body.blog .entry-header {
    position: relative;
}

body.blog .entry-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;            /* cover full meta line width */
    height: 24px;           /* adjust to cover meta */
    background-color: #ffffff; /* match page background */
    z-index: 20;
}

/* Set all blog post titles on the main blog page to green */
body.blog .entry-title a {
    color: #008037; /* replace with your green hex */
}

/* Hide full content below the first paragraph on the blog page */
body.blog .post .entry-content > *:not(:first-child) {
    display: none;
}


/* Ensure featured images show */
body.blog .post .post-thumbnail {
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

/* Style post titles green */
body.blog .post .entry-title a {
    color: #008037;
}

/* Optional hover color */
body.blog .post .entry-title a:hover {
    color: #008037;
}

/* Make sure blog page title and subtitle show */
body.blog .page-header {
    display: block;
    text-align: center;
    margin-bottom: 30px;
}


/* Hide categories and tags on all single blog posts */
.single-post .post-meta, 
.single-post .post-categories, 
.single-post .post-tags {
    display: none !important;
}

/* Optional: also hide the "Categories:" and "Tags:" labels if separate */
.single-post .posted-in, 
.single-post .tags-links {
    display: none !important;
}

/* Hide the entire Categories line on single posts */
.single-post span:contains("Categories:"),
.single-post a[href*="/category/"] {
    display: none !important;
}

/* Ensure paragraphs have spacing on mobile */
@media only screen and (max-width: 768px) {
    .entry-content p {
        margin-bottom: 1em; /* space between paragraphs */
        line-height: 1.6;   /* optional, makes it easier to read */
    }
}

body {
  -webkit-user-select: none; /* Chrome/Safari */
  -moz-user-select: none;    /* Firefox */
  -ms-user-select: none;     /* IE/Edge */
  user-select: none;         /* Standard */
}

img {
  -webkit-user-drag: none;   /* Disable dragging images */
  user-drag: none;
}


/* Target the specific element ID provided by the plugin */
.layout-5052 .element_1777237340972 {
    font-size: 22px !important;
    line-height: 1.2 !important;
}

/* Also target the link inside it, just in case */
.layout-5052 .element_1777237340972 a {
    font-size: 22px !important;
    line-height: 1.2 !important;
}


.wp-block-post-excerpt {
    display: block !important;
}

.wp-block-post-excerpt__excerpt {
    display: block !important;
    visibility: visible !important;
}




/* Hide Storefront + theme injected post meta on blog loop pages */
.blog .entry-footer,
.archive .entry-footer,
.single-post .entry-footer,
.wp-block-post-terms,
.wp-block-post-date,
.wp-block-post-author {
    display: none !important;
}




/* Query Loop - match smaller Post Grid style images */
.wp-block-query .wp-block-post-featured-image img {
    max-width: 500px;   /* adjust this to taste */
    width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
}

/* Optional: tighten spacing like Post Grid */
.wp-block-query .wp-block-post-template {
    gap: 40px;
}






/* Query Loop: Image left, text right layout */
.wp-block-query .wp-block-post-template {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* Each post becomes a row */
.wp-block-query .wp-block-post {
    display: flex;
    flex-direction: row;
    gap: 20px;
    align-items: flex-start;
}

/* Featured image left column */
.wp-block-query .wp-block-post-featured-image {
    flex: 0 0 320px;   /* adjust width here */
}

/* Make image fill its column */
.wp-block-query .wp-block-post-featured-image img {
    width: 100%;
    height: auto;
    display: block;
}

/* Text column (title + excerpt) */
.wp-block-query .wp-block-post > *:not(.wp-block-post-featured-image) {
    flex: 1;
}

/* Title styling (optional green like your brand) */
.wp-block-query .wp-block-post-title a {
    color: #1f7a4f !important;
    font-size: 20px;
}

/* Excerpt spacing */
.wp-block-query .wp-block-post-excerpt {
    margin-top: 8px;
}






/* Mobile: stack Query Loop posts vertically */
@media (max-width: 768px) {

    /* Stack layout */
    .wp-block-query .wp-block-post {
        flex-direction: column !important;
        gap: 12px;
        padding-bottom: 22px;
        margin-bottom: 22px;
        border-bottom: 1px solid rgba(0,0,0,0.08);
    }

    /* Featured image spacing + feel */
    .wp-block-query .wp-block-post-featured-image {
        width: 100% !important;
        flex: none !important;
        margin-bottom: 6px;
    }

    .wp-block-query .wp-block-post-featured-image img {
        width: 100% !important;
        height: auto;
        border-radius: 6px;
    }

    /* Title spacing */
    .wp-block-query .wp-block-post-title {
        margin: 0 !important;
        line-height: 1.25;
        font-size: 20px;
    }

    /* Excerpt readability */
    .wp-block-query .wp-block-post-excerpt {
        margin-top: 6px;
        font-size: 15px;
        line-height: 1.5;
        opacity: 0.9;
    }

    /* Remove extra clutter spacing if any */
    .wp-block-query .wp-block-post > * {
        max-width: 100%;
    }
}




@media (max-width: 768px) {

  /* 1. Kill any left/right offset layouts */
  .wp-block-columns,
  .wp-block-media-text,
  .is-layout-flex {
    flex-direction: column !important;
    align-items: center !important;
  }

  /* 2. Force images to center */
  .wp-block-image {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  /* 3. Make images full-width but contained */
  .wp-block-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* 4. Fix media-text (VERY likely your issue) */
  .wp-block-media-text {
    display: flex !important;
    grid-template-columns: 1fr !important;
  }

  .wp-block-media-text__media,
  .wp-block-media-text__content {
    width: 100% !important;
  }

  /* 5. Button fix: force wrapping + full width */
  .wp-block-button__link,
  .woocommerce a.button {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    white-space: normal !important;
  }

  /* 6. Prevent horizontal scroll caused by offsets */
  body {
    overflow-x: hidden;
  }
}