/* Business Park AQJOL — Portfolio page.
   Desktop first block only, matched to the supplied Figma geometry. */

.portfolio-page-body {
    margin: 0;
    background: #fff;
    color: #1f1f1f;
}

.portfolio-page {
    width: 100%;
    overflow: hidden;
}

@media (min-width: 761px) {
    .portfolio-page-body .blog-header__inner {
        width: min(100%, 1920px);
    }

    .portfolio-breadcrumbs {
        width: 100%;
        height: 24px;
        flex: 0 0 24px;
    }

    .portfolio-hero {
        width: 100%;
        max-width: none;
        margin: 0;
        background: #fff;
    }

    .portfolio-hero__content {
        box-sizing: border-box;
        width: min(100%, 1903px);
        margin: 0 auto;
        padding: 64px 40px 64px;
    }

    .portfolio-hero__title {
        width: 100%;
        height: 80px;
        margin: 0;
        color: #1f1f1f;
        font-family: 'RoadRadio', Arial, Helvetica, sans-serif;
        font-size: 96px;
        font-weight: 700;
        line-height: 80px;
        letter-spacing: 0;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .portfolio-hero__subtitle {
        width: 730px;
        min-height: 48px;
        margin: 24px 0 0;
        color: #1f1f1f;
        font-family: 'Manrope', Arial, Helvetica, sans-serif;
        font-size: 20px;
        font-weight: 500;
        line-height: 24px;
        letter-spacing: 0;
    }

    .portfolio-hero__media {
        width: 100%;
        max-width: none;
        height: 720px;
        overflow: hidden;
        background: #fff;
    }

    .portfolio-hero__media img {
        display: block;
        width: 100%;
        height: 100%;
        max-width: none;
        object-fit: cover;
        object-position: 50% 50%;
    }
}

/* Portfolio metrics — desktop Figma block directly below the hero media. */
.portfolio-metrics {
    display: none;
}

@media (min-width: 761px) {
    .portfolio-metrics {
        display: block;
        width: 100%;
        background: #fff;
    }

    .portfolio-metrics__inner {
        width: min(100%, 1903px);
        height: 217px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        background: #fff;
    }

    .portfolio-metrics__item {
        box-sizing: border-box;
        min-width: 0;
        height: 217px;
        padding: 56px 40px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        background: #fff;
    }

    .portfolio-metrics__item:not(:last-child) {
        border-right: 1px solid #e1e1e1;
    }

    .portfolio-metrics__value {
        margin: 0;
        color: #1f1f1f;
        font-family: 'RoadRadio', Arial, Helvetica, sans-serif;
        font-size: 64px;
        font-weight: 700;
        line-height: 80px;
        letter-spacing: 0;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .portfolio-metrics__label {
        width: 100%;
        margin: 5px 0 0;
        color: #1f1f1f;
        font-family: 'Manrope', Arial, Helvetica, sans-serif;
        font-size: 16px;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: 0;
        white-space: nowrap;
    }
}


/* Portfolio developer cards reuse the approved Investors page card layout on desktop only. */
.portfolio-developer {
    display: none;
}

@media (min-width: 761px) {
    .portfolio-developer {
        display: block;
    }

    .portfolio-developer .investors-portfolio__inner {
        width: min(100%, 1903px);
    }
}

@media (max-width: 760px) {
    .portfolio-contact {
        display: none;
    }
}

/* Portfolio developer typography — match the approved public typography used on Residents. */
@media (min-width: 761px) {
    .portfolio-developer .investors-portfolio__title,
    .portfolio-developer .investors-portfolio-card__title,
    .portfolio-developer .investors-portfolio-card__button {
        font-family: 'RoadRadio', Arial, Helvetica, sans-serif !important;
        font-weight: 700;
        letter-spacing: 0;
    }

    .portfolio-developer .investors-portfolio__subtitle,
    .portfolio-developer .investors-portfolio-card__subtitle,
    .portfolio-developer .investors-portfolio-card__description,
    .portfolio-developer .investors-portfolio-chip__label,
    .portfolio-developer .investors-portfolio-chip__value {
        font-family: 'Manrope', Arial, Helvetica, sans-serif !important;
        font-weight: 500;
        letter-spacing: 0;
    }
}

/* Portfolio contact mobile-only role chooser guard. */
.portfolio-contact__roles {
    display: none;
}