/* Latest from Satine - posts grid layout (page-id-3962) */
.page-id-3962 .wp-block-post-template {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 1.5rem !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.page-id-3962 .wp-block-post-template > li {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}
.page-id-3962 .wp-block-post-featured-image,
.page-id-3962 .wp-block-post-featured-image img,
.page-id-3962 .wp-block-post-featured-image a {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Posts grid - horizontal breathing room so content doesn't touch the edges */
.page-id-3962 .wp-block-query {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

@media (max-width: 599px) {
    .page-id-3962 .wp-block-post-template {
        grid-template-columns: 1fr !important;
    }
    .page-id-3962 .wp-block-query {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}


/* Latest from Satine - white titles and pagination */
.page-id-3962 .wp-block-post-title a,
.page-id-3962 .wp-block-post-title {
    color: #ffffff !important;
}
.page-id-3962 .wp-block-post-title a:hover {
    color: #c41e3a !important;
}
.page-id-3962 .wp-block-query-pagination-next,
.page-id-3962 .wp-block-query-pagination-previous {
    color: #ffffff !important;
}
.page-id-3962 .wp-block-query-pagination-next:hover,
.page-id-3962 .wp-block-query-pagination-previous:hover {
    color: #c41e3a !important;
}

/* Mobile Navigation - Clients submenu inline dropdown */
/* The submenu is position:absolute by default, which clips inside the mobile overlay.
   Override to position:static so it flows inline, then show/hide via aria-expanded. */
@media (max-width: 782px) {
    /* Reset absolute submenu to static flow inside the open mobile overlay */
    .wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation__submenu-container {
        position: static !important;
        display: block !important;
        height: 0 !important;
        overflow: hidden !important;
        opacity: 0 !important;
        visibility: hidden !important;
        min-width: 0 !important;
        width: auto !important;
        padding-left: 20px !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        top: auto !important;
        left: auto !important;
        z-index: auto !important;
    }

    /* Show when the toggle button is expanded (aria-expanded=true) */
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
        height: auto !important;
        overflow: visible !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* ------------------------------------------------------------------
   Ransomware assessment banner (Custom HTML block in header-home)
   The block's own styles use width:100vw, which overshoots by the width
   of the scrollbar, and the block sits INSIDE the white header group so
   it also inherits that group's padding (left/right/bottom). Both are
   cancelled here using the same CSS vars the group's inline styles use,
   so the bar spans edge to edge with no white slivers or strip beneath.
   !important is required: the block's <style> lives in the body and so
   wins ties on document order.
   ------------------------------------------------------------------ */
.rrb-bar {
    width: auto !important;
    max-width: none !important;
    margin-left: calc(-1 * var(--wp--style--root--padding-left, var(--wp--custom--gap--horizontal, 0px))) !important;
    margin-right: calc(-1 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal, 0px))) !important;
    margin-bottom: calc(-1 * var(--wp--preset--spacing--20, 0px)) !important;
    padding: 9px 20px !important;
}

/* Underline only on hover - the permanent underline read as a broken link. */
.rrb-cta {
    text-decoration: none !important;
}
.rrb-bar:hover .rrb-cta {
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

@media (max-width: 768px) {
    .rrb-bar {
        padding: 9px 14px !important;
    }
}
