/* Business Park AQJOL — Portfolio mobile first screen from Figma.
   Mobile only. Desktop and following sections are intentionally untouched. */
@media (max-width: 760px) {
    body.portfolio-page-body {
        width: 100% !important;
        min-width: 320px !important;
        margin: 0 !important;
        overflow-x: hidden !important;
        background: #FFFFFF !important;
        color: #1F1F1F !important;
    }

    body.portfolio-page-body .portfolio-page {
        width: 100% !important;
        max-width: none !important;
        overflow: hidden !important;
        background: #FFFFFF !important;
    }

    /* Header: approved public mobile geometry, with portfolio breadcrumbs kept visible. */
    body.portfolio-page-body .portfolio-header {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #FFFFFF !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__inner {
        width: 100% !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 16px 16px 0 !important;
        display: block !important;
        box-sizing: border-box !important;
        background: #FFFFFF !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__nav {
        position: relative !important;
        width: 100% !important;
        height: 52px !important;
        min-height: 52px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 0 !important;
        box-sizing: border-box !important;
        background: #FFFFFF !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__logo {
        width: 198px !important;
        height: 16px !important;
        min-height: 16px !important;
        flex: 0 0 198px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        text-decoration: none !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__logo img {
        display: block !important;
        width: 198px !important;
        height: 16px !important;
        object-fit: contain !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__menu,
    body.portfolio-page-body .portfolio-header .blog-header__actions,
    body.portfolio-page-body .portfolio-header .blog-header__phone,
    body.portfolio-page-body .portfolio-header .blog-header__link,
    body.portfolio-page-body .portfolio-header .blog-header__lang {
        display: none !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__burger[data-mobile-menu-open] {
        position: relative !important;
        z-index: 6 !important;
        top: auto !important;
        right: auto !important;
        width: 40px !important;
        height: 6px !important;
        min-height: 6px !important;
        flex: 0 0 40px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: space-between !important;
        gap: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        transform: none !important;
        cursor: pointer !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    body.portfolio-page-body .portfolio-header .blog-header__burger[data-mobile-menu-open] span {
        width: 40px !important;
        height: 1.2px !important;
        flex: 0 0 1.2px !important;
        display: block !important;
        background: #1F1F1F !important;
        border-radius: 0 !important;
    }

    body.portfolio-page-body .portfolio-breadcrumbs {
        width: 100% !important;
        max-width: 361px !important;
        height: 24px !important;
        min-height: 24px !important;
        margin: 40px 0 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        color: rgba(31, 31, 31, 0.50) !important;
        font-family: 'Manrope', Arial, Helvetica, sans-serif !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 24px !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
    }

    body.portfolio-page-body .portfolio-breadcrumbs a {
        color: rgba(31, 31, 31, 0.50) !important;
        font: inherit !important;
        text-decoration: none !important;
    }

    body.portfolio-page-body .portfolio-breadcrumbs span {
        color: #1F1F1F !important;
        font: inherit !important;
        font-weight: 500 !important;
    }

    body.portfolio-page-body .portfolio-breadcrumbs .site-breadcrumb-arrow {
        width: 12px !important;
        height: 12px !important;
        flex: 0 0 12px !important;
    }

    /* Hero copy: 361px content width inside the 393px Figma frame. */
    body.portfolio-page-body .portfolio-hero {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #FFFFFF !important;
    }

    body.portfolio-page-body .portfolio-hero__content {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 12px 16px 40px !important;
        box-sizing: border-box !important;
    }

    body.portfolio-page-body .portfolio-hero__title {
        width: 100% !important;
        max-width: 361px !important;
        min-height: 108px !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #1F1F1F !important;
        font-family: 'RoadRadio', Arial, Helvetica, sans-serif !important;
        font-size: 40px !important;
        font-style: normal !important;
        font-weight: 700 !important;
        line-height: 36px !important;
        letter-spacing: 0 !important;
        text-transform: uppercase !important;
        white-space: normal !important;
    }

    body.portfolio-page-body .portfolio-hero__subtitle {
        width: 100% !important;
        max-width: 361px !important;
        min-height: 60px !important;
        margin: 12px 0 0 !important;
        padding: 0 !important;
        color: #2A2A2A !important;
        font-family: 'Inter Tight', 'Manrope', Arial, Helvetica, sans-serif !important;
        font-size: 14px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 140% !important;
        letter-spacing: 0 !important;
        white-space: normal !important;
    }

    /* Figma mobile hero image: edge-to-edge 393 × 308, Crop. */
    body.portfolio-page-body .portfolio-hero__media {
        width: 100% !important;
        max-width: none !important;
        height: 308px !important;
        margin: 0 !important;
        overflow: hidden !important;
        background: #FFFFFF !important;
    }

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

    /* Mobile metrics shown directly below the image. Geometry mirrors the Figma 361 × 171 frame. */
    body.portfolio-page-body .portfolio-metrics {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 28px 16px 28px !important;
        box-sizing: border-box !important;
        background: #FFFFFF !important;
    }

    body.portfolio-page-body .portfolio-metrics__inner {
        position: relative !important;
        width: 100% !important;
        max-width: 361px !important;
        height: 171px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: 65px 65px !important;
        row-gap: 41px !important;
        background: #FFFFFF !important;
    }

    body.portfolio-page-body .portfolio-metrics__inner::after {
        content: '' !important;
        position: absolute !important;
        z-index: 0 !important;
        top: 85px !important;
        left: 0 !important;
        width: 100% !important;
        height: 1px !important;
        display: block !important;
        background: #D0D0D0 !important;
        pointer-events: none !important;
    }

    body.portfolio-page-body .portfolio-metrics__item {
        position: relative !important;
        z-index: 1 !important;
        min-width: 0 !important;
        width: 100% !important;
        height: 65px !important;
        min-height: 65px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        background: transparent !important;
        border: 0 !important;
        overflow: visible !important;
    }

    body.portfolio-page-body .portfolio-metrics__item:nth-child(even) {
        padding-left: 20px !important;
        box-sizing: border-box !important;
    }

    body.portfolio-page-body .portfolio-metrics__item:nth-child(even)::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 1px !important;
        height: 65px !important;
        display: block !important;
        background: #D0D0D0 !important;
        pointer-events: none !important;
    }

    body.portfolio-page-body .portfolio-metrics__value {
        display: block !important;
        margin: 0 !important;
        color: #1F1F1F !important;
        font-family: 'RoadRadio', Arial, Helvetica, sans-serif !important;
        font-size: 30px !important;
        font-style: normal !important;
        font-weight: 700 !important;
        line-height: 40px !important;
        letter-spacing: 0 !important;
        text-transform: uppercase !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

    body.portfolio-page-body .portfolio-metrics__label {
        display: block !important;
        width: 100% !important;
        margin: -7px 0 0 !important;
        color: #1F1F1F !important;
        font-family: 'Manrope', Arial, Helvetica, sans-serif !important;
        font-size: 12px !important;
        font-style: normal !important;
        font-weight: 500 !important;
        line-height: 16px !important;
        letter-spacing: 0 !important;
        white-space: normal !important;
    }

    /* Following portfolio sections were not supplied for mobile yet. */
    body.portfolio-page-body .portfolio-developer,
    body.portfolio-page-body .portfolio-contact {
        display: none !important;
    }
}