.elementor-3946 .elementor-element.elementor-element-309b8be{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;}.elementor-3946 .elementor-element.elementor-element-794fae9{--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;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:20px;}.elementor-3946 .elementor-element.elementor-element-14ff198.elementor-element{--align-self:flex-start;}.elementor-3946 .elementor-element.elementor-element-14ff198 .elementor-icon-box-wrapper{align-items:start;text-align:justify;gap:11px;}.elementor-3946 .elementor-element.elementor-element-14ff198.elementor-view-stacked .elementor-icon{background-color:#36006B;}.elementor-3946 .elementor-element.elementor-element-14ff198.elementor-view-framed .elementor-icon, .elementor-3946 .elementor-element.elementor-element-14ff198.elementor-view-default .elementor-icon{fill:#36006B;color:#36006B;border-color:#36006B;}.elementor-3946 .elementor-element.elementor-element-14ff198 .elementor-icon{font-size:27px;}.elementor-3946 .elementor-element.elementor-element-14ff198 .elementor-icon-box-title, .elementor-3946 .elementor-element.elementor-element-14ff198 .elementor-icon-box-title a{font-size:23px;}.elementor-3946 .elementor-element.elementor-element-bdd0176 .elementor-heading-title{font-size:49px;font-weight:800;}.elementor-3946 .elementor-element.elementor-element-ad8b7c4{text-align:justify;font-weight:500;}.elementor-3946 .elementor-element.elementor-element-d55e86d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:0px;}.elementor-3946 .elementor-element.elementor-element-2f56885 img{border-radius:12px 12px 12px 12px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3946 .elementor-element.elementor-element-794fae9{--width:45%;}.elementor-3946 .elementor-element.elementor-element-d55e86d{--width:45%;}}@media(max-width:767px){.elementor-3946 .elementor-element.elementor-element-309b8be{--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;}}/* Start custom CSS for container, class: .elementor-element-309b8be *//* ==================================================
   HOME ISLAND — ABOUT HERO
   DESKTOP + TABLET + MOBILE
================================================== */


/* ==================================================
   1. کانتینر مادر
================================================== */

.hi-about-hero {
    --hi-about-purple: #7116b5;
    --hi-about-navy: #0b2d53;
    --hi-about-text: #566475;

    position: relative;
    isolation: isolate;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important;
    align-items: center !important;

    width: min(94%, 1500px) !important;
    max-width: 1500px !important;

    margin: 38px auto 50px !important;
    padding: clamp(22px, 2vw, 30px) !important;
    gap: clamp(24px, 2.2vw, 36px) !important;

    direction: rtl;
    box-sizing: border-box;

    background:
        radial-gradient(
            circle at 92% 14%,
            rgba(113, 22, 181, 0.09) 0%,
            rgba(113, 22, 181, 0.025) 31%,
            transparent 56%
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fcf9fd 57%,
            #f7f0fb 100%
        ) !important;

    border: 1px solid rgba(11, 45, 83, 0.075) !important;
    border-radius: 32px !important;

    box-shadow:
        0 22px 55px rgba(11, 45, 83, 0.075),
        inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;

    overflow: hidden !important;
}


/* تمام فرزندان مستقیم کانتینر */
.hi-about-hero > * {
    position: relative;
    z-index: 2;

    min-width: 0 !important;
    box-sizing: border-box;
}


/* المان تزئینی پس‌زمینه */
.hi-about-hero::after {
    content: "";

    position: absolute;
    z-index: 0;

    right: -120px;
    bottom: -145px;

    width: 340px;
    height: 340px;

    border: 54px solid rgba(113, 22, 181, 0.035);
    border-radius: 50%;

    pointer-events: none;
}


/* ==================================================
   2. کانتینر متن سمت راست
================================================== */

.hi-about-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;

    width: 100% !important;

    margin: 0 !important;
    padding: clamp(22px, 2.4vw, 38px) !important;
    gap: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* خط جداکننده بین متن و تصویر */
.hi-about-copy::after {
    content: "";

    position: absolute;

    top: 9%;
    bottom: 9%;
    left: calc(clamp(24px, 2.2vw, 36px) / -2);

    width: 1px;

    background: linear-gradient(
        to bottom,
        transparent,
        rgba(113, 22, 181, 0.17),
        transparent
    );

    pointer-events: none;
}


/* ==================================================
   3. برچسب «درباره ما»
================================================== */

.hi-about-label {
    position: relative;

    width: fit-content !important;

    margin: 0 0 26px !important;
    padding: 0 25px 0 0 !important;
}

.hi-about-label .elementor-heading-title {
    margin: 0 !important;

    color: #26384e !important;
    line-height: 1.6 !important;
}


/* نقطه بنفش برچسب */
.hi-about-label::before {
    content: "";

    position: absolute;

    top: 50%;
    right: 0;

    width: 10px;
    height: 10px;

    background: var(--hi-about-purple);
    background-clip: padding-box;

    border: 5px solid rgba(113, 22, 181, 0.12);
    border-radius: 50%;

    box-shadow: 0 0 18px rgba(113, 22, 181, 0.24);

    transform: translateY(-50%);
}


/* خط ظریف زیر برچسب */
.hi-about-label::after {
    content: "";

    position: absolute;

    right: 25px;
    bottom: -10px;

    width: 55px;
    height: 1px;

    background: linear-gradient(
        90deg,
        var(--hi-about-purple),
        rgba(113, 22, 181, 0)
    );
}


/* ==================================================
   4. عنوان اصلی
================================================== */

.hi-about-title {
    width: 100% !important;

    margin: 0 0 8px !important;
}

.hi-about-title .elementor-heading-title {
    margin: 0 !important;

    color: var(--hi-about-navy) !important;
    line-height: 1.35 !important;
    letter-spacing: -0.4px;

    text-align: right !important;

    text-shadow: 0 5px 22px rgba(11, 45, 83, 0.06);
}


/* ==================================================
   5. زیرعنوان
================================================== */

.hi-about-subtitle {
    width: 100% !important;

    margin: 0 0 23px !important;
}

.hi-about-subtitle .elementor-heading-title {
    margin: 0 !important;

    color: var(--hi-about-purple) !important;
    line-height: 1.55 !important;
    text-align: right !important;
}


/* ==================================================
   6. متن توضیحات
================================================== */

.hi-about-description {
    width: 100% !important;

    margin: 0 !important;
    padding: 20px 22px !important;

    background: rgba(255, 255, 255, 0.50) !important;

    border: 1px solid rgba(11, 45, 83, 0.055) !important;
    border-radius: 18px !important;

    box-shadow:
        0 9px 28px rgba(11, 45, 83, 0.035),
        inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;

    box-sizing: border-box;
}

.hi-about-description > .elementor-widget-container {
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* پاراگراف‌ها در تمام دستگاه‌ها Justify */
.hi-about-description p {
    margin: 0 0 16px !important;

    color: var(--hi-about-text) !important;

    line-height: 2.05 !important;
    text-align: justify !important;
    text-align-last: right !important;

    direction: rtl;
    word-spacing: normal;
    overflow-wrap: break-word;
}

.hi-about-description p:last-child {
    margin-bottom: 0 !important;
}


/* اگر محتوا مستقیماً داخل کانتینر ویجت باشد */
.hi-about-description .elementor-widget-container {
    color: var(--hi-about-text) !important;
    line-height: 2.05 !important;
}


/* ==================================================
   7. کانتینر تصویر سمت چپ
================================================== */

.hi-about-media {
    grid-column: 1 !important;
    grid-row: 1 !important;

    position: relative;

    display: block !important;
    align-self: center !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #241629 !important;

    border: 1px solid rgba(113, 22, 181, 0.13) !important;
    border-radius: 25px !important;

    box-shadow:
        0 18px 38px rgba(32, 16, 40, 0.17) !important;

    overflow: hidden !important;
}


/* نور بنفش کنترل‌شده روی تصویر */
.hi-about-media::after {
    content: "";

    position: absolute;
    z-index: 2;
    inset: 0;

    background: linear-gradient(
        145deg,
        rgba(74, 22, 96, 0.08),
        transparent 46%,
        rgba(10, 4, 15, 0.14)
    );

    pointer-events: none;
}


/* ==================================================
   8. ویجت تصویر
================================================== */

.hi-about-image {
    display: block !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

.hi-about-image > .elementor-widget-container,
.hi-about-image a {
    display: block !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}


/* تصویر با نسبت طبیعی خودش */
.hi-about-image img {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;

    object-fit: contain !important;
    object-position: center !important;

    border: 0 !important;
    border-radius: 0 !important;

    transition:
        transform 0.7s cubic-bezier(.2, .7, .2, 1),
        filter 0.7s ease !important;
}


/* هاور دسکتاپ */
@media (hover: hover) {

    .hi-about-media:hover .hi-about-image img {
        transform: scale(1.02);
        filter: contrast(1.02) saturate(1.04);
    }
}


/* ==================================================
   9. تبلت
================================================== */

@media (min-width: 768px) and (max-width: 1024px) {

    .hi-about-hero {
        grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr) !important;

        width: 95% !important;

        margin: 28px auto 40px !important;
        padding: 21px !important;
        gap: 23px !important;

        border-radius: 26px !important;
    }

    .hi-about-copy {
        padding: 23px 18px !important;
    }

    .hi-about-copy::after {
        left: -12px;
    }

    .hi-about-description {
        padding: 17px 18px !important;
        border-radius: 16px !important;
    }

    .hi-about-description p {
        line-height: 2 !important;
    }

    .hi-about-media {
        border-radius: 21px !important;
    }
}


/* ==================================================
   10. موبایل
================================================== */

@media (max-width: 767px) {

    .hi-about-hero {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        align-items: stretch !important;

        width: calc(100% - 24px) !important;

        margin: 18px auto 30px !important;
        padding: 12px !important;
        gap: 18px !important;

        border-radius: 22px !important;
    }


    /* متن در ردیف اول */
    .hi-about-copy {
        grid-column: 1 !important;
        grid-row: 1 !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 24px 12px 8px !important;

        align-items: stretch !important;
    }

    .hi-about-copy::after {
        content: none !important;
    }


    /* برچسب در موبایل */
    .hi-about-label {
        margin: 0 auto 23px !important;
    }


    /* تیترها وسط‌چین */
    .hi-about-title,
    .hi-about-subtitle {
        width: 100% !important;
    }

    .hi-about-title {
        margin-bottom: 7px !important;
    }

    .hi-about-subtitle {
        margin-bottom: 18px !important;
    }

    .hi-about-title .elementor-heading-title,
    .hi-about-subtitle .elementor-heading-title {
        text-align: center !important;
    }


    /* توضیحات موبایل */
    .hi-about-description {
        width: 100% !important;

        padding: 16px 15px !important;

        border-radius: 15px !important;
    }

    .hi-about-description p {
        line-height: 2 !important;

        text-align: justify !important;
        text-align-last: right !important;
    }


    /* تصویر در ردیف دوم و پایین متن */
    .hi-about-media {
        grid-column: 1 !important;
        grid-row: 2 !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;

        border-radius: 17px !important;
    }

    .hi-about-image,
    .hi-about-image > .elementor-widget-container,
    .hi-about-image a,
    .hi-about-image img {
        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}/* End custom CSS */