/* =========================================
   SO TYRED
   MASTER ADDITIONAL CSS
   ========================================= */


/* =========================================
   1. REMOVE ORIGINAL LODESTAR HEADER IMAGE
   ========================================= */

.lodestar-front-page .custom-header,
.custom-header {
    display: none !important;
}


/* =========================================
   2. HOMEPAGE - PAGE 4584
   ========================================= */

/* Hide original Home page title */
#post-4584 .entry-header {
    display: none !important;
}

/* Remove extra space above homepage */
.page-id-4584 .site-content {
    padding-top: 0 !important;
}

/* Hide sidebar/widgets on homepage */
.page-id-4584 #secondary {
    display: none !important;
}

/* Give homepage full available width */
.page-id-4584 #primary,
.page-id-4584 .content-area {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
    margin-right: 0 !important;
}

/* Remove Lodestar's internal width restrictions */
.page-id-4584 .site-main,
.page-id-4584 .hentry,
.page-id-4584 .entry-content {
    width: 100% !important;
    max-width: none !important;
}

/* Overall homepage width */
.page-id-4584 .wrap {
    max-width: 1600px !important;
    width: 96% !important;
}

.page-id-4584 .entry-content {
    margin-top: 0 !important;
}


/* =========================================
   3. HOMEPAGE HERO
   ========================================= */

.page-id-4584 .wp-block-cover {
    max-width: 1600px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Hero headline */
.page-id-4584 .wp-block-cover h1,
.page-id-4584 .wp-block-cover .wp-block-heading {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;

    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    font-weight: 700 !important;

    max-width: 750px !important;
}

/* Hero subtitle */
.page-id-4584 .wp-block-cover p {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* Hero buttons */
.page-id-4584 .wp-block-cover .wp-block-button__link {
    color: #ffffff !important;
}

.page-id-4584 .wp-block-buttons {
    flex-wrap: wrap;
}


/* =========================================
   4. REMOVE POST FEATURES FROM HOMEPAGE
   ========================================= */

.page-id-4584 .sd-sharing-enabled,
.page-id-4584 .sd-sharing,
.page-id-4584 .sharedaddy,
.page-id-4584 .sd-like,
.page-id-4584 .jp-relatedposts {
    display: none !important;
}


/* =========================================
   5. REUSABLE SO TYRED WIDE MENU PAGES
   ========================================= */

/*
   Add this class to the outer Group block
   of each redesigned menu page:

   so-tyred-wide-page
*/

/* Hide Lodestar's original page title */
body.page:has(.so-tyred-wide-page) .entry-header {
    display: none !important;
}

/* Remove Lodestar's extra top padding */
body.page:has(.so-tyred-wide-page) .site-content {
    padding-top: 0 !important;
}

/* Hide sidebar/widgets */
body.page:has(.so-tyred-wide-page) #secondary {
    display: none !important;
}

/* Give page full available width */
body.page:has(.so-tyred-wide-page) #primary,
body.page:has(.so-tyred-wide-page) .content-area {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
    margin-right: 0 !important;
}

/* Remove internal Lodestar width restrictions */
body.page:has(.so-tyred-wide-page) .site-main,
body.page:has(.so-tyred-wide-page) .hentry,
body.page:has(.so-tyred-wide-page) .entry-content {
    width: 100% !important;
    max-width: none !important;
}

/* Overall internal page width */
body.page:has(.so-tyred-wide-page) .wrap {
    max-width: 1200px !important;
    width: 80% !important;
}

body.page:has(.so-tyred-wide-page) .entry-content {
    margin-top: 0 !important;
}

/* Display page headings using the case entered in WordPress */
.so-tyred-wide-page .wp-block-heading {
    text-transform: none !important;
}


/* =========================================
   6. INTERNAL PAGE BANNER
   ========================================= */

/*
   Synced pattern:
   So Tyred Page Header

   Cover block class:
   so-tyred-page-header
*/

/* Space between navigation and internal page banner */
.so-tyred-page-header {
    margin-top: 24px !important;
}

/* First Cover block fills available page width */
.so-tyred-wide-page .wp-block-cover:first-child {
    width: 100% !important;
    max-width: 100% !important;
}

/* Crop banner image cleanly */
.so-tyred-wide-page
.wp-block-cover:first-child
.wp-block-cover__image-background {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}


/* =========================================
   7. BLOG GRID
   ========================================= */

/*
   Add this class to the Blog Query Loop:

   so-tyred-blog-grid
*/

/* Give featured images consistent
   landscape proportions */
.so-tyred-blog-grid .wp-block-post-featured-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

/* Crop images without distortion */
.so-tyred-blog-grid
.wp-block-post-featured-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}


/* =========================================
   8. HOMEPAGE ABOUT SO TYRED
   ========================================= */

/*
   Outer About Group uses:

   so-tyred-about-home
*/

/* Ensure paragraph text has good contrast */
.so-tyred-about-home p {
    color: #333333 !important;
    -webkit-text-fill-color: #333333 !important;
    opacity: 1 !important;
}

/* About heading */
.so-tyred-about-home h2,
.so-tyred-about-home .wp-block-heading {
    color: #444444 !important;
    -webkit-text-fill-color: #444444 !important;
    opacity: 1 !important;
}

/* About button */
.so-tyred-about-home .wp-block-button__link {
    background-color: #173B6C !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
}


/* =========================================
   9. MAIN NAVIGATION
   ========================================= */

.main-navigation ul {
    text-align: center !important;
}

.main-navigation ul li {
    float: none !important;
    display: inline-block !important;
}


/* =========================================
   10. MOBILE
   ========================================= */

@media screen and (max-width: 768px) {

    /* Homepage width */
    .page-id-4584 .wrap {
        width: 94% !important;
    }

    /* Internal menu page width */
    body.page:has(.so-tyred-wide-page) .wrap {
        width: 94% !important;
    }

    /* Homepage hero */
    .page-id-4584 .wp-block-cover {
        width: 100% !important;
    }

    /* Stack homepage buttons */
    .page-id-4584 .wp-block-buttons {
        flex-direction: column;
        align-items: flex-start;
    }

}