/*
Theme Name: Binary Forensic
Theme URI: https://binaryforensic.com
Author: Antigravity
Description: A custom FSE block theme for Binary Forensic, featuring a dark industrial design system.
Version: 1.0.5
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.4
*/

/* ============================================
   BASE RESETS
   ============================================ */

   * {
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
}

body {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    width: 100%;
}

/* Prevent horizontal scroll on all major containers */
.wp-site-blocks,
.wp-block-group,
main {
    max-width: 100vw;
}

/* Fix alignfull sections */
.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* ============================================
   TYPOGRAPHY & SPACING OVERRIDES
   ============================================ */

.wp-site-blocks > * + *,
.wp-block-group > * + *,
.wp-block-post-content > * + *,
.wp-block-column > * + *,
.is-layout-flow > * + *,
.is-layout-constrained > * + * {
    margin-block-start: 0 !important;
}

.wp-site-blocks p:last-child,
.wp-block-post-content p:last-child,
.wp-block-group p:last-child {
    margin-bottom: 0;
    margin-block-end: 0;
}

.wp-site-blocks h1,
.wp-block-post-content h1,
.wp-block-group h1 {
    margin-top: 0;
    margin-bottom: 1.25rem;
    margin-block-start: 0;
    margin-block-end: 1.25rem;
}

.wp-site-blocks h2,
.wp-block-post-content h2,
.wp-block-group h2 {
    margin-top: 0;
    margin-bottom: 1rem;
    margin-block-start: 0;
    margin-block-end: 1rem;
}

.wp-site-blocks h3,
.wp-block-post-content h3,
.wp-block-group h3 {
    margin-top: 0;
    margin-bottom: 0.75rem;
    margin-block-start: 0;
    margin-block-end: 0.75rem;
}

.wp-site-blocks h4,
.wp-block-post-content h4,
.wp-block-group h4 {
    margin-top: 0;
    margin-bottom: 0.75rem;
    margin-block-start: 0;
    margin-block-end: 0.75rem;
}

.wp-site-blocks h5,
.wp-block-post-content h5,
.wp-block-group h5 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    margin-block-start: 0;
    margin-block-end: 0.5rem;
}

.wp-site-blocks h6,
.wp-block-post-content h6,
.wp-block-group h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    margin-block-start: 0;
    margin-block-end: 0.5rem;
}

.wp-site-blocks ul,
.wp-site-blocks ol,
.wp-block-post-content ul,
.wp-block-post-content ol {
    margin-top: 0;
    margin-bottom: 1.25rem;
    margin-block-start: 0;
    margin-block-end: 1.25rem;
    padding-left: 1.25rem;
}

/* ============================================
   HEADER
   ============================================ */

header {
    margin-bottom: 0;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    position: sticky;
    top: 0;
    z-index: 9999;
    background-color: #ffffff;
    overflow: visible;
}

/* ============================================
   NAVIGATION - DESKTOP
   ============================================ */

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
    color: var(--wp--preset--color--binary-orange) !important;
    background: transparent !important;
    border: none !important;
    padding: 0.5rem !important;
}

.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg {
    fill: var(--wp--preset--color--binary-orange) !important;
}

.wp-block-navigation > ul > li > a,
.wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
    color: #1a1a1a;
    text-decoration: none;
    padding: 0.75rem 1rem;
    display: block;
}

.wp-block-navigation > ul > li > a:hover,
.wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--binary-orange);
}

/* ============================================
   DROPDOWN NAVIGATION
   ============================================ */

.wp-block-navigation .wp-block-navigation__submenu-container {
    background-color: #ffffff !important;
    border-top: 3px solid var(--wp--preset--color--binary-orange);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    border-radius: 0 0 8px 8px;
    min-width: 220px;
    padding: 0.5rem 0;
    z-index: 9999;
    position: absolute;
    top: 100%;
    left: 0;
}

.wp-block-navigation .wp-block-navigation-item.has-child {
    position: relative;
    z-index: 9999;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    padding: 0.75rem 1.25rem !important;
    font-size: 0.9rem !important;
    color: #1a1a1a !important;
    border-bottom: 1px solid #f0f0f0;
    background-color: #ffffff !important;
    display: block;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child .wp-block-navigation-item__content {
    border-bottom: none;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--binary-orange) !important;
    background-color: #f9f9f9 !important;
}

/* ============================================
   BACKGROUND COLORS
   ============================================ */

.has-binary-charcoal-background-color {
    background-color: #1a1a1a !important;
}

/* ============================================
   BUTTONS
   ============================================ */

.wp-block-buttons {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 2rem;
}

.wp-block-buttons .wp-block-button {
    margin-bottom: 0;
}

.btn-rounded .wp-block-button__link {
    border-radius: 9999px;
    padding-left: 2rem;
    padding-right: 2rem;
}

.btn-service-learn-more {
    display: inline-block;
    padding: 0.75rem 1.75rem;
    margin-top: 1.5rem !important;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn-service-learn-more:hover {
    background-color: var(--wp--preset--color--binary-charcoal) !important;
    color: #ffffff !important;
}

/* Style wp:read-more inside the related-posts query to match button */
.related-posts-query .wp-block-read-more,
.related-posts-query a.wp-block-read-more {
    display: inline-block;
    padding: 0.75rem 1.75rem;
    margin-top: 1.5rem !important;
    background-color: var(--wp--preset--color--binary-orange);
    color: #ffffff !important;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.related-posts-query .wp-block-read-more:hover,
.related-posts-query a.wp-block-read-more:hover {
    background-color: var(--wp--preset--color--binary-charcoal);
    color: #ffffff !important;
}

/* ============================================
   LIFECYCLE LAYOUT
   ============================================ */

.lifecycle-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    position: relative;
    max-width: 1200px;
    margin: 4rem auto;
    padding-left: 2rem;
    padding-right: 2rem;
}

.lifecycle-step {
    text-align: center;
    position: relative;
    z-index: 2;
    padding: 0 1rem;
}

.lifecycle-step h3 {
    color: #faf9f6 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    font-weight: 700;
    letter-spacing: 1px;
    -webkit-font-smoothing: auto;
    word-break: keep-all;
    hyphens: none;
    font-size: 1rem;
    line-height: 1.3;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

.lifecycle-step:not(:last-child)::after {
    content: '→';
    position: absolute;
    top: 25%;
    right: -1.5rem;
    transform: translateY(-50%) translateX(50%);
    color: #999;
    font-size: 2rem;
    font-weight: 300;
}

/* ============================================
   CONTAINERS & COLUMNS
   ============================================ */

.wp-block-group.alignwide {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.wp-block-columns + .wp-block-columns {
    margin-top: 3rem;
}

/* ============================================
   HERO HEIGHT UTILITIES
   ============================================ */

.hero-min-600 { min-height: 600px; }
.hero-min-700 { min-height: 700px; }
.hero-min-750 { min-height: 750px; }
.hero-min-800 { min-height: 800px; }
.hero-min-900 { min-height: 900px; }

/* ============================================
   SERVICE CARDS & GRID
   ============================================ */

.services-grid-section {
    padding-top: var(--wp--preset--spacing--60);
    padding-bottom: var(--wp--preset--spacing--60);
}

.wp-block-query .wp-block-post-template {
    align-items: stretch !important;
}

.wp-block-query .wp-block-post-template > li {
    display: flex !important;
}

.service-card-modern {
    background-color: #ffffff;
    border-top: 5px solid var(--wp--preset--color--binary-orange);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-radius: 16px;
    padding: 2.5rem 2rem;
    margin: 1.5rem;
    display: flex !important;
    flex-direction: column;
    flex: 1;
}

.service-card-modern:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.2);
}

.service-card-modern .wp-block-post-excerpt {
    flex: 1;
    display: flex;
    align-items: center;
}

.service-card-modern .wp-block-post-excerpt p {
    margin: 0;
}

.service-card-title {
    font-size: 1.1rem;
    text-transform: uppercase;
    font-weight: 700;
    transition: color 0.3s ease;
}

.service-card-modern:hover .service-card-title {
    color: var(--wp--preset--color--binary-charcoal) !important;
}

/* ============================================
   INSIGHTS / RELATED POSTS
   ============================================ */

.wp-block-column.has-binary-light-charcoal-background-color {
    border-radius: 12px;
    overflow: hidden;
}

.wp-block-column.has-binary-light-charcoal-background-color figure.wp-block-image {
    margin: 10px 10px 0 10px;
    border-radius: 8px;
    overflow: hidden;
}

.wp-block-column.has-binary-light-charcoal-background-color figure.wp-block-image img {
    border-radius: 8px;
    display: block;
}


.wp-block-column.has-binary-light-charcoal-background-color a:hover,
.wp-block-group.has-binary-light-charcoal-background-color a:hover,
.wp-block-query-pagination a:hover {
    color: #ffffff;
    text-decoration: none;
}

.related-posts-query .wp-block-post-template {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.related-posts-query .wp-block-post {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.related-posts-query .wp-block-post:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
}

/* ============================================
   TABLET BREAKPOINT (783px - 900px)
   ============================================ */

@media (min-width: 783px) and (max-width: 900px) {
    .lifecycle-container {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 2rem 3rem;
    }

    .lifecycle-step {
        padding: 0 0.5rem;
    }

    .lifecycle-step:nth-child(2)::after,
    .lifecycle-step:nth-child(4)::after {
        content: '' !important;
    }
}

/* ============================================
   MOBILE BREAKPOINT (782px and below)
   ============================================ */

@media (max-width: 782px) {
    .alignfull {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    header {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .is-style-stack-on-mobile {
        flex-direction: column !important;
        display: flex !important;
    }

    .wp-block-columns.is-style-stack-on-mobile > .wp-block-column {
        width: 100% !important;
        margin-bottom: 2rem;
    }

    .wp-block-navigation:not(.has-modal-open) .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: none !important;
    }

    .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex !important;
    }

    .wp-block-navigation__responsive-close {
        display: block !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open {
        background-color: #1a1a1a !important;
        padding: 2rem !important;
    }

    .wp-block-navigation__responsive-container .wp-block-navigation__container {
        gap: 0 !important;
    }

    .wp-block-navigation__responsive-container .wp-block-navigation-item {
        width: 100%;
        border-bottom: 2px solid var(--wp--preset--color--binary-orange);
    }

    .wp-block-navigation__responsive-container .wp-block-navigation-item:last-child {
        border-bottom: none;
    }

    .wp-block-navigation__responsive-container .wp-block-navigation-item a,
    .wp-block-navigation__responsive-container .wp-block-navigation-item .wp-block-navigation-item__content {
        padding: 1rem 0;
        font-size: 1.1rem;
        color: #ffffff !important;
    }

    .wp-block-navigation__responsive-container .wp-block-navigation-item a:hover,
    .wp-block-navigation__responsive-container .wp-block-navigation-item .wp-block-navigation-item__content:hover {
        color: var(--wp--preset--color--binary-orange) !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
        background-color: #1a1a1a !important;
        box-shadow: none;
        border-top: none;
        border-left: 2px solid var(--wp--preset--color--binary-orange);
        border-radius: 0;
        padding-left: 1rem;
        position: relative;
        top: auto;
        left: auto;
        min-width: unset;
        width: 100%;
        display: block !important;
        text-align: left !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
        width: 100%;
        text-align: left !important;
        justify-content: flex-start !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        color: #ffffff !important;
        background-color: #1a1a1a !important;
        border-bottom-color: var(--wp--preset--color--binary-orange) !important;
        font-size: 1rem;
        padding: 0.75rem 0;
        justify-content: flex-start !important;
        width: 100%;
        text-align: left !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child .wp-block-navigation-item__content {
        border-bottom: none !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
        color: var(--wp--preset--color--binary-orange) !important;
        background-color: #1a1a1a !important;
    }

    .wp-block-buttons {
        flex-direction: column;
        gap: 1rem;
    }

    .wp-block-button {
        width: 100%;
    }

    .wp-block-button .wp-block-button__link {
        width: 100%;
        text-align: center;
    }

    .lifecycle-container {
        grid-template-columns: 1fr !important;
        gap: 3rem;
        padding: 0 1rem;
        margin: 2rem auto;
    }

    .lifecycle-step {
        padding: 0;
    }

    .lifecycle-step h3 {
        font-size: 1.25rem !important;
    }

    .lifecycle-step:not(:last-child)::after {
        content: '↓' !important;
        top: auto !important;
        bottom: -1.5rem !important;
        right: 50% !important;
        left: auto !important;
        transform: translateX(50%) !important;
    }

    .wp-block-columns:not(.is-not-stacked-on-mobile) {
        flex-direction: column;
        gap: 1rem;
    }

    .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 100%;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

    .wp-block-columns + .wp-block-columns {
        margin-top: 1.5rem;
    }

    .hero-min-600,
    .hero-min-700,
    .hero-min-750,
    .hero-min-800,
    .hero-min-900 {
        min-height: 400px;
    }

    .service-card-modern {
        margin: 0 0 1.5rem 0;
        padding: 2rem 1.5rem;
        width: 100%;
    }

    .wp-block-query .wp-block-post-template {
        display: flex !important;
        flex-direction: column;
        gap: 1.5rem;
        padding: 0 !important;
    }

    .wp-block-query .wp-block-post-template > li {
        width: 100% !important;
        flex-basis: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .wp-block-group.alignwide,
    .wp-block-group.alignfull > * {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .related-posts-query .wp-block-post-template {
        grid-template-columns: 1fr !important;
        gap: 1.5rem;
    }

    body.page-id-34 p,
    body.page-id-260 p  {
        padding: 0 1.25rem;
    }

}

.footer-nav .wp-block-navigation-item__content {
    color: #ffffff !important;
    text-decoration: none;
}

.footer-nav .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--binary-orange) !important;
}

.footer-nav .wp-block-navigation-item__content:hover,
.footer-nav .wp-block-navigation-item__content:focus,
.footer-nav .wp-block-navigation-item:hover .wp-block-navigation-item__content,
.footer-nav .wp-block-navigation-item.is-current-menu-item .wp-block-navigation-item__content {
    color: #ffffff !important;
    text-decoration: none !important;
    background: none !important;
    outline: none !important;
    box-shadow: none !important;
}