/* Prevent page breaking */
html,
body {
    width:100%;
    max-width:100%;
    overflow-x:hidden;
}


/* Lock body when menu open */
body.menu-open {
    overflow:hidden;
}

/* ===== Portfolio Page Mobile Fixes ===== */
@media (max-width: 768px) {
    .portfolio-page {
        padding: 80px 0 40px;
        width: 100%;
        max-width: 100%;
    }

    .portfolio-page .container {
        width: 95%;
        padding: 0 10px;
    }

    .portfolio-page h1 {
        font-size: 28px;
        text-align: center;
        margin-bottom: 15px;
    }

    .portfolio-page p {
        font-size: 16px;
        text-align: center;
        margin-bottom: 25px;
    }

    /* Filter buttons */
    .portfolio-categories {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        margin-bottom: 25px;
    }

    .category-btn {
        padding: 8px 14px;
        font-size: 13px;
        flex: 1 1 auto;
        min-width: 80px;
        max-width: 120px;
        text-align: center;
    }

    /* Portfolio grid */
    .portfolio-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .portfolio-item {
        height: 250px;
        border-radius: 10px;
    }

    .portfolio-item img {
        height: 250px;
        object-fit: cover;
    }

    .portfolio-overlay {
        padding: 12px;
        transform: translateY(0);
        background: rgba(35, 33, 33, 0.85);
    }

    .portfolio-overlay h3 {
        font-size: 16px;
        margin-bottom: 4px;
    }

    .portfolio-overlay p {
        font-size: 13px;
    }

    /* Place logo */
    .place-logo {
        width: 40px;
        height: 40px;
        top: 10px;
        right: 10px;
    }

    .place-logo img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    /* Pagination */
    .pagination {
        margin-top: 30px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .pagination a,
    .pagination span {
        min-width: 35px;
        height: 35px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .portfolio-page {
        padding: 70px 0 30px;
    }

    .portfolio-page h1 {
        font-size: 24px;
    }

    .portfolio-page p {
        font-size: 14px;
    }

    .category-btn {
        padding: 6px 12px;
        font-size: 12px;
        min-width: 70px;
    }

    .portfolio-item {
        height: 220px;
    }

    .portfolio-item img {
        height: 220px;
    }

    .portfolio-overlay h3 {
        font-size: 14px;
    }

    .portfolio-overlay p {
        font-size: 12px;
    }
}

@media (max-width: 320px) {
    .portfolio-page h1 {
        font-size: 20px;
    }

    .category-btn {
        padding: 5px 10px;
        font-size: 11px;
        min-width: 60px;
    }

    .portfolio-item {
        height: 200px;
    }

    .portfolio-item img {
        height: 200px;
    }
}

/* RTL Support for Portfolio Page */
html[dir="rtl"] .portfolio-page h1,
html[dir="rtl"] .portfolio-page p {
    text-align: center;
}

html[dir="rtl"] .portfolio-categories {
    direction: rtl;
}

html[dir="rtl"] .place-logo {
    right: auto;
    left: 10px;
}

html[dir="ltr"] .place-logo {
    right: 10px;
    left: auto;
}



/* Mobile Menu */
.mobile-menu {

    position:fixed !important;

    top:0;
    right:0;

    width:85%;
    max-width:330px;

    height:100vh;

    background:#fff;

    z-index:99999;

    overflow-y:auto;

    transform:translateX(100%);

    transition:transform .35s ease;

}



/* Open state */
.mobile-menu.open {

    transform:translateX(0);

}



/* Overlay */
.menu-backdrop {

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.5);

    z-index:99998;

    opacity:0;

    visibility:hidden;

    transition:.3s;

}



.menu-backdrop.active {

    opacity:1;

    visibility:visible;

}



/* Header always above */
header {

    position:relative;

    z-index:100000;

}



/* Keep hero stable */
.hero {

    width:100%;

    max-width:100%;

    overflow:hidden;

}



/* Mobile images */
img {

    max-width:100%;

    height:auto;

}