.elementor-8550 .elementor-element.elementor-element-8978d2d{--display:flex;--margin-top:100px;--margin-bottom:100px;--margin-left:0px;--margin-right:0px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-8550 .elementor-element.elementor-element-8e4d41e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 50px) 0px;border-style:solid;border-width:0px 0px 0px 0px;border-color:#343434;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);font-family:"Galano", Sans-serif;font-size:46px;font-weight:300;color:#FFFFFF;}.elementor-8550 .elementor-element.elementor-element-7513a60 > .elementor-widget-container{margin:0px 0px 0px 0px;}/* Start custom CSS for eidan_core_accordion_info, class: .elementor-element-7513a60 *//* ۱. حذف فاصله و پدینگ اضافی بین تایتل و کانتینر محتوا */
.elementor-8550 .elementor-element.elementor-element-7513a60 .qodef-m-content {
    padding-top: 0 !important;
    margin-top: -5px !important; /* جلو بردن متن به سمت بالا برای چسبیدن به تایتل*/
}

/* ۲. مرتب‌سازی کانتینر داخلی برای چیدمان افقی (متن چپ، عکس راست) */
.elementor-8550 .elementor-element.elementor-element-7513a60 .qodef-m-content-inner {
    display: flex !important;
    flex-direction: row-reverse !important; 
    justify-content: space-between !important;
    align-items: flex-start !important; /* تراز شدن المان‌ها از بالای باکس */
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ۳. ستون سمت چپ (تنظیمات متن  انیمباز شدن) */
.elementor-8550 .elementor-element.elementor-element-7513a60 .qodef-m-text {
    flex: 1 !important; /* پر کردن تمام فضای خالی سمت چپ */
    text-align: left !important;
    padding-right: 50px !important; /* ایجاد فاصله ایمن تا عکس */
    margin: 0 !important;
    
    /* انیمیشن باز شدن روان */
    max-height: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    transition: all 0.4s ease-in-out !important;
}

/* ۴. ستون سمت راست (تنظیمات کانتینر تصویر شاخص) */
.elementor-8550 .elementor-element.elementor-element-7513a60 .qodef-m-image {
    max-width: 40% !important; /* اجازه دادن به عکس تا حداکثر ۴۰٪ عرض کل ردیف را بگیرد */
    height: auto !important;
    flex-shrink: 0 !important; /* جلوگیری از فشرده شدن عکس */
}

/* نمایش عکس با ابعاد کاملاً واقعی و دفرمه نشدن آن */
.elementor-8550 .elementor-element.elementor-element-7513a60 .qodef-m-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important; /* نمایش کامل و واقعی عکس بدون کراپ یا کشیدگی */
}

/* ===================================================
   استایل‌های مربوط به وضعیت باز شده (Active)
   =================================================== */

.elementor-8550 .elementor-element.elementor-element-7513a60 .ui-accordion-content-active .qodef-m-text {
    max-height: 500px !important; /* فضای کافی برای متون طولانی‌تر */
    opacity: 1 !important;
    padding-top: 5px !important; /* فاصله جزئی و شیک از خط بالا */

}

.elementor-8550 .elementor-element.elementor-element-7513a60 .qodef-m-title{
    font-size: 30px;
    font-weight: 300;
    font-family: galano;
}





/* هنگام باز شدن آکاردئون */
.ui-state-active + .ui-accordion-content img,
.ui-accordion-header-active + .ui-accordion-content img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}




/* هدر در یک خط */
.qodef-m-navigation{
    display:flex !important;
    align-items:center;
    gap:20px;
}

/* عنوان */
.qodef-m-title{
    flex:1;
    margin:0;
}

/* عکس کوچک */
.qodef-m-navigation .accordion-thumb{
    width:150px;
    height:87.5px;
    object-fit:cover;

    flex-shrink:0;
}

/* وقتی آکاردئون باز شد عکس کوچک مخفی شود */
.qodef-m-navigation.ui-state-active .accordion-thumb{
    display:none;
}

/* =========================================
   Tablet
========================================= */
@media (max-width: 1024px){

    .qodef-m-title{
        font-size:24px !important;
    }

    .qodef-m-navigation .accordion-thumb{
        width:120px !important;
        height:70px !important;
    }

    .qodef-m-text{
        padding-right:30px !important;
    }

    .qodef-m-image{
        max-width:45% !important;
    }

}


/* =========================================
   Mobile
========================================= */
@media (max-width: 767px){

    /* هدر آکاردئون */
    .qodef-m-navigation{
        gap:12px !important;
        align-items:center !important;
    }

    /* عنوان */
    .qodef-m-title{
        font-size:18px !important;
        line-height:1.4 !important;
    }

    /* عکس کوچک داخل هدر */
    .qodef-m-navigation .accordion-thumb{
        width:80px !important;
        height:47px !important;
        flex-shrink:0 !important;
    }

    /* محتوای باز شده */
    .qodef-m-content-inner{
        display:block !important;
        width:100% !important;
    }

    .qodef-m-image{
        width:100% !important;
        max-width:100% !important;
        flex:0 0 100% !important;
    }

    .qodef-m-image{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        margin-bottom:20px !important;
    }

    .qodef-m-text{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        padding-right:0 !important;
        margin:0 !important;
        flex:none !important;
    }

    /* عکس بزرگ */
    .qodef-m-image{
        max-width:100% !important;
        width:100% !important;
        order:1;
    }

    .qodef-m-image img{
        width:100% !important;
        height:auto !important;
        display:block !important;
    }

    /* متن */
    .qodef-m-text{
        width:100% !important;
        padding-right:0 !important;
        order:2;
        font-size:15px !important;
        line-height:1.8 !important;
    }

    /* فلش */
    .qodef-m-mark{
        flex-shrink:0 !important;
    }
    .qodef-m-image,
    .qodef-m-text{
        clear:both !important;
    }
}




/* =========================================
   Small Mobile
========================================= */
@media (max-width: 480px){

    .qodef-m-title{
        font-size:16px !important;
    }

    .qodef-m-navigation .accordion-thumb{
        width:65px !important;
        height:38px !important;
    }

    .qodef-m-navigation{
        gap:10px !important;
    }

}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Galano';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://demo.boom-marcom.com/wp-content/uploads/2026/05/Galano-Grotesque-Light.woff2') format('woff2');
}
@font-face {
	font-family: 'Galano';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://demo.boom-marcom.com/wp-content/uploads/2026/05/Galano-Grotesque.woff2') format('woff2');
}
@font-face {
	font-family: 'Galano';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://demo.boom-marcom.com/wp-content/uploads/2026/05/Galano-Grotesque-Medium.woff') format('woff');
}
@font-face {
	font-family: 'Galano';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://demo.boom-marcom.com/wp-content/uploads/2026/05/Galano-Grotesque-Semi-Bold.woff2') format('woff2');
}
@font-face {
	font-family: 'Galano';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://demo.boom-marcom.com/wp-content/uploads/2026/05/Galano-Grotesque-Bold.woff2') format('woff2');
}
@font-face {
	font-family: 'Galano';
	font-style: normal;
	font-weight: 800;
	font-display: auto;
	src: url('https://demo.boom-marcom.com/wp-content/uploads/2026/05/Galano-Grotesque-Extra-Bold.woff2') format('woff2');
}
/* End Custom Fonts CSS */