.elementor-241 .elementor-element.elementor-element-acf5e11{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-241 .elementor-element.elementor-element-acf5e11:not(.elementor-motion-effects-element-type-background), .elementor-241 .elementor-element.elementor-element-acf5e11 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-44deacf );}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-2b1fc4c */<style>

/* =========================================================
   WRITERS GRID
========================================================= */

.writers-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
    padding: 0 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

@media (min-width: 768px) {
    .writers-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        padding: 0 5vw !important;
    }
}

@media (min-width: 1024px) {
    .writers-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        padding: 0 8vw !important;
        gap: 22px !important;
    }
}

@media (min-width: 1280px) {
    .writers-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 24px !important;
    }
}


/* =========================================================
   CARD
========================================================= */

.author-card {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    overflow: hidden !important;
    background: #fffdfa !important;

    transition:
        transform .4s ease,
        box-shadow .4s ease !important;
}

.author-card:hover {
    transform: translateY(-6px) !important;

    box-shadow:
        0 25px 45px -20px rgba(32,24,12,.28) !important;
}


/* =========================================================
   PHOTO
========================================================= */

.author-photo {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 3 / 4 !important;
    overflow: hidden !important;
    background: #eee6d6 !important;
}

.author-photo-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.author-photo-link img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}


/* =========================================================
   PHOTO FILTER
========================================================= */

.grayscale-artifact {
    filter:
        grayscale(.75)
        contrast(1.05)
        sepia(.18) !important;

    transition:
        filter .6s ease,
        transform .6s ease !important;
}

.author-card:hover .grayscale-artifact {
    filter:
        grayscale(0)
        contrast(1.08)
        sepia(.05) !important;

    transform: scale(1.03) !important;
}


/* =========================================================
   LOGO
   این قسمت مخصوص لوگوی ACF است
========================================================= */

.author-logo-box {

    width: 100% !important;

    height: 72px !important;

    padding: 10px 16px !important;

    box-sizing: border-box !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    background: #fffdfa !important;

    overflow: hidden !important;
}


.author-logo-link {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: 100% !important;

    height: 100% !important;

    text-decoration: none !important;
}


.author-logo-box img {

    display: block !important;

    width: auto !important;

    height: auto !important;

    max-width: 85% !important;

    max-height: 52px !important;

    object-fit: contain !important;

    object-position: center !important;

    margin: 0 auto !important;
}


/* =========================================================
   INFO
========================================================= */

.author-card > .p-4 {
    padding: 16px !important;
    text-align: center !important;
}

.author-card h3 {
    margin: 0 !important;

    font-family: 'Vazirmatn', sans-serif !important;

    font-size: 16px !important;

    line-height: 1.7 !important;

    font-weight: 700 !important;
}


/* =========================================================
   ROLE
========================================================= */

.author-card h3 + span {
    display: inline-block !important;

    margin-top: 8px !important;

    padding: 4px 12px !important;

    border-radius: 999px !important;

    font-size: 11px !important;
}


/* =========================================================
   AUDIO ROW
========================================================= */

.audio-row {
    display: flex !important;
    flex-wrap: wrap !important;

    gap: 8px !important;

    padding: 12px 16px 16px !important;

    margin-top: auto !important;

    box-sizing: border-box !important;
}


/* =========================================================
   BUTTONS
========================================================= */

.audio-btn {
    flex: 1 1 auto !important;

    min-width: 0 !important;

    box-sizing: border-box !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    gap: 5px !important;

    padding: 7px 4px !important;

    font-family: 'Vazirmatn', sans-serif !important;

    font-size: 11px !important;

    line-height: 1.3 !important;

    border: 1px solid #d8cdb8 !important;

    border-radius: 3px !important;

    background: #fffdfa !important;

    color: #4c463d !important;

    cursor: pointer !important;

    text-align: center !important;

    transition: all .25s ease !important;
}

.audio-btn:hover {
    border-color: #a68d60 !important;
}


/* =========================================================
   PLAYING
========================================================= */

.audio-btn.is-playing {
    background: #1c2940 !important;
    color: #fffdfa !important;
    border-color: #1c2940 !important;
}


/* =========================================================
   DISABLED
========================================================= */

.audio-btn.audio-btn-disabled {
    opacity: .4 !important;
    cursor: not-allowed !important;
}


/* =========================================================
   PHOTO PLAY
========================================================= */

#authors-full-grid .photo-play {

    position: absolute !important;

    left: 50% !important;
    bottom: 20px !important;

    transform: translateX(-50%) !important;

    width: 52px !important;
    height: 52px !important;

    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    border: none !important;
    border-radius: 50% !important;

    background: rgba(28,41,64,.92) !important;

    color: #fff !important;

    cursor: pointer !important;

    z-index: 40 !important;
}

#authors-full-grid .photo-play:hover {
    transform:
        translateX(-50%)
        scale(1.08) !important;

    background: #1c2940 !important;
}


/* =========================================================
   EQUALIZER
========================================================= */

#authors-full-grid .audio-equalizer {

    position: absolute !important;

    left: 50% !important;
    bottom: 24px !important;

    transform: translateX(-50%) !important;

    width: 64px !important;
    height: 44px !important;

    padding: 7px 9px !important;

    box-sizing: border-box !important;

    display: flex !important;

    align-items: flex-end !important;
    justify-content: center !important;

    gap: 4px !important;

    background: rgba(28,41,64,.94) !important;

    border-radius: 8px !important;

    opacity: 0 !important;
    visibility: hidden !important;

    pointer-events: none !important;

    z-index: 50 !important;

    transition:
        opacity .25s ease,
        visibility .25s ease !important;
}


#authors-full-grid .author-card.is-playing .audio-equalizer,
#authors-full-grid .audio-equalizer.is-playing {

    opacity: 1 !important;
    visibility: visible !important;
}


#authors-full-grid .audio-equalizer span {

    display: block !important;

    width: 5px !important;
    height: 7px !important;

    background: #fff !important;

    border-radius: 3px !important;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .writers-grid {
        grid-template-columns: 1fr !important;
        padding: 0 20px !important;
    }

    .author-logo-box {
        height: 68px !important;
    }

    .author-logo-box img {
        max-width: 80% !important;
        max-height: 48px !important;
    }

    #authors-full-grid .photo-play {
        width: 46px !important;
        height: 46px !important;
        bottom: 15px !important;
    }

}
<style>

/* =========================================================
   FADE BOTTOM OF AUTHOR PHOTO
========================================================= */

.author-photo {
    position: relative !important;
}


/* ایجاد لایه محوشدن در پایین تصویر */

.author-photo::after {

    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 35%;

    z-index: 5;

    pointer-events: none;

    background: linear-gradient(
        to bottom,
        rgba(255, 253, 250, 0),
        rgba(255, 253, 250, 0.15) 25%,
        rgba(255, 253, 250, 0.65) 65%,
        #fffdfa 100%
    );
}


/* =========================================================
   لینک و عکس زیر لایه فید باقی بمانند
========================================================= */

.author-photo-link {
    position: relative !important;
    z-index: 1 !important;
}


/* =========================================================
   دکمه پخش بالای فید باقی بماند
========================================================= */

#authors-full-grid .photo-play {
    z-index: 20 !important;
}


/* =========================================================
   اکولایزر بالای فید باقی بماند
========================================================= */

#authors-full-grid .audio-equalizer {
    z-index: 30 !important;
}

</style>
</style>/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-814b5b6 *//* =========================================================
   WRITERS GRID + FULL WIDTH SEARCH - COMPLETE CSS
========================================================= */


/* =========================================================
   SEARCH BOX
   هم‌عرض با گرید
========================================================= */

#writers-search-box {

    width: 100% !important;

    max-width: none !important;

    margin: 0 0 42px 0 !important;

    padding: 0 20px !important;

    box-sizing: border-box;

    position: relative;

    direction: rtl;
}


/* =========================================================
   SEARCH INPUT
========================================================= */

#writers-search-input {

    display: block;

    width: 100% !important;

    max-width: none !important;

    height: 58px;

    padding:
        0
        52px
        0
        22px;

    box-sizing: border-box;

    background:
        #f3eee6 !important;

    border:
        1px solid rgba(24, 59, 45, 0.16) !important;

    border-radius:
        3px !important;

    color:
        #183b2d !important;

    font-family:
        "Vazirmatn",
        sans-serif !important;

    font-size:
        15px !important;

    font-weight:
        400 !important;

    outline:
        none !important;

    box-shadow:
        none !important;

    transition:
        border-color .25s ease,
        background-color .25s ease,
        box-shadow .25s ease;
}


#writers-search-input::placeholder {

    color:
        #183b2d !important;

    opacity:
        .48;

}


#writers-search-input:hover {

    background:
        #f7f3ed !important;

    border-color:
        rgba(24, 59, 45, 0.28) !important;

}


#writers-search-input:focus {

    background:
        #f8f4ee !important;

    border-color:
        #183b2d !important;

    box-shadow:
        0 8px 24px
        rgba(24, 59, 45, 0.07) !important;

}


/* =========================================================
   SEARCH ICON
========================================================= */

#writers-search-icon {

    position:
        absolute;

    right:
        39px;

    top:
        50%;

    transform:
        translateY(-50%);

    font-size:
        22px;

    line-height:
        1;

    color:
        #183b2d;

    opacity:
        .72;

    pointer-events:
        none;

    z-index:
        2;
}


/* =========================================================
   SEARCH BROWSER DECORATION
========================================================= */

#writers-search-input::-webkit-search-decoration,
#writers-search-input::-webkit-search-cancel-button,
#writers-search-input::-webkit-search-results-button,
#writers-search-input::-webkit-search-results-decoration {

    -webkit-appearance:
        none;
}


#writers-search-input::-ms-clear {

    display:
        none;
}


/* =========================================================
   CARD
========================================================= */

#authors-full-grid .author-card {

    background-color:
        #576d34 !important;

    background-image:
        none !important;

}


/* =========================================================
   REMOVE PHOTO GRADIENT
========================================================= */

#authors-full-grid .author-photo,
#authors-full-grid .author-photo::before,
#authors-full-grid .author-photo::after,
#authors-full-grid .author-photo-link,
#authors-full-grid .author-photo-link::before,
#authors-full-grid .author-photo-link::after,
#authors-full-grid .author-photo img {

    background-image:
        none !important;

}


/* حذف کامل pseudo element های احتمالی روی عکس */

#authors-full-grid .author-photo::before,
#authors-full-grid .author-photo::after,
#authors-full-grid .author-photo-link::before,
#authors-full-grid .author-photo-link::after {

    content:
        none !important;

    display:
        none !important;

    opacity:
        0 !important;

    visibility:
        hidden !important;

}


/* =========================================================
   PHOTO
========================================================= */

#authors-full-grid .author-photo {

    position:
        relative;

    overflow:
        hidden;

}


#authors-full-grid .author-photo img {

    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

}


/* =========================================================
   PHOTO PLAY BUTTON
========================================================= */

#authors-full-grid .photo-play {

    position:
        absolute;

    left:
        50%;

    bottom:
        20px;

    transform:
        translateX(-50%);

    width:
        52px;

    height:
        52px;

    padding:
        0;

    margin:
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        none;

    border-radius:
        50%;

    background:
        rgba(28, 41, 64, 0.92);

    color:
        #ffffff;

    cursor:
        pointer;

    z-index:
        40;

    transition:
        transform .25s ease,
        background-color .25s ease,
        opacity .25s ease;

}


#authors-full-grid .photo-play:hover {

    transform:
        translateX(-50%)
        scale(1.08);

    background-color:
        #1c2940;

}


#authors-full-grid .photo-play.is-playing {

    opacity:
        1;

    background-color:
        #1c2940;

}


#authors-full-grid
.photo-play
.material-symbols-outlined {

    font-size:
        25px;

    line-height:
        1;

}


/* =========================================================
   EQUALIZER
========================================================= */

#authors-full-grid .audio-equalizer {

    position:
        absolute;

    left:
        50%;

    bottom:
        24px;

    transform:
        translateX(-50%);

    width:
        64px;

    height:
        44px;

    padding:
        7px 9px;

    box-sizing:
        border-box;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        center;

    gap:
        4px;

    background:
        rgba(28, 41, 64, 0.94);

    border-radius:
        8px;

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

    z-index:
        50;

    transition:
        opacity .25s ease,
        visibility .25s ease;

}


/* =========================================================
   EQUALIZER ACTIVE
========================================================= */

#authors-full-grid
.author-card.is-playing
.audio-equalizer {

    opacity:
        1;

    visibility:
        visible;

}


#authors-full-grid
.audio-equalizer.is-playing {

    opacity:
        1;

    visibility:
        visible;

}


/* =========================================================
   EQUALIZER BARS
========================================================= */

#authors-full-grid .audio-equalizer span {

    display:
        block;

    width:
        5px;

    height:
        7px;

    background:
        #ffffff;

    border-radius:
        3px;

    transform-origin:
        bottom;

}


/* =========================================================
   EQUALIZER ANIMATIONS
========================================================= */

#authors-full-grid
.audio-equalizer.is-playing
span:nth-child(1),

#authors-full-grid
.author-card.is-playing
.audio-equalizer
span:nth-child(1) {

    animation:
        nl_equalizer_1
        .55s
        ease-in-out
        infinite
        alternate;

}


#authors-full-grid
.audio-equalizer.is-playing
span:nth-child(2),

#authors-full-grid
.author-card.is-playing
.audio-equalizer
span:nth-child(2) {

    animation:
        nl_equalizer_2
        .40s
        ease-in-out
        infinite
        alternate;

}


#authors-full-grid
.audio-equalizer.is-playing
span:nth-child(3),

#authors-full-grid
.author-card.is-playing
.audio-equalizer
span:nth-child(3) {

    animation:
        nl_equalizer_3
        .50s
        ease-in-out
        infinite
        alternate;

}


#authors-full-grid
.audio-equalizer.is-playing
span:nth-child(4),

#authors-full-grid
.author-card.is-playing
.audio-equalizer
span:nth-child(4) {

    animation:
        nl_equalizer_4
        .35s
        ease-in-out
        infinite
        alternate;

}


#authors-full-grid
.audio-equalizer.is-playing
span:nth-child(5),

#authors-full-grid
.author-card.is-playing
.audio-equalizer
span:nth-child(5) {

    animation:
        nl_equalizer_5
        .60s
        ease-in-out
        infinite
        alternate;

}


/* =========================================================
   KEYFRAMES
========================================================= */

@keyframes nl_equalizer_1 {

    from {
        height:
            7px;
    }

    to {
        height:
            24px;
    }

}


@keyframes nl_equalizer_2 {

    from {
        height:
            9px;
    }

    to {
        height:
            34px;
    }

}


@keyframes nl_equalizer_3 {

    from {
        height:
            6px;
    }

    to {
        height:
            29px;
    }

}


@keyframes nl_equalizer_4 {

    from {
        height:
            11px;
    }

    to {
        height:
            37px;
    }

}


@keyframes nl_equalizer_5 {

    from {
        height:
            8px;
    }

    to {
        height:
            26px;
    }

}


/* =========================================================
   AUDIO BUTTON PLAYING
========================================================= */

#authors-full-grid
.audio-btn.is-playing {

    background:
        #1c2940 !important;

    color:
        #ffffff !important;

    border-color:
        #1c2940 !important;

}


/* =========================================================
   WHITE LOGO AREA
========================================================= */

#authors-full-grid .author-logo-box {

    width:
        100%;

    height:
        70px;

    display:
        flex;

    justify-content:
        flex-end;

    align-items:
        center;

    padding:
        0
        16px
        16px;

    box-sizing:
        border-box;

    background:
        transparent !important;

    background-color:
        transparent !important;

    background-image:
        none !important;

    border:
        none !important;

    box-shadow:
        none !important;

}


/* =========================================================
   LOGO FIXED FRAME
========================================================= */

#authors-full-grid .author-logo-link {

    width:
        120px;

    height:
        50px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0 !important;

    margin:
        0 !important;

    background:
        transparent !important;

    background-color:
        transparent !important;

    background-image:
        none !important;

    border:
        none !important;

    box-shadow:
        none !important;

}


/* =========================================================
   LOGO IMAGE
========================================================= */

#authors-full-grid .author-logo-box img {

    display:
        block;

    width:
        120px !important;

    height:
        50px !important;

    max-width:
        120px !important;

    max-height:
        50px !important;

    object-fit:
        contain;

    object-position:
        center;

    padding:
        0 !important;

    margin:
        0 !important;

    background:
        transparent !important;

    background-color:
        transparent !important;

    background-image:
        none !important;

    border:
        none !important;

    box-shadow:
        none !important;

}


/* =========================================================
   LOGO HOVER / FOCUS / ACTIVE
========================================================= */

#authors-full-grid .author-logo-link:hover,
#authors-full-grid .author-logo-link:focus,
#authors-full-grid .author-logo-link:active {

    background:
        transparent !important;

    background-color:
        transparent !important;

    background-image:
        none !important;

    border:
        none !important;

    box-shadow:
        none !important;

}


/* =========================================================
   REMOVE LOGO PSEUDO ELEMENTS
========================================================= */

#authors-full-grid .author-logo-box::before,
#authors-full-grid .author-logo-box::after,
#authors-full-grid .author-logo-link::before,
#authors-full-grid .author-logo-link::after {

    content:
        none !important;

    display:
        none !important;

    background:
        transparent !important;

    background-image:
        none !important;

}


/* =========================================================
   CARD TEXT
========================================================= */

#authors-full-grid
.author-card h3 {

    color:
        #ffffff !important;

}


#authors-full-grid
.author-card .text-on-surface {

    color:
        #ffffff !important;

}


#authors-full-grid
.author-card
.bg-surface-container-high {

    background:
        rgba(255,255,255,0.14) !important;

}


#authors-full-grid
.author-card
.text-on-surface-variant {

    color:
        #ffffff !important;

}


/* =========================================================
   AUDIO ROW
========================================================= */

#authors-full-grid .audio-row {

    background:
        transparent !important;

}


/* =========================================================
   HIDDEN SEARCH RESULTS
========================================================= */

#authors-full-grid
.author-card.is-hidden {

    display:
        none !important;

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {


    /* -----------------------------------------------------
       SEARCH
    ----------------------------------------------------- */

    #writers-search-box {

        width:
            100% !important;

        max-width:
            none !important;

        padding:
            0 20px !important;

        margin:
            0 0 30px 0 !important;

    }


    #writers-search-input {

        width:
            100% !important;

        height:
            54px;

        padding:
            0
            48px
            0
            18px;

        font-size:
            14px !important;

    }


    #writers-search-icon {

        right:
            36px;

        font-size:
            21px;

    }


    /* -----------------------------------------------------
       PHOTO PLAY
    ----------------------------------------------------- */

    #authors-full-grid .photo-play {

        width:
            46px;

        height:
            46px;

        bottom:
            15px;

    }


    #authors-full-grid
    .photo-play
    .material-symbols-outlined {

        font-size:
            22px;

    }


    /* -----------------------------------------------------
       EQUALIZER
    ----------------------------------------------------- */

    #authors-full-grid
    .audio-equalizer {

        width:
            58px;

        height:
            40px;

        bottom:
            18px;

        gap:
            3px;

    }


    #authors-full-grid
    .audio-equalizer span {

        width:
            4px;

    }


    /* -----------------------------------------------------
       LOGO
    ----------------------------------------------------- */

    #authors-full-grid
    .author-logo-box {

        height:
            60px;

        padding:
            0
            12px
            12px;

        background:
            transparent !important;

        background-color:
            transparent !important;

    }


    #authors-full-grid
    .author-logo-link {

        width:
            100px;

        height:
            42px;

    }


    #authors-full-grid
    .author-logo-box img {

        width:
            100px !important;

        height:
            42px !important;

        max-width:
            100px !important;

        max-height:
            42px !important;

    }

}/* End custom CSS */