.elementor-1042 .elementor-element.elementor-element-9ea5b95{--display:flex;}/* Start custom CSS for html, class: .elementor-element-5302b36 */#app-portfolio-23 {
    --gold: #d4af37;
    --deep-teal: #0d2c2d;
    --burgundy: #4a0e0e;
    direction: rtl;
    background: var(--deep-teal);
    color: #f0e6d2;
    min-height: 100vh;
    overflow-x: hidden;
}

/* در دسکتاپ اسکرول را قفل می‌کنیم تا اسکرول مجازی کار کند */
@media (min-width: 769px) {
    body, html {
        overflow: hidden;
        height: 100%;
    }
    #app-portfolio-23 .horizontal-scroller {
        display: flex;
        flex-direction: row; /* تغییر به row برای چیدمان صحیح RTL از راست به چپ */
        width: 400vw;
        height: 100vh;
        will-change: transform;
        transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }
    #app-portfolio-23 .section-item {
        width: 100vw;
        height: 100vh;
        flex-shrink: 0;
        padding: 5vh 8vw;
        position: relative;
    }
}

/* در موبایل به حالت عمودی برمی‌گردد */
@media (max-width: 768px) {
    #app-portfolio-23 .horizontal-scroller {
        display: block;
        width: 100%;
        height: auto;
    }
    #app-portfolio-23 .section-item {
        width: 100%;
        min-height: 100vh;
        padding: 10vh 5vw;
        border-bottom: 1px solid rgba(212, 175, 55, 0.1);
    }
}

#app-portfolio-23 .arch-shape {
    position: absolute;
    border: 2px solid var(--gold);
    border-radius: 500px 500px 0 0;
    opacity: 0.2;
    z-index: 0;
}

#app-portfolio-23 .gold-gradient-text {
    background: linear-gradient(to bottom, #fbf5b7 0%, #d4af37 50%, #a67c00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--gold);
}

#app-portfolio-23 .deco-card {
    background: rgba(13, 44, 45, 0.8);
    border: 1px solid var(--gold);
    position: relative;
    z-index: 10;
    backdrop-filter: blur(10px);
}

#app-portfolio-23 .bg-fixed-layer {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    z-index: -1; background-size: cover; background-position: center;
    filter: brightness(0.15);
}

#app-portfolio-23 .profile-arc {
    border-radius: 500px 500px 20px 20px;
    border: 3px solid var(--gold);
    padding: 10px;
    background: linear-gradient(45deg, var(--gold), transparent);
}

#app-portfolio-23 .progress-bar-custom {
    position: fixed; bottom: 50px; left: 50px; width: 200px; height: 2px;
    background: rgba(212, 175, 55, 0.2); z-index: 100;
}

#app-portfolio-23 .progress-fill {
    height: 100%; background: var(--gold); width: 0%; transition: width 0.3s;
    box-shadow: 0 0 10px var(--gold);
}

#app-portfolio-23 .fa-solid, #app-portfolio-23 .fa-brands {
    color: var(--gold);
}/* End custom CSS */