
.mfsp{
    --mfsp-line: color-mix(in srgb,var(--mfsp-border) 42%,transparent);
    width:100%;
    margin:54px auto;
    direction:rtl;
    color:var(--mfsp-body-color);
    box-sizing:border-box;
}
.mfsp *{box-sizing:border-box}

.mfsp-shell{
    position:relative;
    width:min(100%,var(--mfsp-max-width));
    margin:auto;
    overflow:hidden;
    border:1px solid color-mix(in srgb,var(--mfsp-border) 34%,transparent);
    border-radius:calc(var(--mfsp-radius) + 8px);
    background:
        radial-gradient(65% 42% at 50% 22%,
            color-mix(in srgb,var(--mfsp-accent) 6%,transparent),
            transparent 72%),
        linear-gradient(160deg,
            color-mix(in srgb,var(--mfsp-surface) 62%,transparent),
            color-mix(in srgb,var(--mfsp-surface) 46%,transparent));
    backdrop-filter: blur(10px) saturate(112%);
    -webkit-backdrop-filter: blur(10px) saturate(112%);
    box-shadow:
        0 18px 48px rgba(0,0,0,.12),
        inset 0 1px rgba(255,255,255,.02);
    isolation:isolate;
}

.mfsp-shell:before{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    right:-140px;
    bottom:-170px;
    border-radius:50%;
    background:color-mix(in srgb,var(--mfsp-accent) 7%,transparent);
    filter:blur(90px);
    pointer-events:none;
    z-index:-1;
}

.mfsp-shell:after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(180deg,rgba(255,255,255,.012),transparent 22%);
    border-radius:inherit;
}

.mfsp-heading{
    position:relative;
    z-index:3;
    padding:40px 48px 22px;
}

.mfsp-title{
    margin:0;
    color:var(--mfsp-title-color);
    font-size:var(--mfsp-title-size);
    line-height:1.24;
    font-weight:800;
    letter-spacing:-.018em;
}

/* إزالة خط التمييز أسفل العنوان */
.mfsp-title:after{display:none!important}

.mfsp-subtitle{
    max-width:860px;
    margin:14px 0 0;
    color:var(--mfsp-body-color);
    font-size:var(--mfsp-body-size);
    line-height:1.92;
    opacity:.76;
}

.mfsp-layout{
    display:flex;
    align-items:stretch;
    position:relative;
}

.mfsp-pos-right .mfsp-layout{flex-direction:row}
.mfsp-pos-left .mfsp-layout{flex-direction:row-reverse}
.mfsp-pos-top .mfsp-layout{flex-direction:column}
.mfsp-pos-bottom .mfsp-layout{flex-direction:column-reverse}

.mfsp-media{
    position:relative;
    flex:0 0 47%;
    min-width:0;
    z-index:2;
}

/* أعلى / أسفل */
.mfsp-pos-top .mfsp-media,
.mfsp-pos-bottom .mfsp-media{
    width:100%;
    flex-basis:auto;
    padding:0 48px;
}

/* منطقة الصورة لا تحجز أي مساحة إضافية خارج المقاس المحدد. */
.mfsp-pos-top .mfsp-media,
.mfsp-pos-bottom .mfsp-media{
    height:auto;
    min-height:0;
    display:flex;
    align-items:flex-start;
    justify-content:center;
}

/* أبعاد الصورة: مصدر واحد فقط عبر متغيرات البطاقة المحفوظة من الإعدادات. */
.mfsp-slider{
    position:relative;
    width:min(var(--mfsp-image-width),100%);
    height:var(--mfsp-image-height);
    max-width:100%;
    margin-block:0;
    padding:0;
    overflow:hidden;
    background:transparent;
    flex:0 0 auto;
}

.mfsp-pos-top .mfsp-slider,
.mfsp-pos-bottom .mfsp-slider{
    margin:auto;
}

/* يمين / يسار: مساحة أوسع للصورة وتوازن أفضل مع النص */
.mfsp-pos-right .mfsp-media,
.mfsp-pos-left .mfsp-media{
    flex-basis:48%;
    padding:28px 18px 30px 30px;
}

.mfsp-pos-left .mfsp-media{
    padding:28px 30px 30px 18px;
}



.mfsp .mfsp-image{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:cover !important;
    object-position:center !important;
    border-radius:24px !important;
    opacity:0;
    transform:none !important;
    filter:none !important;
    image-rendering:auto;
    transition:opacity .35s ease;
}

.mfsp-image.is-active{
    opacity:1;
    transform:none !important;
}

.mfsp-media:before{
    content:"";
    position:absolute;
    z-index:-1;
    width:42%;
    aspect-ratio:1;
    top:48%;
    left:50%;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:color-mix(in srgb,var(--mfsp-accent) 5%,transparent);
    filter:blur(62px);
}

.mfsp-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:5;
    width:40px;
    height:40px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:50%;
    background:rgba(7,9,22,.42);
    color:#fff;
    font-size:26px;
    cursor:pointer;
    backdrop-filter:blur(9px);
    opacity:.62;
    transition:.2s ease;
}

.mfsp-nav:hover{
    opacity:.95;
    transform:translateY(-50%) scale(1.04);
}

.mfsp-prev{right:12px}
.mfsp-next{left:12px}

.mfsp-dots{
    position:absolute;
    z-index:6;
    left:50%;
    bottom:10px;
    transform:translateX(-50%);
    display:flex;
    gap:7px;
}

.mfsp-dot{
    width:7px;
    height:7px;
    padding:0;
    border:0;
    border-radius:20px;
    background:rgba(255,255,255,.24);
    cursor:pointer;
    transition:.22s ease;
}

.mfsp-dot.is-active{
    width:24px;
    background:var(--mfsp-accent);
}

/* المحتوى يندمج مع نفس البطاقة */
.mfsp-content{
    flex:1;
    min-width:0;
    position:relative;
    z-index:3;
    background:transparent;
}

.mfsp-pos-top .mfsp-content{
    margin:12px 48px 0;
    border-top:1px solid var(--mfsp-line);
}

.mfsp-pos-bottom .mfsp-content{
    margin:0 48px 18px;
    border-bottom:1px solid var(--mfsp-line);
}

/* في الوضع الجانبي فصل خفيف فقط بدل صندوق مستقل */
.mfsp-pos-right .mfsp-content,
.mfsp-pos-left .mfsp-content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    margin:22px 30px 30px;
    padding-inline-start:30px;
    border-inline-start:1px solid var(--mfsp-line);
}

/* التبويبات أصبحت خفيفة ومندمجة */
.mfsp-tabs{
    display:flex;
    width:100%;
    direction:rtl;
    background:transparent;
    border-bottom:1px solid var(--mfsp-line);
}

.mfsp-tab{
    flex:1 1 0;
    min-width:0;
    border:0;
    background:transparent;
    color:color-mix(in srgb,var(--mfsp-body-color) 68%,transparent);
    padding:19px 12px 16px;
    font-size:var(--mfsp-tab-size);
    font-weight:700;
    cursor:pointer;
    position:relative;
    transition:
        color .2s ease,
        opacity .2s ease;
}

.mfsp-tab:hover{
    color:var(--mfsp-title-color);
}

.mfsp-tab.is-active{
    color:var(--mfsp-accent);
}

.mfsp-tab.is-active:after{
    content:"";
    position:absolute;
    right:28%;
    left:28%;
    bottom:-1px;
    height:2px;
    border-radius:999px;
    background:var(--mfsp-accent);
    box-shadow:none;
}

/* النص بدون صندوق خلفي */
.mfsp-panels{
    position:relative;
    padding:28px 10px 38px;
    background:transparent;
}

.mfsp-panel{
    display:none;
    color:var(--mfsp-body-color);
    font-size:var(--mfsp-body-size);
    line-height:2;
    opacity:.94;
}

.mfsp-panel.is-active{
    display:block;
    animation:mfspReveal .26s ease;
}

.mfsp-panel p:first-child{margin-top:0}
.mfsp-panel p:last-child{margin-bottom:0}

.mfsp-panel h2,
.mfsp-panel h3,
.mfsp-panel h4{
    color:var(--mfsp-title-color);
}

@keyframes mfspReveal{
    from{opacity:0;transform:translateY(4px)}
    to{opacity:.94;transform:none}
}

/* Responsive */
@media(max-width:800px){
    .mfsp{margin:32px auto}

    .mfsp-shell{
        border-radius:calc(var(--mfsp-radius) + 2px);
        backdrop-filter:blur(8px);
        -webkit-backdrop-filter:blur(8px);
    }

    .mfsp-heading{
        padding:28px 20px 14px;
    }

    .mfsp-title{
        font-size:clamp(27px,8vw,var(--mfsp-title-size));
    }

    .mfsp-subtitle{
        font-size:clamp(15px,4.2vw,var(--mfsp-body-size));
    }

    .mfsp-layout,
    .mfsp-pos-left .mfsp-layout,
    .mfsp-pos-right .mfsp-layout{
        flex-direction:column;
    }

    .mfsp-media,
    .mfsp-pos-top .mfsp-media,
    .mfsp-pos-bottom .mfsp-media,
    .mfsp-pos-right .mfsp-media,
    .mfsp-pos-left .mfsp-media{
        width:100%;
        flex-basis:auto;
        padding:0 16px;
    }

    .mfsp-slider,
    .mfsp-pos-top .mfsp-slider,
    .mfsp-pos-bottom .mfsp-slider,
    .mfsp-pos-right .mfsp-slider,
    .mfsp-pos-left .mfsp-slider{
        width:min(var(--mfsp-image-width),100%);
        height:auto;
        aspect-ratio:var(--mfsp-image-ratio);
        min-height:1px;
    }

    .mfsp-pos-top .mfsp-content,
    .mfsp-pos-bottom .mfsp-content,
    .mfsp-pos-right .mfsp-content,
    .mfsp-pos-left .mfsp-content{
        margin:12px 16px 0;
        padding-inline-start:0;
        border-inline-start:0;
        border-top:1px solid var(--mfsp-line);
    }

    .mfsp-tabs{
        overflow-x:auto;
        scrollbar-width:none;
    }

    .mfsp-tabs::-webkit-scrollbar{display:none}

    .mfsp-tab{
        min-width:132px;
        flex:0 0 auto;
        padding:16px 12px 14px;
    }

    .mfsp-panels{
        padding:22px 2px 28px;
    }
}


/* ===== v2.6 Homepage refinement ===== */

/* مسافة أوضح لكن بسيطة بين العنوان والوصف */
.mfsp-subtitle{
    margin-top:20px;
}

/* تقليل الفراغ بين المقدمة والصورة في العرض المركزي */
.mfsp-heading{
    padding-bottom:14px;
}
.mfsp-pos-top .mfsp-media,
.mfsp-pos-bottom .mfsp-media{
    padding-top:0;
}


/* تخفيف الخط الطويل قبل التبويبات بدون تغيير شفافية البطاقة */
.mfsp-pos-top .mfsp-content{
    margin-top:6px;
    border-top-color:color-mix(in srgb,var(--mfsp-border) 24%,transparent);
}
.mfsp-tabs{
    border-bottom-color:color-mix(in srgb,var(--mfsp-border) 30%,transparent);
}

/* إعادة بناء الوضع الجانبي ليصلح كقسم رئيسي واسع */
.mfsp-pos-right .mfsp-layout,
.mfsp-pos-left .mfsp-layout{
    min-height:500px;
    align-items:center;
}

.mfsp-pos-right .mfsp-media,
.mfsp-pos-left .mfsp-media{
    flex:0 0 44%;
    padding:34px 34px;
}



.mfsp-pos-right .mfsp-content,
.mfsp-pos-left .mfsp-content{
    flex:1 1 56%;
    align-self:stretch;
    justify-content:center;
    margin:24px 28px 30px;
    padding-inline-start:38px;
    border-inline-start-color:color-mix(in srgb,var(--mfsp-border) 26%,transparent);
}

/* في العرض الجانبي: التبويبات تبقى أفقية ومريحة ولا تضغط النص */
.mfsp-pos-right .mfsp-tabs,
.mfsp-pos-left .mfsp-tabs{
    gap:8px;
}

.mfsp-pos-right .mfsp-tab,
.mfsp-pos-left .mfsp-tab{
    padding:18px 10px 15px;
    white-space:normal;
    line-height:1.45;
}

.mfsp-pos-right .mfsp-panels,
.mfsp-pos-left .mfsp-panels{
    padding:28px 6px 20px;
}

.mfsp-pos-right .mfsp-panel,
.mfsp-pos-left .mfsp-panel{
    max-width:640px;
}

/* الموبايل */
@media(max-width:800px){
    .mfsp-subtitle{margin-top:14px}
    .mfsp-heading{padding-bottom:12px}

    .mfsp-pos-right .mfsp-layout,
    .mfsp-pos-left .mfsp-layout{
        min-height:0;
    }

    .mfsp-pos-right .mfsp-media,
    .mfsp-pos-left .mfsp-media{
        padding:0 16px;
    }

    .mfsp-pos-right .mfsp-content,
    .mfsp-pos-left .mfsp-content{
        margin:12px 16px 0;
        padding-inline-start:0;
        border-inline-start:0;
        border-top:1px solid color-mix(in srgb,var(--mfsp-border) 24%,transparent);
    }

}


/* ===== v2.7 exact requested corrections ===== */

/* مسافة بسيطة وواضحة بين عنوان البطاقة والنص التعريفي */
.mfsp-title{
    margin-bottom:18px !important;
}
.mfsp-subtitle{
    margin-top:0 !important;
}

/*
 * لا نصغّر الصورة عند اختيار يمين/يسار.
 * نفس مساحة العرض المرئية المستخدمة في الوضع العلوي،
 * مع تغيير الموضع فقط.
 */
.mfsp-pos-right .mfsp-media,
.mfsp-pos-left .mfsp-media{
    flex:0 0 52% !important;
    padding:0 28px !important;
    display:flex;
    align-items:center;
    justify-content:center;
}

.mfsp-pos-right .mfsp-slider,
.mfsp-pos-left .mfsp-slider{
    margin:auto;
}

/* نعطي النص بقية المساحة بدون تصغير الصورة نفسها */
.mfsp-pos-right .mfsp-content,
.mfsp-pos-left .mfsp-content{
    flex:1 1 48% !important;
    margin:24px 28px 30px !important;
    padding-inline-start:30px !important;
}

/* على الشاشات الأضيق يعود التخطيط رأسيًا بشكل طبيعي */
@media(max-width:800px){
    .mfsp-title{
        margin-bottom:13px !important;
    }

    .mfsp-pos-right .mfsp-media,
    .mfsp-pos-left .mfsp-media{
        width:100% !important;
        flex-basis:auto !important;
        padding:0 16px !important;
    }


    .mfsp-pos-right .mfsp-content,
    .mfsp-pos-left .mfsp-content{
        flex-basis:auto !important;
        margin:12px 16px 0 !important;
        padding-inline-start:0 !important;
    }
}


/* ===== v2.8 block spacing =====
   The page builder already provides section spacing, so the showcase
   should not add a second large vertical margin of its own.
*/
.mfsp{
    margin:20px auto !important;
}

/* When multiple showcases are rendered consecutively, keep a refined gap. */
.mfsp + .mfsp{
    margin-top:36px !important;
}

@media(max-width:800px){
    .mfsp{
        margin:16px auto !important;
    }
    .mfsp + .mfsp{
        margin-top:26px !important;
    }
}


/* ===== v2.9 explicit per-card spacing ===== */
.mfsp{
    margin-top:var(--mfsp-space-top,12px) !important;
    margin-bottom:var(--mfsp-space-bottom,12px) !important;
}

/* لا نضاعف المسافة تلقائياً بين عنصرين؛ كل بطاقة تتحكم بنفسها */
.mfsp + .mfsp{
    margin-top:var(--mfsp-space-top,12px) !important;
}

/*
 * بعض منشئات Jannah/TieLabs تضيف فراغاً أسفل محتوى البلوك نفسه.
 * عندما يكون البلوك عبارة عن عرض مصفوف، نمنع الهوامش الداخلية الشائعة
 * بدون لمس Padding السكشن الذي قد يستخدمه المستخدم للتخطيط العام.
 */
.block-content > .mfsp:first-child:last-child,
.entry-content > .mfsp:first-child:last-child,
.tie-col-md-12 > .mfsp:first-child:last-child{
    margin-block-start:var(--mfsp-space-top,12px) !important;
    margin-block-end:var(--mfsp-space-bottom,12px) !important;
}

@media(max-width:800px){
    .mfsp{
        margin-top:var(--mfsp-space-top,12px) !important;
        margin-bottom:var(--mfsp-space-bottom,12px) !important;
    }
}

/* ===== v2.11 Tab details link ===== */
.mfsp-panel-copy + .mfsp-details-link{
    margin-top:24px;
}

.mfsp-details-link{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    min-height:48px;
    padding:11px 18px 11px 14px;
    border:1px solid color-mix(in srgb,var(--mfsp-accent) 44%,transparent);
    border-radius:16px;
    color:var(--mfsp-title-color) !important;
    background:
        linear-gradient(135deg,
            color-mix(in srgb,var(--mfsp-accent) 16%,transparent),
            color-mix(in srgb,var(--mfsp-surface) 76%,transparent));
    box-shadow:
        0 10px 28px color-mix(in srgb,var(--mfsp-accent) 10%,transparent),
        inset 0 1px rgba(255,255,255,.05);
    text-decoration:none !important;
    font-size:calc(var(--mfsp-body-size) * .88);
    font-weight:800;
    line-height:1.4;
    overflow:hidden;
    isolation:isolate;
    transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.mfsp-details-link:before{
    content:"";
    position:absolute;
    inset:-2px;
    z-index:-1;
    background:linear-gradient(110deg,transparent 22%,rgba(255,255,255,.16) 48%,transparent 72%);
    transform:translateX(120%);
    transition:transform .7s cubic-bezier(.2,.7,.2,1);
}

.mfsp-details-link-icon{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    flex:0 0 30px;
    border-radius:11px;
    color:#fff;
    background:var(--mfsp-accent);
    box-shadow:0 7px 18px color-mix(in srgb,var(--mfsp-accent) 28%,transparent);
    font-size:18px;
    line-height:1;
    transition:transform .25s ease;
}

.mfsp-details-link:hover,
.mfsp-details-link:focus-visible{
    color:var(--mfsp-title-color) !important;
    border-color:color-mix(in srgb,var(--mfsp-accent) 78%,#fff 8%);
    transform:translateY(-2px);
    box-shadow:
        0 14px 34px color-mix(in srgb,var(--mfsp-accent) 17%,transparent),
        inset 0 1px rgba(255,255,255,.07);
}

.mfsp-details-link:hover:before,
.mfsp-details-link:focus-visible:before{
    transform:translateX(-120%);
}

.mfsp-details-link:hover .mfsp-details-link-icon,
.mfsp-details-link:focus-visible .mfsp-details-link-icon{
    transform:translateX(-3px);
}

.mfsp-details-link:focus-visible{
    outline:2px solid color-mix(in srgb,var(--mfsp-accent) 75%,#fff 15%);
    outline-offset:3px;
}

@media(max-width:800px){
    .mfsp-details-link{
        min-height:45px;
        padding:10px 15px 10px 12px;
        border-radius:14px;
    }
}

@media(prefers-reduced-motion:reduce){
    .mfsp-details-link,
    .mfsp-details-link:before,
    .mfsp-details-link-icon{
        transition:none !important;
    }
}


/* ===== v2.12.3 mobile portrait foundation =====
 * Keep the existing desktop design untouched. On narrow screens, the media
 * box gets a real aspect ratio from a unitless PHP variable. This prevents
 * the zero-height slider bug caused by using px-valued custom properties in
 * aspect-ratio while all slide images are absolutely positioned.
 */
@media (max-width:800px){
    .mfsp{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
        overflow:visible !important;
    }

    .mfsp-shell{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
    }

    .mfsp-layout,
    .mfsp-media,
    .mfsp-content{
        min-width:0 !important;
        max-width:100% !important;
    }

    .mfsp-media,
    .mfsp-pos-top .mfsp-media,
    .mfsp-pos-bottom .mfsp-media,
    .mfsp-pos-right .mfsp-media,
    .mfsp-pos-left .mfsp-media{
        width:100% !important;
        padding-inline:14px !important;
    }

    .mfsp-slider,
    .mfsp-pos-top .mfsp-slider,
    .mfsp-pos-bottom .mfsp-slider,
    .mfsp-pos-right .mfsp-slider,
    .mfsp-pos-left .mfsp-slider{
        width:min(var(--mfsp-image-width),100%) !important;
        max-width:100% !important;
        height:auto !important;
        aspect-ratio:var(--mfsp-image-ratio) !important;
        margin-inline:auto !important;
        overflow:hidden !important;
        border-radius:24px !important;
    }

    .mfsp .mfsp-image{
        width:100% !important;
        height:100% !important;
        min-width:0 !important;
        min-height:0 !important;
        max-width:100% !important;
        max-height:100% !important;
        object-fit:cover !important;
        object-position:center !important;
        border-radius:24px !important;
    }

    .mfsp-heading{
        padding-inline:18px !important;
    }

    .mfsp-pos-top .mfsp-content,
    .mfsp-pos-bottom .mfsp-content,
    .mfsp-pos-right .mfsp-content,
    .mfsp-pos-left .mfsp-content{
        margin-inline:14px !important;
        max-width:calc(100% - 28px) !important;
    }

    .mfsp-tabs{
        width:100% !important;
        max-width:100% !important;
    }

    .mfsp-tab{
        min-width:0 !important;
        flex:1 1 0 !important;
        white-space:normal !important;
        overflow-wrap:anywhere;
    }

    .mfsp-placement-host,
    .mfsp-placement-host.mfsp-placement-center,
    .mfsp-placement-host.mfsp-placement-full{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
    }
}

@media (max-width:480px){
    .mfsp-heading{
        padding:24px 16px 12px !important;
    }

    .mfsp-title{
        font-size:clamp(25px,8vw,var(--mfsp-title-size)) !important;
        line-height:1.35 !important;
    }

    .mfsp-subtitle{
        font-size:clamp(14px,4.1vw,var(--mfsp-body-size)) !important;
        line-height:1.85 !important;
    }

    .mfsp-media,
    .mfsp-pos-top .mfsp-media,
    .mfsp-pos-bottom .mfsp-media,
    .mfsp-pos-right .mfsp-media,
    .mfsp-pos-left .mfsp-media{
        padding-inline:12px !important;
    }

    .mfsp-pos-top .mfsp-content,
    .mfsp-pos-bottom .mfsp-content,
    .mfsp-pos-right .mfsp-content,
    .mfsp-pos-left .mfsp-content{
        margin-inline:12px !important;
        max-width:calc(100% - 24px) !important;
    }

    .mfsp-tab{
        padding:14px 6px 13px !important;
        font-size:clamp(13px,3.7vw,var(--mfsp-tab-size)) !important;
    }

    .mfsp-panels{
        padding:20px 0 26px !important;
    }

    .mfsp-panel{
        font-size:clamp(14px,4vw,var(--mfsp-body-size)) !important;
        line-height:1.9 !important;
    }
}


/* =====================================================================
   v2.12.6 — two card widths only
   normal = fills its existing half-column.
   full   = one card across the whole content row.
   The runtime controller handles legacy page-builder columns; these rules
   only define the card itself and mobile behavior.
   ===================================================================== */
.mfsp{
    box-sizing:border-box !important;
}

.mfsp-card-normal{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
}

.mfsp-card-full{
    width:100% !important;
    max-width:var(--mfsp-max-width) !important;
    min-width:0 !important;
    margin-inline:auto !important;
}

.mfsp-placement-layout-flex{
    flex-wrap:wrap !important;
}

.mfsp-placement-host{
    box-sizing:border-box !important;
    min-width:0 !important;
}

@media (max-width:800px){
    .mfsp,
    .mfsp-card-normal,
    .mfsp-card-full,
    .mfsp-placement-host{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
        transform:none !important;
        margin-inline:0 !important;
    }
}
