/* ============================================================
   BPP PROJECT DETAIL MOBILE V3.3
   Exact DOM rebuild from captured live Harbour East HTML.
   ============================================================ */

@media (max-width:1100px) {
    body.bpp-v33-project-detail {
        overflow-x:hidden!important;
        padding-bottom:calc(150px + env(safe-area-inset-bottom))!important;
    }

    /* Exact source duplicate suppression */
    body.bpp-v33-project-detail .bpppd2[data-bpp-project-detail-v2][data-bpp-v33-source-hidden="1"] {
        display:none!important;
    }

    /* Intro moved intact from .bpppd2-title-row */
    #bpp-project-mobile-v32 [data-bpp-v32-slot="intro"] > .bpppd2-title-row {
        display:block!important;
        width:100%!important;
        margin:0 0 9px!important;
        padding:0!important;
        border:0!important;
        background:transparent!important;
        box-shadow:none!important;
    }

    #bpp-project-mobile-v32 .bpppd2-title-copy h1 {
        margin:0 0 4px!important;
        color:#183027!important;
        font-family:"Josefin Sans","DM Sans",sans-serif!important;
        font-size:23px!important;
        line-height:1.12!important;
        font-weight:700!important;
        letter-spacing:-.02em!important;
    }

    #bpp-project-mobile-v32 .bpppd2-title-copy .bpppd2-location {
        margin:0 0 5px!important;
        color:#718179!important;
        font-size:11.5px!important;
        line-height:1.35!important;
    }

    #bpp-project-mobile-v32 .bpppd2-title-copy .bpppd2-summary {
        margin:0 0 9px!important;
        color:#5c6a63!important;
        font-size:11.5px!important;
        line-height:1.45!important;
    }

    #bpp-project-mobile-v32 .bpppd2-title-row > .bpppd2-actions {
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:6px!important;
        width:100%!important;
    }

    #bpp-project-mobile-v32 .bpppd2-title-row > .bpppd2-actions > * {
        min-width:0!important;
        min-height:37px!important;
        padding:6px 4px!important;
        border-radius:8px!important;
        font-size:9.5px!important;
        font-weight:800!important;
    }

    #bpp-project-mobile-v32 .bpppd2-title-row > .bpppd2-actions > *:first-child {
        grid-column:1/-1!important;
        background:#07964f!important;
        color:#fff!important;
    }

    /* Exact moved metrics */
    #bpp-project-mobile-v32 [data-bpp-v32-slot="metrics"] > .bpppd2-metrics {
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:6px!important;
        margin:0 0 9px!important;
        padding:0!important;
        border:0!important;
        background:transparent!important;
    }

    #bpp-project-mobile-v32 .bpppd2-metric {
        min-width:0!important;
        min-height:62px!important;
        padding:7px 3px!important;
        border:1px solid #deebe4!important;
        border-radius:10px!important;
        background:#f5faf7!important;
        text-align:center!important;
    }

    /* Exact developer card */
    #bpp-project-mobile-v32 .bpppd231-developer-card {
        display:block!important;
        width:100%!important;
        margin:0 0 9px!important;
        padding:0!important;
        overflow:hidden!important;
        border:1px solid #d6e9de!important;
        border-radius:14px!important;
        background:#fff!important;
        box-shadow:0 5px 18px rgba(5,75,50,.06)!important;
        visibility:visible!important;
        opacity:1!important;
        height:auto!important;
        max-height:none!important;
    }

    #bpp-project-mobile-v32 .bpppd231-cover {
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        gap:8px!important;
        min-height:62px!important;
        padding:11px 12px!important;
        background:linear-gradient(135deg,#04543d,#0aa55a)!important;
        color:#fff!important;
    }

    #bpp-project-mobile-v32 .bpppd231-cover small {
        display:block!important;
        margin:0 0 3px!important;
        color:rgba(255,255,255,.72)!important;
        font-size:8px!important;
        line-height:1.1!important;
        font-weight:800!important;
        letter-spacing:.08em!important;
    }

    #bpp-project-mobile-v32 .bpppd231-cover strong {
        display:block!important;
        color:#fff!important;
        font-size:15px!important;
        line-height:1.15!important;
        font-weight:850!important;
    }

    #bpp-project-mobile-v32 .bpppd231-badge {
        flex:0 0 auto!important;
        padding:5px 8px!important;
        border:1px solid rgba(255,255,255,.32)!important;
        border-radius:999px!important;
        background:rgba(255,255,255,.12)!important;
        color:#fff!important;
        font-size:8.5px!important;
        font-weight:800!important;
        white-space:nowrap!important;
    }

    #bpp-project-mobile-v32 .bpppd231-body {
        padding:11px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-profile {
        display:grid!important;
        grid-template-columns:42px minmax(0,1fr)!important;
        align-items:center!important;
        gap:9px!important;
        margin:0 0 9px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-avatar {
        width:42px!important;
        height:42px!important;
        border-radius:11px!important;
        display:grid!important;
        place-items:center!important;
        overflow:hidden!important;
        background:#e8f7ef!important;
        color:#07884a!important;
        font-size:18px!important;
        font-weight:850!important;
    }

    #bpp-project-mobile-v32 .bpppd231-avatar img {
        width:100%!important;
        height:100%!important;
        object-fit:cover!important;
    }

    #bpp-project-mobile-v32 .bpppd231-profile-copy {
        min-width:0!important;
    }

    #bpp-project-mobile-v32 .bpppd231-profile-copy h3 {
        margin:0 0 2px!important;
        color:#183027!important;
        font-size:12.5px!important;
        line-height:1.2!important;
        font-weight:850!important;
    }

    #bpp-project-mobile-v32 .bpppd231-verified {
        display:flex!important;
        align-items:center!important;
        gap:4px!important;
        margin:0 0 2px!important;
        color:#07884a!important;
        font-size:8.5px!important;
        line-height:1.2!important;
        font-weight:800!important;
    }

    #bpp-project-mobile-v32 .bpppd231-profile-copy p,
    #bpp-project-mobile-v32 .bpppd231-description {
        margin:0!important;
        color:#68776f!important;
        font-size:9.5px!important;
        line-height:1.4!important;
    }

    #bpp-project-mobile-v32 .bpppd231-description {
        margin:0 0 9px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-stats {
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:6px!important;
        margin:0 0 8px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-stats > div {
        min-width:0!important;
        min-height:52px!important;
        padding:6px 3px!important;
        border:1px solid #e0eee6!important;
        border-radius:9px!important;
        background:#f4faf6!important;
        display:flex!important;
        flex-direction:column!important;
        align-items:center!important;
        justify-content:center!important;
        text-align:center!important;
    }

    #bpp-project-mobile-v32 .bpppd231-stats span {
        color:#07964f!important;
        font-size:11px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-stats strong {
        margin:2px 0!important;
        color:#20382e!important;
        font-size:8.5px!important;
        line-height:1.1!important;
    }

    #bpp-project-mobile-v32 .bpppd231-stats small {
        color:#849188!important;
        font-size:7.5px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-profile-btn {
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        width:100%!important;
        min-height:36px!important;
        margin:0 0 7px!important;
        padding:0 10px!important;
        border-radius:8px!important;
        background:#07964f!important;
        color:#fff!important;
        text-decoration:none!important;
        font-size:9.5px!important;
        font-weight:850!important;
    }

    #bpp-project-mobile-v32 .bpppd231-actions {
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:6px!important;
        margin:0 0 8px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-actions a {
        min-height:35px!important;
        padding:5px 3px!important;
        border:1px solid #dcebe3!important;
        border-radius:8px!important;
        background:#f8fbf9!important;
        color:#315246!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        gap:4px!important;
        text-decoration:none!important;
        font-size:8px!important;
    }

    #bpp-project-mobile-v32 .bpppd231-trust {
        display:grid!important;
        grid-template-columns:22px minmax(0,1fr)!important;
        gap:7px!important;
        align-items:start!important;
        padding:8px!important;
        border-radius:8px!important;
        background:#f1f8f4!important;
        color:#557067!important;
    }

    #bpp-project-mobile-v32 .bpppd231-trust > span {
        width:22px!important;
        height:22px!important;
        border-radius:50%!important;
        display:grid!important;
        place-items:center!important;
        background:#dff4e8!important;
        color:#07884a!important;
        font-size:10px!important;
        font-weight:900!important;
    }

    #bpp-project-mobile-v32 .bpppd231-trust p {
        margin:0!important;
        font-size:8px!important;
        line-height:1.35!important;
    }

    #bpp-project-mobile-v32 .bpppd231-trust strong {
        display:block!important;
        margin:0 0 2px!important;
        color:#244539!important;
        font-size:8.5px!important;
    }

    /* Exact global footer accordion: footer.rpg-market-footer */
    footer.rpg-market-footer .bpp-v33-footer-accordion {
        width:100%!important;
        grid-column:1/-1!important;
        margin:14px 0 0!important;
        padding:0!important;
        border-top:1px solid rgba(255,255,255,.16)!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-item {
        width:100%!important;
        margin:0!important;
        padding:0!important;
        border-bottom:1px solid rgba(255,255,255,.14)!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-toggle {
        appearance:none!important;
        -webkit-appearance:none!important;
        position:relative!important;
        display:flex!important;
        align-items:center!important;
        width:100%!important;
        min-height:46px!important;
        margin:0!important;
        padding:0 34px 0 0!important;
        border:0!important;
        background:transparent!important;
        color:#fff!important;
        text-align:left!important;
        font-family:"DM Sans",sans-serif!important;
        font-size:11.5px!important;
        line-height:1.2!important;
        font-weight:800!important;
        box-shadow:none!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-toggle::after {
        content:"+"!important;
        position:absolute!important;
        right:2px!important;
        top:50%!important;
        transform:translateY(-50%)!important;
        color:rgba(255,255,255,.92)!important;
        font-size:19px!important;
        line-height:1!important;
        font-weight:400!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-item.is-open > .bpp-v33-footer-toggle::after {
        content:"−"!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-panel {
        display:none!important;
        width:100%!important;
        margin:0!important;
        padding:0 0 11px!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-item.is-open > .bpp-v33-footer-panel {
        display:block!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-source {
        display:block!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        flex:0 0 100%!important;
        margin:0!important;
        padding:0!important;
        border:0!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-original-heading {
        display:none!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-source a {
        display:block!important;
        width:100%!important;
        padding:4px 0!important;
        color:rgba(255,255,255,.82)!important;
        font-size:10.5px!important;
        line-height:1.35!important;
        text-decoration:none!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-source p {
        color:rgba(255,255,255,.72)!important;
        font-size:10px!important;
        line-height:1.4!important;
    }

    footer.rpg-market-footer .bpp-v33-footer-source form {
        width:100%!important;
        margin:7px 0 0!important;
    }

    /* The footer grid should become one mobile column after source columns
       are moved into the accordion. Brand remains first. */
    footer.rpg-market-footer.bpp-v33-footer-ready .rpg-market-footer__grid {
        display:block!important;
    }

    footer.rpg-market-footer.bpp-v33-footer-ready .rpg-market-footer__brand {
        width:100%!important;
        max-width:100%!important;
        margin:0!important;
    }

    /* Project sticky CTA sits above the already-existing global bottom nav. */
    .bpp-v33-sticky-cta {
        position:fixed!important;
        left:8px!important;
        right:8px!important;
        bottom:calc(82px + env(safe-area-inset-bottom))!important;
        z-index:2147482500!important;
        display:grid!important;
        grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr)!important;
        gap:7px!important;
        padding:7px!important;
        border:1px solid #dbe9e1!important;
        border-radius:14px!important;
        background:rgba(255,255,255,.97)!important;
        box-shadow:0 12px 35px rgba(2,52,36,.18)!important;
        opacity:0!important;
        visibility:hidden!important;
        pointer-events:none!important;
        transform:translateY(12px)!important;
        transition:.18s ease!important;
    }

    .bpp-v33-sticky-cta.is-visible {
        opacity:1!important;
        visibility:visible!important;
        pointer-events:auto!important;
        transform:none!important;
    }

    .bpp-v33-sticky-cta a {
        min-height:42px!important;
        border-radius:9px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        text-decoration:none!important;
        font-size:11px!important;
        font-weight:850!important;
    }

    .bpp-v33-sticky-units {
        background:#07964f!important;
        color:#fff!important;
    }

    .bpp-v33-sticky-wa {
        border:1px solid #cfe5d8!important;
        background:#f6fbf8!important;
        color:#067b43!important;
    }
}
