/* --- Block: Embed Social (blocks/embed-social.php) --- */

.pbblock.embed_social {
    padding: var(--margin);
}
.pbblock.embed_social .inner {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 3rem; /* Adjust gap between items */
    min-height:60vh;
    width: 100%; /* Ensure inner takes full width */
    max-width: var(--innerMaxWidth); /* Respect theme max width */
    margin-left: auto; /* Center */
    margin-right: auto; /* Center */
    align-items: stretch; /* Explicitly set items to stretch vertically */
    align-content: stretch; /* Stretch lines vertically if wrapping occurs */
    margin: 0 auto;
}

.pbblock.embed_social .social-embed-item {
    width: calc(33.333% - 3rem); /* 3 columns, adjusted for gap */
    box-sizing: border-box;
    display: flex; /* Keep item as flex container */
    overflow: hidden; /* Hide overflow */
    background:#fff;
    border-radius: 10px;
    position: relative; /* Needed for absolute positioning of overlay */
}

/* Target the Instagram blockquote specifically */
.pbblock.embed_social .social-embed-item .instagram-media { /* Assumes embed uses blockquote */
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important; /* Optional: remove embed shadow */
    display: flex !important; /* Use flex */
    flex-direction: column; /* Stack inner content */
    flex-grow: 1; /* Ensure it grows */
}

/* Target the iframe specifically */
.pbblock.embed_social .social-embed-item iframe {
     width: 100% !important; /* Force width */
     max-width: 100%;
     height: 100% !important; /* Force height */
     flex-grow: 1; /* Ensure iframe grows */
     border: none;
     margin: 0; /* Remove margin */
     display: block;
     max-height: 100% !important;
}

/* Overlay for grayscale effect */
.pbblock.embed_social .grayscale-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: gray; /* Use gray for color blend mode */
    mix-blend-mode: color; /* Blends gray overlay to desaturate */
    pointer-events: none; /* Allow interaction with iframe below */
    z-index: 1; /* Ensure overlay is on top */
     border-radius: 10px; /* Match parent border-radius */
     display: none;

}

/* Responsive adjustments (optional example) */
@media (max-width: 768px) {
     /* Example: Stack to 2 columns on medium screens */
     .pbblock.embed_social .social-embed-item {
         width: calc(50% - 0.5rem);
    }
}

@media (max-width: 480px) {
    /* Example: Stack to 1 column on small screens */
    .pbblock.embed_social .social-embed-item {
         width: 100%;
    }
}

/* --- Block: Big Intro (blocks/bigintro.php) --- */

.pbblock.bigintro.section {
    margin: 0 auto;
}

.pbblock.bigintro .inner {
    max-width: var(--unitW_10);
    margin: var(--unitH_2) auto;
}


/* --- Block: Image Grid (blocks/imagegrid.php) --- */

.pbblock.imagegrid .fullscreen-grid-wrapper {
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    padding: 0.25rem;
    box-sizing: border-box;
    position: relative; /* Needed for overlay positioning */
}

.pbblock.imagegrid .grid-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.8); /* Set by GSAP */
    /* backdrop-filter: blur(10px); /* Set by GSAP */
    /* Use CSS variable for blur */
    backdrop-filter: blur(var(--blur-amount, 10px));
    pointer-events: none;
    z-index: 2; /* Place overlay above grid */
}

.pbblock.imagegrid .image-grid-container {
    display: flex;
    gap: 0.25rem;
    width: 100%;
    flex-direction:row;
    position: relative; /* Ensure grid stays under overlay if z-index used */
    z-index: 1;
     /* Initial state set by GSAP */
    /* transform: scale(3) rotate(-45deg); */
}

.pbblock.imagegrid .image-grid-column {
    flex: 0 0 calc(12.5% - 0.21875rem); /* Adjusted for 0.25rem gap */
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Vertically center the stack of images */
    align-items: center; /* Horizontally center images in the column */
    gap: 0.25rem; /* Reduced gap between images within a column */
}

.pbblock.imagegrid .image-grid-column img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 5px;
    object-fit: contain; /* Ensure entire image is visible */
}

/* REMOVE Responsive Stacking Rules */
/* @media (max-width: 768px) { ... } */
/* @media (max-width: 480px) { ... } */

/* --- Mobile adjustments for Image Grid --- */
@media (max-width: 768px) {
    .pbblock.imagegrid .image-grid-column {
        flex-basis: calc(25% - 0.1875rem); /* 4 columns on tablets */
    }
}

@media (max-width: 480px) {
    .pbblock.imagegrid .image-grid-column {
        flex-basis: calc(50% - 0.125rem); /* 2 columns on phones */
    }
}

/* --- New Styles for Logo Slideshow --- */
.pbblock.imagegrid .logo-slideshow-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3; /* Above overlay */
    pointer-events: none; /* Allow interaction with elements below if needed */
}
.pbblock.imagegrid .logo-slideshow-item {
    position: absolute; /* Stack logos */
    height: 60px;
    width: auto;
    max-width: 90%; /* Prevent very wide logos from overflowing */
    object-fit: contain;
    opacity: 0;
    transition: opacity 1s ease-in-out; /* Fade transition */
}
 .pbblock.imagegrid .logo-slideshow-item.active {
     opacity: 1;
 }
/* --- End Logo Slideshow Styles --- */

/* --- Block: Publication Grid (blocks/publication-grid.php) --- */

.pbblock.publication-grid.section {
    min-height:0;
    margin: 0 auto;
}

.pbblock.publication-grid .publication-grid-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem 1rem; /* Row gap, Column gap */
    width: 100%;
    margin:  0; /* Example vertical margin */
    justify-content: center; /* Center items, noticeable on incomplete last row */
    flex-direction: row;
}
.pbblock.publication-grid .publication-grid-item {
    flex: 0 1 calc(33.333% - 0.67rem); /* 3 columns, adjusted for 1rem column gap */
    box-sizing: border-box;
    display: flex;
    justify-content: center; /* Center image horizontally if item wider */
    align-items: center; /* Center image vertically if item taller */
    margin-bottom:var(--unitH_1);
}
.pbblock.publication-grid .publication-grid-item img {
    height: 30px;
    width: auto;
    max-width: 100%; /* Prevent image from overflowing its container */
    display: block;
    object-fit: contain; /* Preserve aspect ratio */
}

/* Responsive adjustments (optional example) */
@media (max-width: 768px) {
    .pbblock.publication-grid .publication-grid-item {
        flex-basis: calc(50% - 0.5rem); /* 2 columns */
    }
}

@media (max-width: 480px) {
    .pbblock.publication-grid .publication-grid-item {
        flex-basis: 100%; /* 1 column */
    }
}

/* --- Block: Stats (blocks/stats.php) --- */

.pbblock.stats.section { /* Assuming stats block always has section class */

}

.pbblock.stats .inner { /* Keep existing class selector */
    margin: var(--unitH_1) auto;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem; /* Adjust gap between items */
    justify-content: center; /* Center items if they don't fill the row */
    min-height:0;
    width: 100%;
    flex-direction: row;
}
.pbblock.stats .stat-item { /* Keep existing class selector */
    text-align: center;
    padding: 1rem;
    box-sizing: border-box;
    display: flex; /* Use flexbox for internal alignment */
    flex-direction: column; /* Stack label and value */
    align-items: center; /* Center horizontally */
    justify-content: center; /* Center vertically if needed */
    margin-bottom: var(--unitH_1);
}

/* Column widths based on layout class added to the block's main div */
.stats-grid-col-1 .stat-item {
    width: 100%;
}

.stats-grid-col-2 .stat-item {
    width: calc(50% - 0.5rem); /* Adjust based on gap */
}
.stats-grid-col-2 .inner { /* Target inner within this layout */
    width: var(--unitW_8);
}
.stats-grid-col-3 .stat-item {
    width: calc(33.333% - 0.67rem); /* Adjust based on gap */
}
/* Default: 4 columns */
.stats-grid-col-4 .stat-item {
    width: calc(25% - 0.75rem); /* Adjust based on gap */
}

.pbblock.stats .stat-label { /* Keep existing class selector */
        margin-top: 0.25rem; /* Space between value and label */
        margin-bottom: 0; /* Remove bottom margin */
        order: 2; /* Make label appear second */
}

.pbblock.stats .stat-value { /* Keep existing class selector */
    display: block; /* Ensure it takes its own line */
    font-size: 9rem;
    line-height: 1.2;
    order: 1; /* Make value appear first */
}

/* Responsive adjustments (optional example) */
@media (max-width: 768px) {
     /* Example: Stack to 2 columns on medium screens */
    /* Apply to items within any layout > 2 columns */
    .pbblock.stats.stats-grid-col-3 .stat-item,
    .pbblock.stats.stats-grid-col-4 .stat-item {
        width: calc(50% - 0.5rem);
    }

    /* Reduce font size for stats value */
    .pbblock.stats .stat-value {
        font-size: 6rem; /* Reduced size for tablets */
    }
}

@media (max-width: 480px) {
    /* Example: Stack to 1 column on small screens */
    /* Apply to items within any layout */
    .pbblock.stats .stat-item {
         width: 100%;
    }

    /* Further reduce font size for stats value */
    .pbblock.stats .stat-value {
        font-size: 4rem; /* Reduced size for phones */
    }
}


/* --- Block: Image Strip (blocks/imagestrip.php) --- */

.pbblock.imagestrip { /* Style the main container */
    position: relative; /* Needed for absolute positioning of text */
    height: 70vh; /* Set container height */
    overflow: hidden; /* Hide potential overflow if needed */
}
.pbblock.imagestrip .swiper-wrapper {
    transition-timing-function: linear !important; /* Ensure even speed */
}
.pbblock.imagestrip .swiper-slide {
    width: auto; /* Let image width dictate slide width */
    height: 100%; /* Make slides fill container height */
    flex-shrink: 0; /* Prevent shrinking */
    margin-right: 0 !important; /* No space between slides */
}
.pbblock.imagestrip .swiper-slide img {
    display: block;
    width: auto;  /* Allow width to adjust based on height */
    height: 100%; /* Make image fill the slide's fixed height */
}

/* Overlay Text Styles */
.pbblock.imagestrip .imagestrip-overlay-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity:.9;
    height: 100%;
    display: flex;
    align-items: center; /* Vertical Center */
    justify-content: center; /* Horizontal Center */
    font-family: "Indelible", "Nohemi", Helvetica, Arial, sans-serif; /* Added font family */
    font-size: 30vh; /* Large font size */
    line-height: 1; /* Adjust line height to prevent overflow */
    font-weight: bold; /* Example font weight */
    color: black; /* Color for difference blend mode */
    /* mix-blend-mode: difference;  */
    letter-spacing: 10rem;
    text-align: center;
    pointer-events: none; /* Allow interaction with slider below */
    z-index: 10; /* Ensure text is on top (but below top-text) */
    padding: 0 1rem; /* Prevent text touching edges */
    box-sizing: border-box;
    white-space: nowrap; /* Prevent text wrapping */
}

/* Top Text Styles (New) */
.pbblock.imagestrip .imagestrip-top-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column; /* Stack value and label */
    align-items: center; /* Horizontal Center */
    justify-content: center; /* Vertical Center */
    /* font-family: inherit; /* Use body default */
    /* font-size: 9rem; /* MOVED to .top-text-value */
    /* line-height: 1.1; /* MOVED to .top-text-value */
    /* font-weight: normal; /* MOVED to .top-text-value */
    color: white; /* Default color for children */
    /* mix-blend-mode: difference; /* Removed for this layer */
    /* text-align: center; /* Handled by flex align-items */
    pointer-events: none; /* Allow interaction with slider below */
    z-index: 11; /* Ensure this text is on top of the UVM text */
    padding: 0 1rem;
    box-sizing: border-box;
    white-space: normal; /* Allow wrapping if needed */
}

.pbblock.imagestrip .top-text-value {
    font-size: 14rem;
    line-height: 1.1;
    font-weight: normal;
    display: block;
    min-width: 1ch;
    /* opacity: 0; /* REMOVED - No longer fading in */
    /* transition: opacity 0.5s ease; /* REMOVED */
}

.pbblock.imagestrip .top-text-label { /* Style for the label */

    margin-top: 0.25rem; /* Space between value and label */
    margin-bottom: 0; /* Remove bottom margin */

    order: 2; /* Make label appear second */

}

/* --- Mobile adjustments for Image Strip --- */
@media (max-width: 768px) {
    .pbblock.imagestrip {
        height: 50vh; /* Reduce height slightly */
    }

    .pbblock.imagestrip .imagestrip-overlay-text {
        font-size: 15vh; /* Reduce font size */
        letter-spacing: 2rem; /* Reduce letter spacing */
    }

    .pbblock.imagestrip .top-text-value {
        font-size: 8rem; /* Reduce font size */
    }

     .pbblock.imagestrip .top-text-label {
        font-size: 1rem; /* Ensure label is readable */
    }
}

/* --- Block: Coverage Links (blocks/coverage-links.php) --- */

.pbblock.coverage-links .coverage-list-container {
    width: 100%;
    margin: 0 auto; /* Example vertical margin */
    padding: 0 var(--margin); /* Match column margins */
    box-sizing: border-box;
}
/* Style for the H2 title added before the list */
.pbblock.coverage-links .coverage-list-container > h2.label {
    text-align: left;
    margin: 0 0 var(--unitH_half) 0; /* Top/LR margin 0, Bottom margin var(--unitH_1) */
    /* Inherit other .label styles or add specifics */
    align-self: flex-start;
}
.pbblock.coverage-links .coverage-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-top: 1px solid white;
    padding: 30px 0 var(--unitH_half) 0;
    gap: 1rem;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.3s ease;
}
.pbblock.coverage-links .coverage-item:hover {
    box-shadow: inset 0 1px 0 0 white;
}
.pbblock.coverage-links .coverage-link-col {
    width: var(--unitW_6);
    text-align: left;
    flex-shrink: 0;
    font-size: 2rem;
    line-height: 1.3;
}
.pbblock.coverage-links .coverage-logo-col {
    width: var(--unitW_1);
    text-align: right;
    flex-shrink: 0;
}
.pbblock.coverage-links .coverage-logo-col img {
    width: 100%;
    height: auto;
    display: inline-block;
    max-width: 100%;
    object-fit: contain;
}

/* Responsive: Stack columns */
@media (max-width: 768px) {
    .pbblock.coverage-links .coverage-item {
        flex-direction: column;
        align-items: flex-start;
    }
    .pbblock.coverage-links .coverage-link-col {
        width: 100%;
        margin-bottom: 1rem;
    }
    .pbblock.coverage-links .coverage-logo-col {
        width: var(--unitW_1);
        text-align: left;
        max-width: 150px;
    }
    .pbblock.coverage-links .coverage-logo-col img {
         width: auto;
         height: 40px;
         display: block;
    }
}

/* --- Block: Big Bullets (blocks/bigbullets.php) --- */

.pbblock.bigbullets .bigbullets-container {
    display: flex;
    justify-content: space-between; /* Pushes columns to edges */
    width: 100%;
    margin: var(--unitH_1) 0; /* Example vertical margin */
}
.pbblock.bigbullets .bigbullets-left-col {
    width: var(--unitW_1);
    margin-left: var(--unitW_1);
    text-align: left;
    /* align-self: flex-start; /* Optional: align top if columns have different heights */
}
.pbblock.bigbullets .bigbullets-right-col {
    width: var(--unitW_7);
    margin-right: var(--unitW_1);
    text-align: left;
}
.pbblock.bigbullets .bullet-item p {
    font-size: 2rem;
    line-height: 1.3; /* Adjust for readability */
    margin-bottom: var(--unitH_1);
    margin-top:0;
}
.pbblock.bigbullets .bigbullets-left-col h2.label {
    /* Inherit general .label styles, add specifics if needed */
    margin: 0; /* Reset heading margin */
    /* Add other specific styles for the title heading if needed */
}

/* --- Block: Coverage Links (blocks/coverage-links.php) - RE-ADD --- */

.coverage-links .coverage-list-container {
    width: 100%;

    margin: 0 auto; /* Example vertical margin */
    padding: 0 var(--margin); /* Match column margins */
    box-sizing: border-box;
}
/* Style for the H2 title added before the list */
.coverage-links .coverage-list-container > h2.label {
    text-align: left;
    margin: 0 0 var(--unitH_half) 0; /* Top/LR margin 0, Bottom margin var(--unitH_1) */
    /* Inherit other .label styles or add specifics */
    align-self: flex-start;
}
.coverage-links .coverage-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-top: 1px solid white;
    padding: 30px 0 var(--unitH_half) 0;
    gap: 1rem;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.3s ease;
}
.coverage-links .coverage-item:hover {
    box-shadow: inset 0 1px 0 0 white;
}
.coverage-links .coverage-link-col {
    width: var(--unitW_6);
    text-align: left;
    flex-shrink: 0;
    font-size: 2rem;
    line-height: 1.3;
}
.coverage-links .coverage-logo-col {
    width: var(--unitW_1);
    text-align: right;
    flex-shrink: 0;
}
.coverage-links .coverage-logo-col img {
    width: 100%;
    height: auto;
    display: inline-block;
    max-width: 100%;
    object-fit: contain;
}

/* Responsive: Stack columns */
@media (max-width: 768px) {
    .coverage-links .coverage-item {
        flex-direction: column;
        align-items: flex-start;
    }
    .coverage-links .coverage-link-col {
        width: 100%;
        margin-bottom: 1rem;
    }
    .coverage-links .coverage-logo-col {
        width: var(--unitW_1);
        text-align: left;
        max-width: 150px;
    }
    .coverage-links .coverage-logo-col img {
         width: auto;
         height: 40px;
         display: block;
    }
}

/* --- Block: Image Strip (blocks/imagestrip.php) - RE-ADD --- */

.imagestrip { /* Style the main container */
    position: relative; /* Needed for absolute positioning of text */
    height: 70vh; /* Set container height */
    overflow: hidden; /* Hide potential overflow if needed */
}
.imagestrip .swiper-wrapper {
    transition-timing-function: linear !important; /* Ensure even speed */
}
.imagestrip .swiper-slide {
    width: auto; /* Let image width dictate slide width */
    height: 100%; /* Make slides fill container height */
    flex-shrink: 0; /* Prevent shrinking */
    margin-right: 0 !important; /* No space between slides */
}
.imagestrip .swiper-slide img {
    display: block;
    width: auto;  /* Allow width to adjust based on height */
    height: 100%; /* Make image fill the slide's fixed height */
}

/* Overlay Text Styles */
.imagestrip .imagestrip-overlay-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity:.9;
    height: 100%;
    display: flex;
    align-items: center; /* Vertical Center */
    justify-content: center; /* Horizontal Center */
    font-family: "Indelible", "Nohemi", Helvetica, Arial, sans-serif; /* Added font family */
    font-size: 30vh; /* Large font size */
    line-height: 1; /* Adjust line height to prevent overflow */
    font-weight: bold; /* Example font weight */
    color: black; /* Color for difference blend mode */
    /* mix-blend-mode: difference;  */
    letter-spacing: 10rem;
    text-align: center;
    pointer-events: none; /* Allow interaction with slider below */
    z-index: 10; /* Ensure text is on top (but below top-text) */
    padding: 0 1rem; /* Prevent text touching edges */
    box-sizing: border-box;
    white-space: nowrap; /* Prevent text wrapping */
}

/* Top Text Styles (New) */
.imagestrip .imagestrip-top-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column; /* Stack value and label */
    align-items: center; /* Horizontal Center */
    justify-content: center; /* Vertical Center */
    /* font-family: inherit; /* Use body default */
    /* font-size: 9rem; /* MOVED to .top-text-value */
    /* line-height: 1.1; /* MOVED to .top-text-value */
    /* font-weight: normal; /* MOVED to .top-text-value */
    color: white; /* Default color for children */
    /* mix-blend-mode: difference; /* Removed for this layer */
    /* text-align: center; /* Handled by flex align-items */
    pointer-events: none; /* Allow interaction with slider below */
    z-index: 11; /* Ensure this text is on top of the UVM text */
    padding: 0 1rem;
    box-sizing: border-box;
    white-space: normal; /* Allow wrapping if needed */
}

.imagestrip .top-text-value {
    font-size: 14rem;
    line-height: 1.1;
    font-weight: normal;
    display: block;
    min-width: 1ch;
    /* opacity: 0; /* REMOVED - No longer fading in */
    /* transition: opacity 0.5s ease; /* REMOVED */
}

.imagestrip .top-text-label { /* Style for the label */

    margin-top: 0.25rem; /* Space between value and label */
    margin-bottom: 0; /* Remove bottom margin */

    order: 2; /* Make label appear second */

}

/* --- Block: Big Bullets (blocks/bigbullets.php) - RE-ADD --- */

.casestudy .bigbullets-container {
    display: flex;
    justify-content: space-between; /* Pushes columns to edges */
    width: 100%;
    margin: var(--unitH_1) 0; /* Example vertical margin */
}
.casestudy .bigbullets-left-col {
    width: var(--unitW_1);
    margin-left: var(--unitW_1);
    text-align: left;
    /* align-self: flex-start; /* Optional: align top if columns have different heights */
}
.casestudy .bigbullets-right-col {
    width: var(--unitW_7);
    margin-right: var(--unitW_1);
    text-align: left;
}
.casestudy .bullet-item p {
    font-size: 2rem;
    line-height: 1.3; /* Adjust for readability */
    margin-bottom: var(--unitH_1);
    margin-top:0;
}
.casestudy .bigbullets-left-col h2.label {
    /* Inherit general .label styles, add specifics if needed */
    margin: 0; /* Reset heading margin */
    /* Add other specific styles for the title heading if needed */
}
