/***********************************************
 GLOBAL STYLES
***********************************************/

/* Hide reCAPTCHA badge (still functional) */
.grecaptcha-badge {
    visibility: hidden !important;
}

/* Center top navigation menu */
#top-menu {
    text-align: center;
}

/* Logo sizing */
.custom-logo-link img {
    max-height: 160px; /* Default logo height */
    width: auto;
}

img.custom-logo {
    max-height: 300px !important;
}

/* Larger screens: allow larger max-width for logo */
@media screen and (min-width: 48em) {
    .custom-logo-link img {
        max-width: 700px;
    }
}


/***********************************************
 SITE TITLE + TAGLINE – HEADER ONLY
***********************************************/

/* Mobile sizing */
@media screen and (max-width: 600px) {

    .site-title,
    .site-branding .site-title {
        font-size: clamp(22px, 6vw, 26px) !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        margin-bottom: 0.25em;
    }

    .site-description,
    .site-branding .site-description {
        font-size: clamp(12px, 3.6vw, 14px) !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
        letter-spacing: 0.12em;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Desktop sizing */
@media screen and (min-width: 1024px) {

    .site-title,
    .site-branding .site-title {
        font-size: 52px !important;
        line-height: 1.1 !important;
        letter-spacing: 0.08em;
        margin-bottom: 0.35em;
    }

    .site-description,
    .site-branding .site-description {
        font-size: 18px !important;
        line-height: 1.4 !important;
        letter-spacing: 0.14em;
        margin-left: auto;
        margin-right: auto;
    }
}


/***********************************************
 HEADER HEIGHT – DESKTOP (MATCH HOME PAGE)
***********************************************/
@media screen and (min-width: 1024px) {

    .custom-header,
    .custom-header-media,
    #wp-custom-header {
        height: 870px !important;
        max-height: 870px !important;
        min-height: 870px !important;
        overflow: hidden;
    }

    .custom-header-media img,
    .custom-header-media video,
    #wp-custom-header video,
    #wp-custom-header img {
        width: 100%;
        height: 100% !important;
        object-fit: cover !important;
    }
}


/***********************************************
 HEADER HEIGHT – MOBILE (MATCH HOME PAGE)
***********************************************/
@media screen and (max-width: 1023px) {

    .custom-header,
    .custom-header-media,
    #wp-custom-header {
        height: 560px !important;
        max-height: 560px !important;
        min-height: 560px !important;
        overflow: hidden;
    }

    .custom-header-media img,
    .custom-header-media video,
    #wp-custom-header video,
    #wp-custom-header img {
        width: 100%;
        height: 100% !important;
        object-fit: cover !important;
    }
}


/***********************************************
 MOBILE FIX:
 Align Logo + Title + Tagline the SAME on all pages
***********************************************/
@media screen and (max-width: 600px) {

    /* Treat header like a vertical table */
    .has-header-image .custom-header,
    .has-header-video .custom-header {
        display: table;
        width: 100%;
    }

    /* Keep branding at the bottom across ALL pages */
    .has-header-image .site-branding,
    .has-header-video .site-branding {
        display: table-cell;
        vertical-align: bottom;
        height: 100%;
        padding-bottom: 1.5rem; /* Adjust if needed */
    }
}


/***********************************************
 DISABLE HORIZONTAL SCROLLING ON MOBILE
***********************************************/
html, body {
    overflow-x: hidden !important;
    width: 100% !important;
}

@media screen and (max-width: 1023px) {
    .site,
    .custom-header,
    .custom-header-media,
    #wp-custom-header {
        overflow-x: hidden !important;
    }
}


/***********************************************
 MODERN “GLASS” PANEL – BLUR HEADER MEDIA UNDER CONTENT
***********************************************/
.site-content-contain {
    background-color: rgba(50, 50, 50, 0.9);  /* very subtle transparency */
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-radius: 0;
}

/***********************************************
 FORCE LAYERS BEHIND CONTENT PANEL TO BE TRANSPARENT
 (so the blur always hits the header media)
***********************************************/
.site,
.site-content,
.content-area,
.site-main {
    background: transparent !important;
    background-color: transparent !important;
}


/***********************************************
 FACEBOOK FEED – CLEAN, TIGHT LAYOUT
***********************************************/

/* Text color stays white */
.efbl-halfwidth-skin.added_photos.efbl-story-wrapper,
.efbl-halfwidth-skin.added_photos.efbl-story-wrapper h2,
.efbl-halfwidth-skin.added_photos.efbl-story-wrapper p,
.efbl-halfwidth-skin.added_video.efbl-story-wrapper,
.efbl-halfwidth-skin.added_video.efbl-story-wrapper h2,
.efbl-halfwidth-skin.added_video.efbl-story-wrapper p {
    color: #ffffff !important;
}

/* Main wrapper: flat, with a subtle top divider and tight spacing */
.efbl-halfwidth-skin.added_photos.efbl-story-wrapper,
.efbl-halfwidth-skin.added_video.efbl-story-wrapper {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 10px 0 8px !important;  /* <-- tighten vertical spacing */
    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* No top border on the first story */
.efbl-halfwidth-skin.added_photos .efbl-story-wrapper:first-child,
.efbl-halfwidth-skin.added_video .efbl-story-wrapper:first-child {
    border-top: none !important;
}

/* Tighten inner padding so things feel connected */
.efbl-story-wrapper .efbl-story-inner {
    padding: 0 !important;
    margin: 0 !important;
}

/* Reduce default margins on headings/paragraphs inside the feed */
.efbl-story-wrapper h2,
.efbl-story-wrapper p {
    margin-top: 0.2em !important;
    margin-bottom: 0.35em !important;
}

/* REMOVE ALL INNER BORDERS / LINES (image frame, vertical rule, etc.) */
.efbl-halfwidth-skin.added_photos.efbl-story-wrapper *,
.efbl-halfwidth-skin.added_video.efbl-story-wrapper * {
    border: none !important;
    box-shadow: none !important;
}

/* Make sure images don’t have outlines / box-shadows either */
.efbl-halfwidth-skin.added_photos.efbl-story-wrapper img,
.efbl-halfwidth-skin.added_video.efbl-story-wrapper img {
    box-shadow: none !important;
    outline: none !important;
}

/***********************************************
 FACEBOOK FEED – KILL IMAGE UNDERLINE COMPLETELY
***********************************************/

/* Remove any link-style underline/hover effect inside each story */
.efbl-story-wrapper a,
.efbl-story-wrapper a:hover,
.efbl-story-wrapper a:focus {
    text-decoration: none !important;
    border: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Make sure the image itself has no border/shadow line */
.efbl-story-wrapper img,
.efbl-story-wrapper img:hover,
.efbl-story-wrapper img:focus {
    border: none !important;
    box-shadow: none !important;
}

/* Sometimes they use a wrapper div for the hover line */
.efbl-story-wrapper .efbl-image,
.efbl-story-wrapper .efbl-image:hover,
.efbl-story-wrapper .efbl-image a,
.efbl-story-wrapper .efbl-image a:hover {
    border: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/***********************************************
 FACEBOOK FEED – REMOVE SHARE + LIKE/COMMENT ROW
***********************************************/

/* Share block itself */
.efbl-view-share,
.efbl-view-share *,
.efbl-halfwidth-skin.added_photos .efbl-view-share,
.efbl-halfwidth-skin.added_video .efbl-view-share {
    display: none !important;
}

/* Hide the entire flex/footer row that CONTAINS the share block
   (this is where Like + Comment live too) */
.efbl-story-wrapper .efbl-d-flex:has(.efbl-view-share),
.efbl-story-wrapper .efbl-story-footer:has(.efbl-view-share) {
    display: none !important;
}


/***********************************************
 FACEBOOK FEED – MOBILE LEFT EDGE FIX
 (Prevent avatar/logo from being clipped)
***********************************************/
@media screen and (max-width: 600px) {

    /* Kill negative margins on feed rows / wrappers and add slight padding */
    .efbl-row,
    .efbl-stories-wrap,
    .efbl-wrap,
    .efbl-halfwidth-skin {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 5px !important;   /* you liked 5px */
        padding-right: 5px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Make sure each story respects the width */
    .efbl-story-wrapper {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    /* Extra safety for the avatar/logo circle */
    .efbl-author-avatar,
    .efbl-author-avatar img {
        margin-left: 0 !important;
        padding-left: 0 !important;
        transform: translateX(0) !important;
    }
}

/***********************************************
 PAGE-SPECIFIC BLUR FIX – CONCERTS (page-id-1301)
***********************************************/

/* 1) Nuke every possible solid background layer on this page */
.page-id-1301,
.page-id-1301 body,
.page-id-1301 .site,
.page-id-1301 .site-content,
.page-id-1301 .content-area,
.page-id-1301 .site-main,
.page-id-1301 .wrap,
.page-id-1301 .hentry,
.page-id-1301 .entry-content,
.page-id-1301 .entry-header,
.page-id-1301 .panel-content {
    background: transparent !important;
    background-color: transparent !important;
}

/* 2) Make absolutely sure no pseudo-element is painting a flat layer */
.page-id-1301 .site-content-contain::before,
.page-id-1301 .panel-content::before,
.page-id-1301 .content-area::before {
    content: none !important;
    background: none !important;
}

/* 3) Force the Concerts glass panel to be the only thing adding tone + blur */
.page-id-1301 .site-content-contain {
    background-color: rgba(50, 50, 50, 0.9) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-radius: 0 !important;
}