/*
Theme Name: Technoposhtiban Child
Template: Technoposhtiban
Version: 7.5
Author:	Khaleghparast
Theme URI: #/
Author URI: #/
*/

/*Add your own styles here:*/
@font-face {
    font-family: 'YekanBakhFaNum';
    src: url('./fonts/iranyekanfanum/YekanBakhFaNum-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'YekanBakhFaNum';
    src: url('./fonts/iranyekanfanum/YekanBakhFaNum-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'YekanBakhFaNum';
    src: url('./fonts/iranyekanfanum/YekanBakhFaNum-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
.w-nav-title,
a.w-btn {
    font-family: 'YekanBakhFaNum', sans-serif !important;
}
.home .l-subheader.at_middle{
    margin-top: -14px;
}
.tp-head-service {
    display:flex;
    align-items:center;
    gap:9px;
    direction:rtl;
    white-space:nowrap;
}

.tp-head-service__icon {
    width:31px;
    height:31px;
    flex:0 0 31px;

    fill:none;
    stroke:#FEBD3F;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;

    transition:transform .25s ease,filter .25s ease;
}

.tp-head-service__text {
    display:flex;
    flex-direction:column;
    gap:2px;
    line-height:1.2;
}

.tp-head-service__text strong {
    color:#fff;
    font-size:16px;
    font-weight:600;
}

.tp-head-service__text small {
    color:rgba(255,255,255,.68);
    font-size:13px;
	    padding-top: 5px;
}
.l-header .w-search.elm_in_header input {
    background: #F4F8FC !important;
    color: #58708A !important;
	    border-radius: 15px;
}
button.w-search-form-btn.w-btn{
    color: var(--color-header-top-transparent-bg) !important;
}
.l-subheader.at_top{
    border-bottom-right-radius: 50px;
}

.home .at_middle .l-subheader-h {
    background: var(--color-header-top-bg) !important;
    border-radius: 15px;
	    padding: 0 20px;
}


.l-header .w-nav-list.level_1 > .w-nav-item > .w-nav-anchor.level_1 {
    min-height: 42px;
    border-radius: 10px;
    transition: background-color .25s ease, color .25s ease,box-shadow .25s ease,transform .25s ease;
}
.part1 .l-section-h{
	padding-top:36px !important;
}
/* =========================================
   Active Menu Item
   ========================================= */

.l-header .w-nav-list.level_1 > .w-nav-item.current-menu-item > .w-nav-anchor.level_1,
.l-header .w-nav-list.level_1 > .w-nav-item.current_page_item > .w-nav-anchor.level_1 {
    background: #073B76 !important;

    color: #FFFFFF !important;

    box-shadow:
        0 5px 14px rgba(7, 59, 118, .20);

    transform: none;
}
/* Active + Hover */

.l-header .w-nav-list.level_1 > .w-nav-item.current-menu-item:hover > .w-nav-anchor.level_1,
.l-header .w-nav-list.level_1 > .w-nav-item.current_page_item:hover > .w-nav-anchor.level_1 {
    background: #FEBD3F !important;

    color: #073B76 !important;

    box-shadow:
        0 5px 14px rgba(254, 189, 63, .20);

    transform: translateY(-1px);
}
.l-header .w-nav-list.level_1 > .w-nav-item > .w-nav-list.level_2 {
    border-radius: 12px;
    box-shadow:0 12px 30px rgba(7, 59, 118, .16);
	margin-top: 16px;

}
/* =========================================================
   TECHNOPOSHTIBAN
   HERO — FINAL LAYOUT
   ========================================================= */
.tp-hero {
    position: relative;

    width: 100%;

    min-height: 620px;

    overflow: hidden;

    direction: ltr;

    background-color: #073B76;

    background-image:
       url('../../uploads/2026/10/hero33.webp') !important;

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center center;
}


/* =========================================================
   GRADIENT
   ========================================================= */
.tp-hero__overlay {

    position: absolute;

    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(7,59,118,1) 0%,
            rgba(7,59,118,.98) 17%,
            rgba(7,59,118,.90) 29%,
            rgba(7,59,118,.70) 40%,
            rgba(7,59,118,.43) 51%,
            rgba(7,59,118,.20) 61%,
            rgba(7,59,118,.06) 70%,
            rgba(7,59,118,0) 79%
        );
}



/* =========================================================
   CONTAINER
   ========================================================= */

.tp-hero__container {

    position: relative;

    z-index: 3;

    width: 100%;

    max-width: 1440px;

    min-height: 620px;

    margin-inline: auto;

    padding-inline: 24px;

    display: flex;

    align-items: center;

    direction: ltr;

	  }

/* =========================================================
   CONTENT
   ========================================================= */

.tp-hero__content {

    position: relative;

    z-index: 5;

    width: 52%;

    margin-right: auto;

    padding-top: 60px;
    padding-bottom: 20px;

    display: flex;

    flex-direction: column;

    align-items: self-end;

    text-align: left;

    direction: rtl;
}


/* =========================================================
   BADGE
   ========================================================= */

.tp-hero__badge {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    height: 34px;

    padding: 0 13px;

    margin-bottom: 14px;

    color: #fff;

    background:
        rgba(7,59,118,.42);

    border:
        1px solid rgba(254,189,63,.55);

    border-radius: 999px;

    font-size: 12px;

    font-weight: 600;

    white-space: nowrap;
}


.tp-hero__badge-icon {

    width: 20px;
    height: 20px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    color: var(--tp-gold);
}


.tp-hero__badge-icon svg {

    width: 18px;
    height: 18px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   TITLE
   ========================================================= */

.tp-hero__title {

    margin: 0;

    max-width: 600px;

    color: #fff;

    font-size: clamp(38px, 3.7vw, 55px);

    line-height: 1.2;

    font-weight: 900;

    letter-spacing: -1px;
}


.tp-hero__title span {

    display: block;

    margin-top: 3px;

    color: var(--tp-gold);
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.tp-hero__description {

    margin: 12px 0 0;

    color: rgba(255,255,255,.90);

    font-size: 16px;

    line-height: 1.8;

    font-weight: 500;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.tp-hero__actions {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-top: 20px;
}


.tp-hero__actions .tp-gold-button {

    min-width: 220px;

    height: 58px;

    font-size: 15px;
}


.tp-hero__actions .tp-outline-button {

    min-width: 185px;

    height: 58px;

    font-size: 15px;
}


/* =========================================================
   TRUST
   ========================================================= */

.tp-hero__trust {

    max-width: 550px;

    margin: 14px 0 0;

    color: rgba(255,255,255,.70);



    line-height: 1.9;

    font-weight: 400;
}




/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 993px) {

    .tp-hero {

        min-height: 470px;

        /*
           کمی به سمت راست تا تکنسین
           و ون در جای مناسب باقی بمانند
        */
        background-position: center center;
    }

    .tp-hero__container {

        min-height: 470px;
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-hero {

        min-height: 560px;

        background-position: 62% center;
    }

    .tp-hero__container {

        min-height: 560px;
    }

    .tp-hero__overlay {

        background:
            linear-gradient(
                90deg,
                rgba(7,59,118,.98) 0%,
                rgba(7,59,118,.90) 30%,
                rgba(7,59,118,.65) 58%,
                rgba(7,59,118,.30) 100%
            );
    }

    .tp-hero__content {

        width: 62%;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-hero {

        min-height: 650px;

        background-position: 65% center;
    }

    .tp-hero__container {

        min-height: 650px;

        padding-inline: 18px;
    }

    .tp-hero__overlay {

        background:
            linear-gradient(
                90deg,
                rgba(7,59,118,.98) 0%,
                rgba(7,59,118,.91) 42%,
                rgba(7,59,118,.68) 72%,
                rgba(7,59,118,.38) 100%
            );
    }

    .tp-hero__content {

        width: 100%;

        margin-right: 0;

        align-items: center;

        text-align: center;
    }

    .tp-hero__title {

        font-size: 31px;
    }

    .tp-hero__description {

        font-size: 14px;
    }

    .tp-hero__actions {

        width: 100%;

        flex-direction: column;
    }

    .tp-hero__actions .tp-gold-button,
    .tp-hero__actions .tp-outline-button {

        width: 100%;

        max-width: 320px;

        min-width: 0;
    }
	    .tp-hero__actions .tp-outline-button {
        background: rgba(7, 59, 118, .72);
        border: 1px solid rgba(255, 255, 255, .55);

        color: #FFFFFF;

        box-shadow:
            0 6px 18px rgba(0, 0, 0, .16),
            inset 0 0 0 1px rgba(255, 255, 255, .08);

        backdrop-filter: blur(5px);
        -webkit-backdrop-filter: blur(5px);
    }

    .tp-hero__actions .tp-outline-button__text {
        color: #FFFFFF;
    }

    .tp-hero__actions .tp-outline-button__icon {
        color: #FEBD3F;
    }

    .tp-hero__actions .tp-outline-button:hover {
        background: #FEBD3F;
        border-color: #FEBD3F;
        color: #073B76;
    }

    .tp-hero__actions .tp-outline-button:hover .tp-outline-button__text {
        color: #073B76;
    }

    .tp-hero__actions .tp-outline-button:hover .tp-outline-button__icon {
        color: #073B76;
    }
}

/* =========================================================
   Brand
   ========================================================= */
/* =========================================================
   TECHNOPOSHTIBAN — BRANDS MARQUEE
   ========================================================= */
.home .tp-brands{
	    margin: -32px auto -32px !important;
}
.tp-brands {
    position: relative;
    z-index: 20;

    width: calc(100% - 48px);
    max-width: 1440px;

    height: 64px;



    overflow: hidden;

    background: #F4F8FC;

    border: 1px solid rgba(7,59,118,.08);

    border-radius: 16px;

    box-shadow:
        0 8px 24px rgba(7,59,118,.10);

    direction: ltr;
}


/* =========================================================
   VIEWPORT
   ========================================================= */

.tp-brands__viewport {
    width: 100%;
    height: 100%;

    overflow: hidden;

    display: flex;
    align-items: center;

    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 7%,
        #000 93%,
        transparent 100%
    );

    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 7%,
        #000 93%,
        transparent 100%
    );
}


/* =========================================================
   MOVING TRACK
   ========================================================= */
.tp-brands__track {
    display: flex;
    align-items: center;

    width: max-content;
    height: 100%;

    flex-shrink: 0;

    animation: tp-brands-scroll 42s linear infinite;

    will-change: transform;
}


/* =========================================================
   BRAND SPRITE
   ========================================================= */

.tp-brands__logos {
    flex: 0 0 auto;

    height: 30px;

    display: flex;
    align-items: center;

    padding-right: 10px;
}


.tp-brands__logos img {
    display: block;

    width: auto;
    height: 30px;

    max-width: none;

    object-fit: contain;
}


/* =========================================================
   CONTINUOUS LOOP
   ========================================================= */

@keyframes tp-brands-scroll {

    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-33.333333%);
    }
}


/* =========================================================
   PAUSE ON HOVER
   ========================================================= */

.tp-brands:hover .tp-brands__track {
    animation-play-state: paused;
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */




/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-brands {
        width: calc(100% - 32px);

        height: 60px;

        border-radius: 14px;
    }

    .tp-brands__logos {
        height: 27px;
    }

    .tp-brands__logos img {
        height: 27px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 576px) {

    .tp-brands {
        width: calc(100% - 24px);

        height: 56px;

        border-radius: 12px;
    }

    .tp-brands__logos img {
        height: 25px;
    }
}






/* =========================================================
   TECHNOPOSHTIBAN
   HERO STATS / TEHRAN SECTION
   ========================================================= */

.tp-hero-stats {
    position: relative;

    width: 100%;

    min-height: 165px;
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #073B76 0%,
            #052F60 100%
        );

    direction: rtl;
    padding-top: 20px;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.tp-hero-stats__container {
    position: relative;

    width: 100%;
    max-width: 1440px;

     min-height: 165px;

    margin-inline: auto;

    padding: 22px 24px;

    display: flex;

    align-items: center;

    direction: rtl;
}


/* =========================================================
   STATS
   ========================================================= */

.tp-hero-stats__items {
    position: relative;

    z-index: 3;

    width: 78%;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    align-items: center;
}


/* =========================================================
   STAT
   ========================================================= */

.tp-stat {
    min-height: 82px;

    display: flex;

    align-items: center;

    gap: 12px;

    padding-inline: 20px;

    border-left:
        1px solid rgba(211,224,241,.14);
}


.tp-stat:last-child {
    border-left: 0;
}


/* =========================================================
   ICON
   ========================================================= */

.tp-stat__icon {
    width: 48px;
    height: 48px;

    flex: 0 0 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(254,189,63,.35);

    border-radius: 50%;

    color: #FEBD3F;

    background:
        rgba(7,59,118,.45);
}


.tp-stat__icon svg {
    width: 24px;
    height: 24px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   TEXT
   ========================================================= */

.tp-stat__content {
    display: flex;

    flex-direction: column;

    gap: 2px;

    line-height: 1.35;
}


.tp-stat__content strong {
    color: #FEBD3F;

    font-size: 17px;

    font-weight: 900;
}


.tp-stat__content span {
    color: #fff;

    font-size: 13px;

    font-weight: 700;
}


.tp-stat__content small {
    color: rgba(255,255,255,.55);

    font-size: 12px;

    font-weight: 400;
}


/* =========================================================
   TEHRAN IMAGE
   ========================================================= */
.tp-hero-stats__city {
    position: absolute;

    left: 0;
    bottom: 0;

width: 390px;
    height: 165px;

    z-index: 1;

    pointer-events: none;

    overflow: hidden;
}


.tp-hero-stats__city img {
    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;
    height: 100%;

    display: block;

    object-fit: contain;
    object-position: left bottom;

    opacity: .95;

    filter:
        brightness(1.45)
        saturate(1.35)
        contrast(1.08);

    filter:
    brightness(1.55)
    saturate(1.4)
    contrast(1.08)
    drop-shadow(0 0 6px rgba(211,224,241,.4))
    drop-shadow(0 0 15px rgba(45,127,249,.22));

    mask-image:
        linear-gradient(
            90deg,
            #000 0%,
            #000 55%,
            transparent 100%
        );

    -webkit-mask-image:
        linear-gradient(
            90deg,
            #000 0%,
            #000 55%,
            transparent 100%
        );
}


.tp-hero-stats__city-text {
    position: absolute;

    left: 38px;
    top: 45px;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: 2px;

    z-index: 2;
}


.tp-hero-stats__city-text strong {
    color: #fff;

    font-size: 20px;

    font-weight: 900;
}


.tp-hero-stats__city-text span {
    color: rgba(255,255,255,.65);

    font-size: 11px;
}





/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-hero-stats__items {
        width: 100%;
    }

    .tp-hero-stats__city {
        display: none;
    }

    .tp-stat {
        padding-inline: 10px;
    }

    .tp-stat__icon {
        width: 42px;
        height: 42px;

        flex-basis: 42px;
    }

    .tp-stat__content strong {
        font-size: 15px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .tp-hero-stats {
        min-height: auto;
    }

    .tp-hero-stats__container {
        min-height: auto;

        padding: 24px 18px;
    }

    .tp-hero-stats__items {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        row-gap: 20px;
    }

    .tp-stat {
        border-left: 0;

        padding: 0;

        min-height: 60px;
    }

    .tp-stat__icon {
        width: 40px;
        height: 40px;

        flex-basis: 40px;
    }

    .tp-stat__content strong {
        font-size: 14px;
    }


}

/******************************************part2*******************************/


/* =========================================================
   TECHNOPOSHTIBAN — SERVICES HEADING
   ========================================================= */

.tp-services-heading {
    width: 100%;
    max-width: 760px;
    margin: 0 auto 42px;

    text-align: center;
    direction: rtl;
}

.tp-services-heading__label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 8px;


    font-size: 14px;
    font-weight: 800;
    line-height: 1.5;
	    padding: 7px 14px;
    border-radius: 30px;
    background: rgba(211, 224, 241, .55);
    color: #073B76;
}

.tp-services-heading__tool {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #FEBD3F;
}

.tp-services-heading__tool svg {
    width: 100%;
    height: 100%;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-services-heading__title {
    margin: 0 0 12px;
    padding: 0;
    color: #073B76;

    font-size: 36px;
    font-weight: 900;
    line-height: 1.45;
}

.tp-services-heading__title span {
    color: #FEBD3F;
}

.tp-services-heading__description {
    max-width: 650px;
    margin: 0 auto;

    color: #58708A;

    font-size: 15px;
    font-weight: 500;
    line-height: 2;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-services-heading {
        margin-bottom: 28px;
        padding-inline: 18px;
    }

    .tp-services-heading__label {
        gap: 6px;
        margin-bottom: 7px;

        font-size: 12px;
    }

    .tp-services-heading__tool {
        width: 21px;
        height: 21px;
    }

    .tp-services-heading__title {
        margin-bottom: 8px;
        font-size: 27px;
    }

    .tp-services-heading__description {
        font-size: 13px;
        line-height: 1.9;
    }
}
/* =========================================================
   TECHNOPOSHTIBAN — SERVICE CARD
   ========================================================= */

/* =========================================================
   TECHNOPOSHTIBAN
   SERVICES CARD — FINAL RTL
   ========================================================= */

.tp-service-card {
    position: relative;

    width: 100%;
    height: 250px;

    display: grid;

    /*
       سمت چپ = محتوا
       سمت راست = تصویر
    */
    grid-template-columns: minmax(0, 1fr) 145px;
    grid-template-areas: "content visual";

    align-items: center;

    padding: 28px 26px;

    background:
        linear-gradient(
            135deg,
            #FFFFFF 0%,
            #F8FBFF 100%
        );

    border: 1px solid rgba(45, 127, 249, .20);

    border-radius: 22px;

    box-sizing: border-box;

    /*
       خود Grid را LTR نگه می‌داریم
       تا جای ستون‌ها دقیق و قابل کنترل باشد.
    */
    direction: ltr;

    overflow: hidden;

    box-shadow:
        0 10px 28px rgba(7, 59, 118, .07);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* =========================================================
   NUMBER
   ========================================================= */

.tp-service-card__number {
    position: absolute;

    top: 20px;
    right: 25px;

    color: #A8C9F5;

    font-size: 24px;
    font-weight: 800;

    line-height: 1;

    direction: rtl;

    z-index: 5;
}


/* =========================================================
   CONTENT
   ========================================================= */

.tp-service-card__content {
    grid-area: content;
padding-right: 10px;
    width: 100%;

    direction: rtl;

    text-align: right;

    align-self: center;

    position: relative;
    z-index: 3;
}


.tp-service-card__title {
    margin: 0 0 11px;

    color: #073B76;

    font-size: 19px;
    font-weight: 900;

    line-height: 1.5;
}


.tp-service-card__description {
    max-width: 230px;

    margin: 0 0 18px;

    color: #58708A;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.9;
}


/* =========================================================
   LINK
   ========================================================= */

.tp-service-card__link {
    display: inline-flex;

    align-items: center;

    flex-direction: row;

    gap: 9px;

    direction: rtl;

    color: #073B76;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;

    white-space: nowrap;

    transition:
        gap .3s ease,
        color .3s ease;
}


.tp-service-card__link-text {
    display: block;
}


.tp-service-card__link-icon {
    width: 36px;
    height: 36px;

    flex: 0 0 36px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #1261A8;

    color: #FFFFFF;

    transition:
        background-color .3s ease,
        transform .3s ease;
}


.tp-service-card__link-icon svg {
    width: 17px;
    height: 17px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   VISUAL
   ========================================================= */

.tp-service-card__visual {
    grid-area: visual;

    width: 145px;
    height: 180px;

    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    direction: ltr;

    z-index: 2;
}


/* دایره بزرگ */
.tp-service-card__visual::before {
    content: "";

    position: absolute;

    width: 145px;
    height: 145px;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    background: #EEF5FC;

    border-radius:
        58% 42% 64% 36%
        /
        42% 58% 38% 62%;

    box-shadow:
        0 10px 28px rgba(45,127,249,.07);

    z-index: -1;
}


/* دایره کوچک */

.tp-service-card__visual::after {
       content: "";

    position: absolute;

    width: 105px;
    height: 82px;

    top: 18px;
    right: 5px;

    background: rgba(211,224,241,.48);

    border-radius:
        36% 64% 48% 52%
        /
        60% 38% 62% 40%;

    transform: rotate(-12deg);

    z-index: -2;
}


/* SVG دستگاه */

.tp-service-card__visual svg {
    width: 82px;
    height: 82px;

    display: block;

    position: relative;

    z-index: 3;

    overflow: visible;

    color: #1261A8;

    fill: none;

    stroke: currentColor;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition:
        transform .35s ease,
        color .35s ease;
}


/* =========================================================
   HOVER
   ========================================================= */

.tp-service-card:hover {
    transform: translateY(-6px);

    border-color: rgba(45, 127, 249, .35);

    box-shadow:
        0 18px 38px rgba(7, 59, 118, .12);
}


.tp-service-card:hover
.tp-service-card__visual svg {
    transform: scale(1.07);

    color: #073B76;
}


.tp-service-card:hover
.tp-service-card__link {
    color: #1261A8;

    gap: 12px;
}


.tp-service-card:hover
.tp-service-card__link-icon {
    background: #FEBD3F;

    color: #073B76;

    transform: translateX(-3px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-service-card {
        height: 235px;

        grid-template-columns:
            minmax(0, 1fr)
            125px;

        padding: 24px 20px;
    }


    .tp-service-card__visual {
        width: 125px;
        height: 165px;
    }


    .tp-service-card__visual::before {
        width: 125px;
        height: 125px;
    }


    .tp-service-card__visual::after {
        width: 62px;
        height: 62px;
    }


    .tp-service-card__visual svg {
        width: 70px;
        height: 70px;
    }


    .tp-service-card__title {
        font-size: 17px;
    }


    .tp-service-card__description {
        max-width: 200px;

        font-size: 11px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-service-card {
        height: 220px;

        grid-template-columns:
            minmax(0, 1fr)
            110px;

        padding: 22px 18px;

        border-radius: 18px;
    }


    .tp-service-card__number {
        top: 16px;
        left: 18px;

        font-size: 20px;
    }


    .tp-service-card__visual {
        width: 110px;
        height: 150px;
    }


    .tp-service-card__visual::before {
        width: 105px;
        height: 105px;
    }


    .tp-service-card__visual::after {
        width: 55px;
        height: 55px;
    }


    .tp-service-card__visual svg {
        width: 62px;
        height: 62px;
    }


    .tp-service-card__title {
        margin-bottom: 7px;

        font-size: 16px;
    }


    .tp-service-card__description {


        margin-bottom: 13px;

        font-size: 13px;

        line-height: 1.8;
    }


    .tp-service-card__link {


        gap: 7px;
    }


    .tp-service-card__link-icon {
        width: 32px;
        height: 32px;

        flex-basis: 32px;
    }


    .tp-service-card__link-icon svg {
        width: 15px;
        height: 15px;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .tp-service-card {
        height: 205px;

        grid-template-columns:
            minmax(0, 1fr)
            95px;

        padding: 18px 15px;
    }


    .tp-service-card__visual {
        width: 95px;
        height: 135px;
    }


    .tp-service-card__visual::before {
        width: 92px;
        height: 92px;
    }


    .tp-service-card__visual::after {
        width: 48px;
        height: 48px;
    }


    .tp-service-card__visual svg {
        width: 55px;
        height: 55px;
    }


    .tp-service-card__title {
        font-size: 15px;
    }


    .tp-service-card__description {
        max-width: 150px;

    }
}
/* =========================================================
   TECHNO POSHTIBAN
   Side By Side Refrigerator Icon
   SVG Design System v1
========================================================= */

.techno-service-icon {
    --tp-navy: #143F72;
    --tp-blue: #2D7FF9;
    --tp-light-blue: #DCEBFA;
    --tp-bg: #F8FBFF;
    --tp-border: #B8CFE7;

    width: 90px;
    height: 90px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--tp-navy);

    transition:
        transform .35s ease,
        filter .35s ease;
}

.techno-service-icon svg {
    width: 100%;
    height: 100%;

    display: block;
    overflow: visible;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition: color .35s ease;
}


/* =========================================================
   بدنه
========================================================= */

.techno-side-by-side .machine-body {
    fill: var(--tp-bg);
    stroke: currentColor;
    stroke-width: .8;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   دو درب اصلی
========================================================= */

.techno-side-by-side .door {
    fill: #F8FBFF;
    stroke: currentColor;
    stroke-width: .7;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   فضای داخلی
========================================================= */

.techno-side-by-side .inner-space {
    fill: var(--tp-light-blue);
    stroke: var(--tp-border);
    stroke-width: .5;

    transition:
        fill .35s ease;
}


/* =========================================================
   طبقات
========================================================= */

.techno-side-by-side .shelf {
    stroke: var(--tp-navy);
    stroke-width: .5;

    opacity: .78;
}


/* =========================================================
   کشوها
========================================================= */

.techno-side-by-side .drawer {
    fill: #E8F2FC;
    stroke: var(--tp-border);
    stroke-width: .45;

    transition:
        fill .35s ease;
}


/* =========================================================
   مواد غذایی
========================================================= */

.techno-side-by-side .food {
    fill: var(--tp-blue);
    opacity: .72;

    transition:
        fill .35s ease,
        opacity .35s ease;
}

.techno-side-by-side .food-light {
    fill: #8FC2F5;
    opacity: .85;
}


/* =========================================================
   دستگیره‌ها
========================================================= */

.techno-side-by-side .handle {
    fill: #F8FAFC;
    stroke: currentColor;
    stroke-width: .6;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   جریان هوای سرد
========================================================= */

.techno-side-by-side .cold-air {
    fill: none;
    stroke: #2D7FF9;
    stroke-width: .42;

    opacity: .65;

    transform-box: fill-box;
    transform-origin: center;

    transition:
        stroke .35s ease,
        opacity .35s ease;
}


/* =========================================================
   کریستال‌های سرما
========================================================= */

.techno-side-by-side .snowflake {
    fill: none;
    stroke: #2D7FF9;
    stroke-width: .35;

    opacity: .72;

    transform-box: fill-box;
    transform-origin: center;
}


/* =========================================================
   انیمیشن جریان هوای سرد
========================================================= */

@keyframes techno-sbs-air {

    0% {
        transform: translateY(0);
        opacity: .25;
    }

    50% {
        transform: translateY(-1px);
        opacity: .9;
    }

    100% {
        transform: translateY(-2px);
        opacity: .25;
    }

}


/* =========================================================
   انیمیشن کریستال
========================================================= */

@keyframes techno-sbs-snow {

    0% {
        transform: translateY(0) rotate(0deg);
    }

    50% {
        transform: translateY(-1px) rotate(10deg);
    }

    100% {
        transform: translateY(0) rotate(0deg);
    }

}


/* =========================================================
   Hover Animation
========================================================= */

.techno-service-icon:hover
.techno-side-by-side .cold-air {

    animation:
        techno-sbs-air 1.8s ease-in-out infinite;
}


.techno-service-icon:hover
.techno-side-by-side .snowflake {

    animation:
        techno-sbs-snow 2s ease-in-out infinite;
}


/* =========================================================
   Hover اصلی
========================================================= */

.techno-service-icon:hover {

    color: var(--tp-blue);

    transform: translateY(-3px);
}


/* بدنه */

.techno-service-icon:hover
.techno-side-by-side .machine-body {

    fill: #FFFFFF;
}


/* فضای داخلی */

.techno-service-icon:hover
.techno-side-by-side .inner-space {

    fill: #D5EBFF;
}


/* مواد غذایی */

.techno-service-icon:hover
.techno-side-by-side .food {

    fill: #1597F5;
    opacity: .92;
}


/* جریان هوا */

.techno-service-icon:hover
.techno-side-by-side .cold-air {

    stroke: #1597F5;
    opacity: 1;
}


/* کریستال */

.techno-service-icon:hover
.techno-side-by-side .snowflake {

    stroke: #2D7FF9;
    opacity: 1;
}


/* =========================================================
   Accessibility
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .techno-service-icon,
    .techno-service-icon * {

        animation: none !important;
        transition: none !important;

    }

}

/*refrigartor svg*/
/* =========================================================
   TECHNO POSHTIBAN
   Refrigerator Icon
   SVG Design System v1
========================================================= */

.techno-service-icon {
    --tp-navy: #143F72;
    --tp-blue: #2D7FF9;
    --tp-light-blue: #DCEBFA;
    --tp-bg: #F8FBFF;
    --tp-border: #B8CFE7;

    width: 90px;
    height: 90px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--tp-navy);

    transition:
        transform .35s ease,
        filter .35s ease;
}

.techno-service-icon svg {
    width: 100%;
    height: 100%;

    display: block;
    overflow: visible;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition: color .35s ease;
}


/* =========================================================
   بدنه اصلی
========================================================= */

.techno-refrigerator .machine-body {
    fill: var(--tp-bg);
    stroke: currentColor;
    stroke-width: .8;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   درب‌ها
========================================================= */

.techno-refrigerator .door {
    fill: #F8FBFF;
    stroke: currentColor;
    stroke-width: .7;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   فضای داخلی
========================================================= */

.techno-refrigerator .inner-space {
    fill: var(--tp-light-blue);
    stroke: var(--tp-border);
    stroke-width: .55;

    transition:
        fill .35s ease;
}


/* =========================================================
   طبقات
========================================================= */

.techno-refrigerator .shelf {
    stroke: var(--tp-navy);
    stroke-width: .55;
    fill: none;

    opacity: .8;
}


/* =========================================================
   کشوهای فریزر
========================================================= */

.techno-refrigerator .drawer {
    fill: #E8F2FC;
    stroke: var(--tp-border);
    stroke-width: .5;

    transition:
        fill .35s ease;
}


/* =========================================================
   دستگیره
========================================================= */

.techno-refrigerator .handle {
    fill: #F8FAFC;
    stroke: currentColor;
    stroke-width: .6;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   بطری / مواد غذایی ساده
========================================================= */

.techno-refrigerator .food {
    fill: var(--tp-blue);
    opacity: .72;

    transition:
        fill .35s ease,
        opacity .35s ease;
}

.techno-refrigerator .food-light {
    fill: #8FC2F5;
    opacity: .85;
}


/* =========================================================
   جریان هوای سرد
========================================================= */

.techno-refrigerator .cold-air {
    fill: none;
    stroke: #2D7FF9;
    stroke-width: .45;

    opacity: .7;

    transform-box: fill-box;
    transform-origin: center;

    transition:
        opacity .35s ease,
        stroke .35s ease;
}


/* =========================================================
   کریستال‌های سرما
========================================================= */

.techno-refrigerator .snowflake {
    fill: #FFFFFF;
    stroke: #2D7FF9;
    stroke-width: .35;

    opacity: .8;

    transition:
        opacity .35s ease,
        transform .35s ease;
}


/* =========================================================
   انیمیشن هوای سرد
========================================================= */

@keyframes techno-cold-air {

    0% {
        transform: translateY(0);
        opacity: .35;
    }

    50% {
        transform: translateY(-1px);
        opacity: .9;
    }

    100% {
        transform: translateY(-2px);
        opacity: .35;
    }

}


/* =========================================================
   حرکت کریستال‌ها
========================================================= */

@keyframes techno-snow-float {

    0% {
        transform: translateY(0) rotate(0deg);
    }

    50% {
        transform: translateY(-1px) rotate(8deg);
    }

    100% {
        transform: translateY(0) rotate(0deg);
    }

}


/* فقط هنگام Hover */

.techno-service-icon:hover
.techno-refrigerator .cold-air {

    animation:
        techno-cold-air 1.8s ease-in-out infinite;
}


.techno-service-icon:hover
.techno-refrigerator .snowflake {

    animation:
        techno-snow-float 2s ease-in-out infinite;
}


/* =========================================================
   Hover اصلی
========================================================= */

.techno-service-icon:hover {

    color: var(--tp-blue);

    transform: translateY(-3px);
}


/* بدنه */

.techno-service-icon:hover
.techno-refrigerator .machine-body {

    fill: #FFFFFF;
}


/* فضای داخلی */

.techno-service-icon:hover
.techno-refrigerator .inner-space {

    fill: #D5EBFF;
}


/* غذا */

.techno-service-icon:hover
.techno-refrigerator .food {

    fill: #1597F5;
    opacity: .9;
}


/* هوای سرد */

.techno-service-icon:hover
.techno-refrigerator .cold-air {

    stroke: #1597F5;
    opacity: 1;
}


/* =========================================================
   Accessibility
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .techno-service-icon,
    .techno-service-icon * {

        animation: none !important;
        transition: none !important;

    }

}

/* ================================
   TECHNO POSHTIBAN ICON SYSTEM
   Washing Machine v1
================================ */

.techno-service-icon {
    --tp-navy: #143F72;
    --tp-blue: #2D7FF9;
    --tp-light-blue: #DCEBFA;
    --tp-bg: #F8FBFF;
    --tp-border: #B8CFE7;

    width: 90px;
    height: 90px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--tp-navy);

    transition:
        transform .35s ease,
        filter .35s ease;
}

.techno-service-icon svg {
    width: 100%;
    height: 100%;

    display: block;

    overflow: visible;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition:
        color .35s ease;
}


/* ================================
   Main Body
================================ */

.techno-washing-machine .machine-body {
    fill: var(--tp-bg);
    stroke: currentColor;
    stroke-width: .8;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* ================================
   Door
================================ */

.techno-washing-machine .door-outer {
    fill: #F7FAFD;
    stroke: currentColor;
    stroke-width: .75;

    transition:
        fill .35s ease,
        stroke .35s ease;
}

.techno-washing-machine .door-inner {
    fill: var(--tp-light-blue);
    stroke: currentColor;
    stroke-width: .65;

    transition:
        fill .35s ease;
}


/* ================================
   Water
================================ */

.techno-washing-machine .water {
    fill: var(--tp-blue);
    opacity: .85;

    transform-box: fill-box;
    transform-origin: center;

    transition:
        fill .35s ease,
        opacity .35s ease;
}

.techno-washing-machine .water-highlight {
    fill: #8FC2F5;
    opacity: .9;

    transition:
        fill .35s ease;
}


/* ================================
   Water Motion
================================ */

@keyframes techno-water-spin {

    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }

}


/* فقط هنگام هاور حرکت می‌کند */
.techno-service-icon:hover
.techno-washing-machine .water-group {

    animation:
        techno-water-spin 4s linear infinite;

    transform-box: fill-box;
    transform-origin: center;

}


/* ================================
   Bubble
================================ */

.techno-washing-machine .bubble {
    fill: #FFFFFF;
    opacity: .78;

    transition:
        transform .35s ease,
        opacity .35s ease,
        fill .35s ease;
}


/* ================================
   Highlight
================================ */

.techno-washing-machine .glass-highlight {
    stroke: #FFFFFF;
    stroke-width: .7;
    opacity: .9;

    transition:
        opacity .35s ease;
}


/* ================================
   Controls
================================ */

.techno-washing-machine .control {
    fill: #E8F2FC;
    stroke: var(--tp-border);
    stroke-width: .55;

    transition:
        fill .35s ease,
        stroke .35s ease;
}

.techno-washing-machine .control-dark {
    fill: var(--tp-navy);
    stroke: var(--tp-navy);
}


/* ================================
   Handle
================================ */

.techno-washing-machine .handle {
    fill: #F8FAFC;
    stroke: currentColor;
    stroke-width: .65;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* ================================
   Feet
================================ */

.techno-washing-machine .foot {
    fill: #DCE8F3;
    stroke: currentColor;
    stroke-width: .55;
}


/* ================================
   HOVER COLOR
================================ */

.techno-service-icon:hover {

    color: var(--tp-blue);

    transform: translateY(-3px);
}


/* بدنه در هاور کمی روشن‌تر شود */

.techno-service-icon:hover
.techno-washing-machine .machine-body {

    fill: #FFFFFF;
}


/* درِ ماشین */

.techno-service-icon:hover
.techno-washing-machine .door-inner {

    fill: #D5EBFF;
}


/* آب */

.techno-service-icon:hover
.techno-washing-machine .water {

    fill: #1597F5;
    opacity: .92;
}


/* حباب‌ها کمی زنده‌تر شوند */

.techno-service-icon:hover
.techno-washing-machine .bubble {

    opacity: 1;
}


/* ================================
   Accessibility
================================ */

@media (prefers-reduced-motion: reduce) {

    .techno-service-icon *,
    .techno-service-icon {

        animation: none !important;
        transition: none !important;

    }

}
/* =========================================================
   TECHNO POSHTIBAN
   Dishwasher Icon
   SVG Design System v1
========================================================= */

.techno-service-icon {
    --tp-navy: #143F72;
    --tp-blue: #2D7FF9;
    --tp-light-blue: #DCEBFA;
    --tp-bg: #F8FBFF;
    --tp-border: #B8CFE7;

    width: 90px;
    height: 90px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--tp-navy);

    transition:
        transform .35s ease,
        filter .35s ease;
}

.techno-service-icon svg {
    width: 100%;
    height: 100%;

    display: block;
    overflow: visible;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition:
        color .35s ease;
}


/* =========================================================
   بدنه اصلی
========================================================= */

.techno-dishwasher .machine-body {
    fill: var(--tp-bg);
    stroke: currentColor;
    stroke-width: .8;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   پنل بالایی
========================================================= */

.techno-dishwasher .panel-line {
    stroke: currentColor;
    stroke-width: .75;
}

.techno-dishwasher .control {
    fill: #E8F2FC;
    stroke: var(--tp-border);
    stroke-width: .55;

    transition:
        fill .35s ease,
        stroke .35s ease;
}

.techno-dishwasher .control-dark {
    fill: var(--tp-navy);
    stroke: var(--tp-navy);
}


/* =========================================================
   صفحه نمایش
========================================================= */

.techno-dishwasher .display {
    fill: var(--tp-navy);
    stroke: currentColor;
    stroke-width: .55;

    transition:
        fill .35s ease;
}

.techno-dishwasher .display-light {
    fill: #8FC2F5;

    transition:
        fill .35s ease;
}


/* =========================================================
   درِ ظرفشویی
========================================================= */

.techno-dishwasher .door-frame {
    fill: #F7FAFD;
    stroke: currentColor;
    stroke-width: .75;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   فضای داخلی
========================================================= */

.techno-dishwasher .inner-chamber {
    fill: var(--tp-light-blue);
    stroke: currentColor;
    stroke-width: .65;

    transition:
        fill .35s ease;
}


/* =========================================================
   سبدهای ظرف
========================================================= */

.techno-dishwasher .rack {
    fill: none;
    stroke: var(--tp-navy);
    stroke-width: .55;

    opacity: .8;
}

.techno-dishwasher .plate {
    fill: none;
    stroke: var(--tp-blue);
    stroke-width: .5;

    opacity: .85;
}


/* =========================================================
   بازوی آب‌پاش
========================================================= */

.techno-dishwasher .spray-arm {
    fill: var(--tp-blue);
    stroke: none;

    transform-box: fill-box;
    transform-origin: center;

    transition:
        fill .35s ease;
}


/* =========================================================
   قطرات آب
========================================================= */

.techno-dishwasher .water-drop {
    fill: #8FC2F5;
    stroke: none;

    opacity: .85;

    transition:
        fill .35s ease,
        opacity .35s ease;
}


/* =========================================================
   شیشه / انعکاس
========================================================= */

.techno-dishwasher .glass-highlight {
    stroke: #FFFFFF;
    stroke-width: .7;
    fill: none;

    opacity: .9;
}


/* =========================================================
   دستگیره
========================================================= */

.techno-dishwasher .handle {
    fill: #F8FAFC;
    stroke: currentColor;
    stroke-width: .65;

    transition:
        fill .35s ease;
}


/* =========================================================
   پایه‌ها
========================================================= */

.techno-dishwasher .foot {
    fill: #DCE8F3;
    stroke: currentColor;
    stroke-width: .55;
}


/* =========================================================
   انیمیشن بازوی آب‌پاش
========================================================= */

@keyframes techno-dishwasher-spray {

    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }

}


/* فقط هنگام Hover */

.techno-service-icon:hover
.techno-dishwasher .spray-arm {

    animation:
        techno-dishwasher-spray 2.8s linear infinite;
}


/* =========================================================
   Hover اصلی
========================================================= */

.techno-service-icon:hover {

    color: var(--tp-blue);

    transform: translateY(-3px);
}


/* بدنه */

.techno-service-icon:hover
.techno-dishwasher .machine-body {

    fill: #FFFFFF;
}


/* محفظه */

.techno-service-icon:hover
.techno-dishwasher .inner-chamber {

    fill: #D5EBFF;
}


/* بازوی آب‌پاش */

.techno-service-icon:hover
.techno-dishwasher .spray-arm {

    fill: #1597F5;
}


/* قطرات */

.techno-service-icon:hover
.techno-dishwasher .water-drop {

    fill: #2D7FF9;
    opacity: 1;
}


/* صفحه نمایش */

.techno-service-icon:hover
.techno-dishwasher .display-light {

    fill: #2D7FF9;
}


/* =========================================================
   کاهش حرکت برای Accessibility
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .techno-service-icon,
    .techno-service-icon * {

        animation: none !important;
        transition: none !important;

    }

}
/* =========================================================
   TECHNO POSHTIBAN
     Microwave Service Icon
   SVG Design System v2
========================================================= */
.techno-microwave {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 90px;
    cursor: pointer;
}

.techno-microwave svg {
    display: block;
    overflow: visible;
    transition: transform 0.35s ease;
}


/* Hover */

.techno-microwave:hover svg {
    transform: translateY(-3px);
}


/* بدنه */

.techno-microwave:hover .microwave-body {
    fill: #FFFFFF;
    stroke: #2D7FF9;
}


/* فضای داخلی */

.techno-microwave:hover .microwave-inner {
    fill: #DCEBFA;
}


/* نمایشگر */

.techno-microwave:hover .microwave-display {
    fill: #2D7FF9;
}


/* سینی چرخان */

.techno-microwave:hover .microwave-turntable {
    animation: techno-microwave-turn 2.8s linear infinite;
    transform-box: fill-box;
    transform-origin: center;
}


/* حرارت */

.techno-microwave:hover .heat-wave {
    opacity: 1;
}

.techno-microwave:hover .heat-wave:nth-child(1) {
    animation: techno-microwave-heat 1.6s ease-in-out infinite;
}

.techno-microwave:hover .heat-wave:nth-child(2) {
    animation: techno-microwave-heat 1.6s ease-in-out 0.25s infinite;
}

.techno-microwave:hover .heat-wave:nth-child(3) {
    animation: techno-microwave-heat 1.6s ease-in-out 0.5s infinite;
}


/* چرخش سینی */

@keyframes techno-microwave-turn {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* موج حرارت */

@keyframes techno-microwave-heat {

    0% {
        opacity: 0.15;
        transform: translateY(2px);
    }

    50% {
        opacity: 1;
        transform: translateY(-1px);
    }

    100% {
        opacity: 0.15;
        transform: translateY(-3px);
    }

}


/* کاهش حرکت */

@media (prefers-reduced-motion: reduce) {

    .techno-microwave svg,
    .techno-microwave * {
        animation: none !important;
        transition: none !important;
    }

}

/* =========================================================
   TECHNO POSHTIBAN
   Vacuum Cleaner Icon
   SVG Design System v1
========================================================= */

.techno-service-icon {
    --tp-navy: #143F72;
    --tp-blue: #2D7FF9;
    --tp-light-blue: #DCEBFA;
    --tp-bg: #F8FBFF;
    --tp-border: #B8CFE7;

    width: 90px;
    height: 90px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--tp-navy);

    transition:
        transform .35s ease,
        filter .35s ease;
}

.techno-service-icon svg {
    width: 100%;
    height: 100%;

    display: block;
    overflow: visible;

    stroke-linecap: round;
    stroke-linejoin: round;

    transition: color .35s ease;
}


/* =========================================================
   بدنه
========================================================= */

.techno-vacuum .machine-body {
    fill: var(--tp-bg);
    stroke: currentColor;
    stroke-width: .8;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   مخزن / محفظه
========================================================= */

.techno-vacuum .dust-chamber {
    fill: var(--tp-light-blue);
    stroke: currentColor;
    stroke-width: .65;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   بخش‌های کنترلی
========================================================= */

.techno-vacuum .control {
    fill: #E8F2FC;
    stroke: var(--tp-border);
    stroke-width: .5;

    transition:
        fill .35s ease,
        stroke .35s ease;
}


/* =========================================================
   لوله
========================================================= */

.techno-vacuum .pipe {
    fill: none;
    stroke: currentColor;
    stroke-width: .7;

    transition:
        stroke .35s ease;
}


/* =========================================================
   دسته
========================================================= */

.techno-vacuum .handle {
    fill: none;
    stroke: currentColor;
    stroke-width: .75;

    transition:
        stroke .35s ease;
}


/* =========================================================
   برس
========================================================= */

.techno-vacuum .brush {
    fill: var(--tp-blue);
    stroke: none;

    transform-box: fill-box;
    transform-origin: center;

    transition:
        fill .35s ease;
}


/* =========================================================
   برس‌های کوچک
========================================================= */

.techno-vacuum .brush-detail {
    stroke: #FFFFFF;
    stroke-width: .45;

    opacity: .85;
}


/* =========================================================
   جریان مکش
========================================================= */

.techno-vacuum .suction-line {
    fill: none;
    stroke: #2D7FF9;
    stroke-width: .42;

    opacity: .65;

    transition:
        opacity .35s ease,
        stroke .35s ease;
}


/* =========================================================
   ذرات گرد و غبار
========================================================= */

.techno-vacuum .dust {
    fill: #8FC2F5;
    stroke: none;

    opacity: .7;

    transform-box: fill-box;
    transform-origin: center;

    transition:
        fill .35s ease,
        opacity .35s ease;
}


/* =========================================================
   حرکت برس
========================================================= */

@keyframes techno-vacuum-brush {

    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-.7px);
    }

    50% {
        transform: translateX(0);
    }

    75% {
        transform: translateX(.7px);
    }

    100% {
        transform: translateX(0);
    }

}


/* =========================================================
   حرکت ذرات به سمت نازل
========================================================= */

@keyframes techno-vacuum-dust {

    0% {
        transform: translateX(0);
        opacity: .25;
    }

    50% {
        transform: translateX(1.4px);
        opacity: 1;
    }

    100% {
        transform: translateX(2.5px);
        opacity: .15;
    }

}


/* =========================================================
   حرکت جریان مکش
========================================================= */

@keyframes techno-vacuum-suction {

    0% {
        stroke-dashoffset: 0;
        opacity: .25;
    }

    50% {
        stroke-dashoffset: -3;
        opacity: .9;
    }

    100% {
        stroke-dashoffset: -6;
        opacity: .25;
    }

}


/* =========================================================
   Hover Animation
========================================================= */

.techno-service-icon:hover
.techno-vacuum .brush {

    animation:
        techno-vacuum-brush .8s ease-in-out infinite;
}


.techno-service-icon:hover
.techno-vacuum .dust {

    animation:
        techno-vacuum-dust 1.2s ease-in-out infinite;
}


.techno-service-icon:hover
.techno-vacuum .suction-line {

    stroke-dasharray: 1.5 1.5;

    animation:
        techno-vacuum-suction 1s linear infinite;
}


/* =========================================================
   Hover اصلی
========================================================= */

.techno-service-icon:hover {

    color: var(--tp-blue);

    transform: translateY(-3px);
}


/* بدنه */

.techno-service-icon:hover
.techno-vacuum .machine-body {

    fill: #FFFFFF;
}


/* مخزن */

.techno-service-icon:hover
.techno-vacuum .dust-chamber {

    fill: #D5EBFF;
}


/* برس */

.techno-service-icon:hover
.techno-vacuum .brush {

    fill: #1597F5;
}


/* مکش */

.techno-service-icon:hover
.techno-vacuum .suction-line {

    stroke: #1597F5;
    opacity: 1;
}


/* ذرات */

.techno-service-icon:hover
.techno-vacuum .dust {

    fill: #2D7FF9;
    opacity: 1;
}


/* =========================================================
   Accessibility
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .techno-service-icon,
    .techno-service-icon * {

        animation: none !important;
        transition: none !important;

    }

}
/* =========================================================
   TECHNO POSHTIBAN
TV Icon
   SVG Design System v1
========================================================= */
.techno-television {

    --techno-navy: #143F72;
    --techno-blue: #2D7FF9;
    --techno-light-blue: #DCEBFA;
    --techno-bg: #F8FBFF;
    --techno-border: #B8CFE7;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 90px;
    height: 90px;

    cursor: pointer;
}


/* =========================================
   SVG
========================================= */

.techno-television svg {

    overflow: visible;

    transition:
        transform 0.35s ease,
        filter 0.35s ease;
}


/* =========================================
   بدنه تلویزیون
========================================= */

.techno-television .tv-body {

    fill: var(--techno-bg);

    stroke: var(--techno-navy);

    stroke-width: 0.8;

    transition:
        fill 0.35s ease,
        stroke 0.35s ease;
}


/* =========================================
   قاب صفحه
========================================= */

.techno-television .tv-screen-frame {

    fill: var(--techno-light-blue);

    stroke: var(--techno-border);

    stroke-width: 0.55;

    transition:
        fill 0.35s ease,
        stroke 0.35s ease;
}


/* =========================================
   صفحه نمایش
========================================= */

.techno-television .tv-screen {

    fill: #EEF5FC;

    stroke: var(--techno-navy);

    stroke-width: 0.65;

    transition:
        fill 0.35s ease,
        stroke 0.35s ease;
}


/* =========================================
   محتوای صفحه
========================================= */

.techno-television .tv-screen-line {

    stroke: var(--techno-blue);

    stroke-width: 0.75;

    stroke-linecap: round;

    stroke-linejoin: round;

    opacity: 0.75;

    transition:
        opacity 0.35s ease;
}


.techno-television .tv-screen-dot {

    fill: var(--techno-navy);

    transition:
        fill 0.35s ease,
        transform 0.35s ease;
}


/* =========================================
   اسکن نور صفحه
========================================= */

.techno-television .tv-scan {

    stroke: #FFFFFF;

    stroke-width: 1;

    stroke-linecap: round;

    opacity: 0;

    transform-box: fill-box;

    transform-origin: center;
}


/* =========================================
   بلندگو
========================================= */

.techno-television .tv-speaker {

    stroke: var(--techno-navy);

    stroke-width: 0.7;

    stroke-linecap: round;

    transition:
        stroke 0.35s ease,
        opacity 0.35s ease;
}


/* =========================================
   پایه
========================================= */

.techno-television .tv-stand {

    stroke: var(--techno-navy);

    stroke-width: 0.8;

    stroke-linecap: round;
}


.techno-television .tv-stand-base {

    stroke: var(--techno-navy);

    stroke-width: 0.9;

    stroke-linecap: round;

    transition:
        stroke 0.35s ease;
}


/* =========================================
   چراغ وضعیت
========================================= */

.techno-television .tv-status {

    fill: var(--techno-blue);

    transition:
        fill 0.35s ease;
}


/* =========================================
   هایلایت قاب
========================================= */

.techno-television .tv-frame-highlight {

    stroke: #FFFFFF;

    stroke-width: 0.65;

    stroke-linecap: round;

    opacity: 0.75;
}


/* =========================================
   HOVER
========================================= */

.techno-television:hover svg {

    transform: translateY(-3px);
}


/* روشن شدن بدنه */

.techno-television:hover .tv-body {

    fill: #FFFFFF;

    stroke: var(--techno-blue);
}


/* روشن شدن قاب */

.techno-television:hover .tv-screen-frame {

    fill: var(--techno-light-blue);

    stroke: var(--techno-blue);
}


/* روشن شدن صفحه */

.techno-television:hover .tv-screen {

    fill: #E7F1FB;

    stroke: var(--techno-blue);
}


.techno-television:hover .tv-screen-line {

    opacity: 1;
}


/* =========================================
   حرکت نور روی صفحه
========================================= */

.techno-television:hover .tv-scan {

    animation:
        techno-tv-scan 1.8s ease-in-out infinite;
}


@keyframes techno-tv-scan {

    0% {

        opacity: 0;

        transform:
            translateY(7px)
            scaleX(0.7);
    }

    25% {

        opacity: 0.8;
    }

    50% {

        opacity: 0.2;

        transform:
            translateY(-2px)
            scaleX(1);
    }

    75% {

        opacity: 0.8;
    }

    100% {

        opacity: 0;

        transform:
            translateY(-8px)
            scaleX(0.7);
    }
}


/* =========================================
   وضعیت چراغ
========================================= */

.techno-television:hover .tv-status {

    fill: var(--techno-blue);

    animation:
        techno-tv-status 1.4s ease-in-out infinite;
}


@keyframes techno-tv-status {

    0%,
    100% {

        opacity: 0.45;
    }

    50% {

        opacity: 1;
    }
}


/* =========================================
   اسپیکر
========================================= */

.techno-television:hover .tv-speaker {

    stroke: var(--techno-blue);

    animation:
        techno-tv-speaker 1.2s ease-in-out infinite;
}


@keyframes techno-tv-speaker {

    0%,
    100% {

        opacity: 0.55;
    }

    50% {

        opacity: 1;
    }
}


/* =========================================
   صفحه
========================================= */

.techno-television:hover .tv-screen-dot {

    fill: var(--techno-blue);

    transform:
        scale(1.25);
}


/* =========================================
   کاهش حرکت
========================================= */

@media (prefers-reduced-motion: reduce) {

    .techno-television svg,
    .techno-television * {

        animation: none !important;

        transition: none !important;
    }

}

/*svg-end*/


/* =========================================================
   TECHNOPOSHTIBAN — SERVICES SECTION BACKGROUND
   ========================================================= */

.tp-services-section {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            ellipse 55% 45% at 8% 18%,
            rgba(211,224,241,.85) 0%,
            rgba(211,224,241,.48) 32%,
            rgba(211,224,241,0) 72%
        ),
        radial-gradient(
            ellipse 50% 48% at 94% 72%,
            rgba(211,224,241,.72) 0%,
            rgba(211,224,241,.38) 34%,
            rgba(211,224,241,0) 75%
        ),
        linear-gradient(
            180deg,
            #F8FBFF 0%,
            #EDF5FC 52%,
            #F5F9FD 100%
        );
}


/* ---------------------------------------------------------
   ORGANIC SHAPE — TOP RIGHT
   --------------------------------------------------------- */

.tp-services-section::before {
    content: "";

    position: absolute;

    width: 480px;
    height: 300px;

    top: -145px;
    right: -100px;

    background:
        linear-gradient(
            135deg,
            rgba(211,224,241,.82),
            rgba(211,224,241,.30)
        );

    border-radius:
        63% 37% 48% 52%
        /
        42% 55% 45% 58%;

    transform: rotate(-12deg);

    opacity: .9;

    pointer-events: none;
}


/* ---------------------------------------------------------
   ORGANIC SHAPE — BOTTOM LEFT
   --------------------------------------------------------- */

.tp-services-section::after {
    content: "";

    position: absolute;

    width: 430px;
    height: 280px;

    bottom: -155px;
    left: -130px;

    background:
        linear-gradient(
            135deg,
            rgba(211,224,241,.72),
            rgba(211,224,241,.22)
        );

    border-radius:
        38% 62% 55% 45%
        /
        58% 40% 60% 42%;

    transform: rotate(15deg);

    opacity: .85;

    pointer-events: none;
}


/* ---------------------------------------------------------
   CONTENT ABOVE BACKGROUND SHAPES
   --------------------------------------------------------- */

.tp-services-section > * {
    position: relative;
    z-index: 2;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .tp-services-section {
        background:
            radial-gradient(
                ellipse 80% 35% at 0% 10%,
                rgba(211,224,241,.72) 0%,
                rgba(211,224,241,.28) 42%,
                transparent 75%
            ),
            radial-gradient(
                ellipse 75% 38% at 100% 90%,
                rgba(211,224,241,.62) 0%,
                rgba(211,224,241,.22) 42%,
                transparent 75%
            ),
            linear-gradient(
                180deg,
                #F6FAFE 0%,
                #EDF5FC 100%
            );
    }

    .tp-services-section::before {
        width: 300px;
        height: 200px;

        top: -100px;
        right: -100px;
    }

    .tp-services-section::after {
        width: 280px;
        height: 190px;

        bottom: -100px;
        left: -100px;
    }
}

/* =========================================================
   TECHNOPOSHTIBAN
   SERVICE FEATURES BAR — FINAL
   ========================================================= */


/* =========================================================
   FEATURES ROW
   ========================================================= */

.tp-service-features {
    position: relative;

    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    align-items: stretch;

    direction: rtl;

    padding: 20px 10px 24px;

    box-sizing: border-box;
}


/* =========================================================
   FEATURE ITEM
   ========================================================= */

.tp-service-feature {
    position: relative;

    display: inherit;

    align-items: center;

    gap: 11px;

    min-width: 0;

    padding: 7px 24px;

    direction: rtl;

    box-sizing: border-box;

    transition:
        transform .3s ease,
        background-color .3s ease;
}


/* =========================================================
   VERTICAL DIVIDER
   ========================================================= */

.tp-service-feature {
    border-left: 1px solid rgba(7,59,118,.12);
}
.tp-service-features .lastfeature .tp-service-feature{ 
    border-left: 0;
}
@media (max-width: 992px) {
	.tp-service-features{
		    grid-template-columns:repeat(2, 1fr) !important;
	}
	.tp-service-feature {
    border-left: 0 !important;
}
}
@media (max-width: 600px) {


}

/* =========================================================
   ICON
   ========================================================= */

.tp-service-feature__icon {

    width: 44px;
    height: 44px;

    flex: 0 0 44px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #073B76;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.95),
            rgba(255,255,255,.55)
        );

    border: 1px solid rgba(7,59,118,.07);

    border-radius: 50%;

    box-shadow:
        0 4px 12px rgba(7,59,118,.05);

    transition:
        color .3s ease,
        background-color .3s ease,
        border-color .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}


.tp-service-feature__icon svg {

    width: 29px;
    height: 29px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   CONTENT
   ========================================================= */

.tp-service-feature__content {

    min-width: 0;

    direction: rtl;

    text-align: right;
}


.tp-service-feature__title {

    margin: 0 0 3px;

    color: #073B76;

    font-size: 16px;

    font-weight: 900;

    line-height: 1.5;

    white-space: nowrap;
}


.tp-service-feature__text {

    margin: 0;

    color: #58708A;

    font-size: 13px;

    font-weight: 500;

    line-height: 1.7;

    white-space: nowrap;
}


/* =========================================================
   HOVER
   ========================================================= */

.tp-service-feature:hover {

    transform: translateY(-2px);
}


.tp-service-feature:hover
.tp-service-feature__icon {

    color: #1261A8;

    background: #FFFFFF;

    border-color: rgba(18,97,168,.16);

    box-shadow:
        0 7px 16px rgba(18,97,168,.10);

    transform: scale(1.04);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-service-features {

        max-width: 850px;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        row-gap: 8px;

        padding-inline: 15px;
    }


    .tp-service-feature {

        padding: 8px 18px;
    }


    .tp-service-feature__title {

        font-size: 13px;
    }





    /* حذف جداکننده بین ستون‌های نامناسب */

    .tp-service-features
    .tp-service-feature:nth-child(2)::after {

        display: none;
    }


    .tp-service-features
    .tp-service-feature:nth-child(4)::after {

        display: none;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .tp-service-features {

        grid-template-columns: 1fr;

        max-width: 420px;

        padding: 10px 12px 18px;
    }


    .tp-service-feature {

        padding: 13px 10px;

        gap: 11px;
    }


    /* جداکننده افقی */

    .tp-service-features
    .tp-service-feature::after {

        top: auto;

        bottom: 0;

        left: 10%;

        width: 80%;

        height: 1px;

        background:
            linear-gradient(
                90deg,
                transparent,
                rgba(7,59,118,.10),
                transparent
            );
    }


    .tp-service-features
    .tp-service-feature:last-child::after {

        display: none;
    }


    .tp-service-feature__icon {

        width: 42px;
        height: 42px;

        flex-basis: 42px;
    }


    .tp-service-feature__icon svg {

        width: 27px;
        height: 27px;
    }


    .tp-service-feature__title {

        font-size: 14px;
    }


    .tp-service-feature__text {

        font-size: 13px;
    }
}
/* =========================================================
   SERVICES CARDS — TABLET
   ========================================================= */

@media (min-width: 1380px) {
.part2 .tp-services-grid {
    grid-template-columns: repeat(3, 1fr);
}

}


/* =========================================================
   SERVICES CARDS — MOBILE
   ========================================================= */

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

    .tp-services-grid.g-cols {
        grid-template-columns: repeat(2, 1fr);
    }

}
/************part3***************************/

.tp-next-section {
    position: relative;
    overflow: hidden;

    background-image: url('../../uploads/2026/09/back_section_why_teknoposhtioban.webp');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* گرادیانت از پایین */
.tp-next-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            to top,
            rgba(5, 42, 86, 0.98) 0%,
            rgba(5, 42, 86, 0.94) 12%,
            rgba(7, 59, 118, 0.78) 27%,
            rgba(7, 59, 118, 0.48) 43%,
            rgba(7, 59, 118, 0.18) 62%,
            rgba(7, 59, 118, 0.03) 80%,
            transparent 100%
        );

    pointer-events: none;
}

/* محتوای روی عکس بالاتر از گرادیانت */
.tp-next-section > * {
    position: relative;
    z-index: 2;
}
.tp-choice-heading {
    width: 100%;
    max-width: 760px;
    margin: 0 auto 34px;
    text-align: center;
    direction: rtl;
}

/* نوشته کوچک بالای عنوان */
.tp-choice-heading__eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    margin-bottom: 9px;
    direction: ltr;
}

.tp-choice-heading__eyebrow span {
    width: 34px;
    height: 1px;
    display: block;
    background: rgba(254, 189, 63, .75);
}

.tp-choice-heading__eyebrow strong {
    color: #FEBD3F;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 4px;
    line-height: 1;
}

/* عنوان اصلی */
.tp-choice-heading__title {
    margin: 0;
    color: #FFFFFF;
    font-size: 36px;
    font-weight: 900;
    line-height: 1.6;
}

.tp-choice-heading__title span {
    color: #2D7FF9;
}

/* خط طلایی زیر عنوان */
.tp-choice-heading__line {
    width: 55px;
    height: 3px;
    margin: 5px auto 13px;
    border-radius: 10px;
    background: #FEBD3F;
}

/* توضیحات */
.tp-choice-heading__description {
    max-width: 650px;
    margin: 0 auto;
    color: rgba(255, 255, 255, .78);
    font-size: 15px;
    font-weight: 500;
    line-height: 2.1;
}

/* Tablet */
@media (max-width: 992px) {

    .tp-choice-heading {
        max-width: 680px;
        margin-bottom: 28px;
    }

    .tp-choice-heading__title {
        font-size: 27px;
    }

    .tp-choice-heading__description {
        font-size: 11px;
    }
}

/* Mobile */
@media (max-width: 768px) {

    .tp-choice-heading {
        padding-inline: 18px;
        margin-bottom: 24px;
    }

    .tp-choice-heading__eyebrow {
        gap: 9px;
    }

    .tp-choice-heading__eyebrow span {
        width: 24px;
    }

    .tp-choice-heading__eyebrow strong {
        font-size: 7px;
        letter-spacing: 3px;
    }

    .tp-choice-heading__title {
        font-size: 23px;
        line-height: 1.7;
    }

    .tp-choice-heading__line {
        width: 45px;
        height: 2px;
        margin-top: 4px;
        margin-bottom: 10px;
    }


}

/* =========================================================
   TECHNOPOSHTIBAN - WHY US CARDS
   ========================================================= */

.tp-choice-card {
    position: relative;
    width: 100%;
    min-height: 245px;

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

    padding: 24px 18px 22px;

    box-sizing: border-box;
    direction: rtl;
    text-align: center;

    background:
        linear-gradient(
            145deg,
            rgba(7, 59, 118, .78) 0%,
            rgba(5, 42, 86, .91) 100%
        );

    border: 1px solid rgba(254, 189, 63, .48);
    border-radius: 15px;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .20),
        inset 0 1px 0 rgba(255, 255, 255, .07);

    overflow: hidden;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* نور ظریف بالای کارت */

.tp-choice-card::before {
    content: "";
    position: absolute;

    width: 150px;
    height: 150px;

    top: -95px;
    left: 50%;

    transform: translateX(-50%);

    background: rgba(254, 189, 63, .12);

    border-radius: 50%;

    filter: blur(22px);

    pointer-events: none;
}


/* =========================================================
   ICON
   ========================================================= */

.tp-choice-card__icon {
    position: relative;
    z-index: 2;

    width: 58px;
    height: 58px;
    flex: 0 0 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 13px;

    border-radius: 50%;

    color: #FEBD3F;

    background:
        radial-gradient(
            circle,
            rgba(254, 189, 63, .20) 0%,
            rgba(254, 189, 63, .07) 58%,
            rgba(254, 189, 63, 0) 76%
        );

    border: 1px solid rgba(254, 189, 63, .80);

    box-shadow:
        0 0 0 4px rgba(254, 189, 63, .05),
        0 0 20px rgba(254, 189, 63, .18);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.tp-choice-card__icon svg {
    width: 31px;
    height: 31px;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   CONTENT
   ========================================================= */

.tp-choice-card__content {
    position: relative;
    z-index: 2;

    width: 100%;
}


/* TITLE */

.tp-choice-card__title {
    margin: 0;

    color: #FFFFFF;

    font-size: 18px;
    font-weight: 600;

    line-height: 1.6;
}


/* GOLD LINE */

.tp-choice-card__line {
    width: 38px;
    height: 2px;

    margin: 7px auto 12px;

    border-radius: 13px;

    background: #FEBD3F;

    box-shadow:
        0 0 9px rgba(254, 189, 63, .30);
}


/* TEXT */

.tp-choice-card__text {
    width: 100%;
    max-width: 190px;

    margin: 0 auto;

    color: rgba(255, 255, 255, .76);

    font-size: 13px;
    font-weight: 500;

    line-height: 2.05;
}


/* =========================================================
   HOVER
   ========================================================= */

.tp-choice-card:hover {
    transform: translateY(-7px);

    border-color: rgba(254, 189, 63, .78);

    box-shadow:
        0 18px 38px rgba(0, 0, 0, .27),
        0 0 24px rgba(254, 189, 63, .08),
        inset 0 1px 0 rgba(255, 255, 255, .10);
}


.tp-choice-card:hover .tp-choice-card__icon {
    transform: scale(1.07);

    box-shadow:
        0 0 0 5px rgba(254, 189, 63, .06),
        0 0 26px rgba(254, 189, 63, .30);
}


/* =========================================================
   DESKTOP - چهار کارت در یک ردیف
   ========================================================= */

.tp-choice-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;

    width: 100%;
    max-width: 1140px;

    margin: 0 auto;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-choice-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        max-width: 620px;
        gap: 14px !important;
    }

    .tp-choice-card {
        min-height: 230px;
        padding: 22px 17px 20px;
    }

    .tp-choice-card__icon {
        width: 54px;
        height: 54px;
        flex-basis: 54px;
        margin-bottom: 11px;
    }

    .tp-choice-card__icon svg {
        width: 29px;
        height: 29px;
    }

    .tp-choice-card__title {
        font-size: 15px;
    }

    .tp-choice-card__text {
        max-width: 185px;
      
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-choice-cards {
        grid-template-columns: 1fr !important;
        max-width: 360px;
        gap: 12px;
    }

    .tp-choice-card {
        min-height: 205px;
        padding: 20px 16px 19px;
        border-radius: 13px;
    }

    .tp-choice-card__icon {
        width: 50px;
        height: 50px;
        flex-basis: 50px;
        margin-bottom: 9px;
    }

    .tp-choice-card__icon svg {
        width: 27px;
        height: 27px;
    }

    .tp-choice-card__title {
        font-size: 14px;
    }

    .tp-choice-card__line {
        width: 32px;
        margin: 5px auto 9px;
    }

    .tp-choice-card__text {
        max-width: 230px !important;
        font-size: 13px;
        line-height: 1.95;
    }
}
/* =========================================================
   FINAL FIX - WHY US CARDS
   ========================================================= */

/* عنوان: کلمه تکنوپشتیبان روی تصویر بهتر دیده شود */
.tp-choice-heading__title span {
    color: #FEBD3F !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, .20);
}


/* تمام کارت‌ها دقیقاً هم‌ارتفاع */
.tp-choice-card {
    height: 295px !important;
    min-height: 295px !important;
    box-sizing: border-box;
}


/* محتوای کارت فضای کنترل‌شده داشته باشد */
.tp-choice-card__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}


/* متن‌ها از محدوده کارت خارج نشوند */
.tp-choice-card__text {
    max-width: 185px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .tp-choice-card {
        height: 280px !important;
        min-height: 280px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-choice-card {
        height: 205px !important;
        min-height: 205px !important;
    }

}
/**********************part4************************/
.tp-order-heading {
    width: 100%;
    max-width: 680px;
    margin: 0 auto 28px;
    direction: rtl;
    text-align: center;
}

.tp-order-heading__eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.5;
    padding: 7px 14px;
    border-radius: 30px;
    background: rgba(211, 224, 241, .55);
    color: #073B76;
}

.tp-order-heading__icon {
    width: 25px;
    height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #FEBD3F;
}

.tp-order-heading__icon svg {
    width: 100%;
    height: 100%;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-order-heading__title {
    margin: 0 0 9px;

    color: #073B76;

    font-size: 36px;
    font-weight: 900;
    line-height: 1.5;
}

.tp-order-heading__title span {
    color: #1261A8;
}

.tp-order-heading__description {
    max-width: 650px;
    margin: 0 auto;
    color: #58708A;
    font-size: 15px;
    font-weight: 500;
    line-height: 2;
}

.tp-order-heading__contact {
    margin: 0;

color: #58708A;
    font-size: 14px;
    font-weight: 500;
    line-height: 2;
}

.tp-order-heading__contact strong {
    color: #1261A8;
    font-size: 13px;
    font-weight: 900;
}
.tp-order-section {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            ellipse 52% 65% at 8% 62%,
            rgba(211, 224, 241, .95) 0%,
            rgba(211, 224, 241, .58) 38%,
            rgba(211, 224, 241, .18) 65%,
            transparent 82%
        ),
        radial-gradient(
            ellipse 48% 58% at 94% 30%,
            rgba(211, 224, 241, .72) 0%,
            rgba(211, 224, 241, .38) 40%,
            rgba(211, 224, 241, .10) 68%,
            transparent 85%
        ),
        linear-gradient(
            180deg,
            #FFFFFF 0%,
            #F5F9FD 50%,
            #EEF5FC 100%
        );
}
.tp-order-section::before {
    content: "";
    position: absolute;

    width: 430px;
    height: 330px;

    left: -140px;
    bottom: -150px;

    background: rgba(211, 224, 241, .65);

    border-radius: 62% 38% 45% 55% /
                 42% 58% 42% 58%;

    transform: rotate(12deg);

    pointer-events: none;
}

.tp-order-features {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
    direction: rtl;
}

.tp-order-feature {
    position: relative;

    min-height: 78px;

    display: flex;
    align-items: center;

    gap: 14px;

    padding: 13px 0;

    direction: rtl;

    border-bottom: 1px solid rgba(7, 59, 118, .10);

    transition:
        transform .3s ease,
        border-color .3s ease;
}

.tp-order-feature__icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #1261A8;

    background: rgba(255,255,255,.72);

    border: 1px solid rgba(18,97,168,.14);

    border-radius: 14px;

    box-shadow: 0 5px 15px rgba(7,59,118,.06);

    transition:
        color .3s ease,
        background-color .3s ease,
        transform .3s ease;
}

.tp-order-feature__icon svg {
    width: 25px;
    height: 25px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-order-feature__content {
    min-width: 0;
    flex: 1;
}

.tp-order-feature__title {
    margin: 0 0 3px;

    color: #073B76;

    font-size: 16px;
    font-weight: 900;

    line-height: 1.5;
}

.tp-order-feature__text {
    margin: 0;

    color: #58708A;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.8;
}

.tp-order-feature__number {
    position: absolute;

    left: 0;
    top: 12px;

    color: rgba(18,97,168,.18);

    font-size: 11px;
    font-weight: 900;

    direction: ltr;
}

.tp-order-feature:hover {
    transform: translateX(-3px);

    border-color: rgba(18,97,168,.24);
}

.tp-order-feature:hover .tp-order-feature__icon {
    color: #073B76;

    background: #FFFFFF;

    transform: scale(1.05);

    box-shadow: 0 8px 18px rgba(7,59,118,.10);
}
.tp-order-features {
    width: 100%;
    max-width: 620px;
    margin: 24px auto 0;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
    row-gap: 0;

    direction: rtl;
}

.tp-order-feature {
    min-height: 82px;
    padding: 13px 0;

    display: flex;
    align-items: center;

    border-bottom: 1px solid rgba(7, 59, 118, .10);

    box-sizing: border-box;
}

.tp-order-feature__icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
}

/* آیتم‌های ردیف دوم */
.tp-order-feature-bott .tp-order-feature, .tp-order-feature-bott2 .tp-order-feature{
    border-bottom: 0;
}

@media (max-width: 768px) {

    .tp-order-features {
        grid-template-columns: 1fr;
        max-width: 360px;
    }

    .tp-order-feature-bott .tp-order-feature{
        border-bottom: 1px solid rgba(7, 59, 118, .10);
    }

    .tp-order-feature-bott2 .tp-order-feature{
        border-bottom: 0;
    }
}
.tp-order-feature {
    height: 82px;
    min-height: 82px;
    box-sizing: border-box;
}
.tp-order-feature__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
@media (max-width: 768px) {
    .tp-order-feature {
        height: 78px;
        min-height: 78px;
    }
}
.tp-order-person {
    position: relative;

    width: 100%;
    height: 100%;
min-height: 460px;


    display: flex;
    align-items: flex-end;
    justify-content: center;

    direction: ltr;
}


/* فرم آبی پشت تعمیرکار */

.tp-order-person__shape {
    position: absolute;
    width: 330px;
    height: 330px;
    bottom: 20px;
    

    left: 50%;


    transform: translateX(-50%);

    background:
        linear-gradient(
            145deg,
            #DCEBFA 0%,
            #BFD6EE 100%
        );

    border-radius:
        54% 46% 52% 48% /
        45% 52% 48% 55%;

    opacity: .85;

    box-shadow:
        0 20px 50px rgba(7,59,118,.08);

    pointer-events: none;
}


/* تصویر تعمیرکار */

.tp-order-person__image {
    position: relative;
    z-index: 2;

    width: 78%;
    max-width: 330px;
    height: 400px;


    display: flex;
    align-items: flex-end;
    justify-content: center;
}


.tp-order-person__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
    object-position: center bottom;

    filter:
        drop-shadow(0 16px 22px rgba(7,59,118,.14));
}

@media (min-width: 993px) {

    .tp-order-person {
        min-height: 460px;
    }

    .tp-order-person__shape {
        width: 350px;
        height: 350px;
        bottom: 20px;
    }

    .tp-order-person__image {
        width: 78%;
        max-width: 330px;
        height: 400px;
    }

}
/* =========================
   TABLET
   ========================= */

@media (max-width: 992px) {

    .tp-order-person {
        min-height: 440px;
    }

    .tp-order-person__shape {
        width: 330px;
        height: 330px;
    }

    .tp-order-person__image {
        max-width: 340px;
        height: 410px;
    }

}


/* =========================
   MOBILE
   ========================= */

@media (max-width: 768px) {

    .tp-order-person {
        min-height: 360px;
        margin-top: 20px;
    }

    .tp-order-person__shape {
        width: 280px;
        height: 280px;
        bottom: 5px;
    }

    .tp-order-person__image {
        max-width: 290px;
        height: 350px;
    }

}
/*part4-buttons*/
.tp-order-actions {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-top: 28px;
    direction: rtl;
}

/* دکمه‌ها در این سکشن */
.tp-order-actions .tp-blue-cta,
.tp-order-actions .tp-gold-cta {
    position: relative;
    margin: 0;
}

/* اتصال خیلی ظریف، بدون پوشاندن متن */
.tp-order-actions .tp-gold-cta {
    margin-right: -8px;
    z-index: 2;
}

.tp-order-actions .tp-blue-cta {
    z-index: 1;
}


/* موبایل */
@media (max-width: 768px) {

    .tp-order-actions {
        flex-direction: column;
        gap: 10px;
    }

    .tp-order-actions .tp-gold-cta {
        margin-right: 0;
    }

    .tp-order-actions .tp-blue-cta,
    .tp-order-actions .tp-gold-cta {
        width: 100%;
        max-width: 310px;
    }
}
/* =========================================================
   ORDER PERSON - DECORATIVE BACKGROUND
   ========================================================= */

.tp-order-person {
    position: relative;
    overflow: hidden;

  background: transparent !important;
}


/* فرم ارگانیک بزرگ گوشه پایین چپ */

.tp-order-person::before {
    content: "";

    position: absolute;
    z-index: 0;
    pointer-events: none;
			
	 width: 330px;
    height: 270px;

    left: -125px;
    bottom: -115px;

    background:
        linear-gradient(
            145deg,
            rgba(211, 224, 241, .72),
            rgba(211, 224, 241, .18)
        );

    border-radius:
        62% 38% 52% 48% /
        45% 58% 42% 55%;

    transform: rotate(-12deg);

    opacity: 1;
}


/* الگوی نقطه‌ای ظریف */

.tp-order-person::after {
    content: "";

    position: absolute;
   
    z-index: 0;	
	    width: 100px;
    height: 100px;

    left: 7%;
    top: 12%;

    background-image:
        radial-gradient(
            circle,
            rgba(18, 97, 168, .18) 1.3px,
            transparent 1.5px
        );

    background-size: 11px 11px;

    opacity: .65;
}


/* فرم اصلی پشت تعمیرکار */

.tp-order-person__shape {
    z-index: 1;

    width: 350px;
    height: 350px;
	
	
	    background:
        linear-gradient(
            145deg,
            rgba(220, 235, 250, .95) 0%,
            rgba(191, 214, 238, .65) 100%
        );

    box-shadow:
        0 18px 45px rgba(7, 59, 118, .08);
}


/* تصویر بالاتر از تمام تزئینات */

.tp-order-person__image {
    position: relative;
    z-index: 3;
}


/* =========================================================
   نقاط طلایی
   ========================================================= */

.tp-order-person__image::before,
.tp-order-person__image::after {
    content: "";

    position: absolute;

    border-radius: 50%;

    background: #FEBD3F;

    box-shadow:
        0 0 0 5px rgba(254, 189, 63, .10);
}


/* نقطه بالا */

.tp-order-person__image::before {
    width: 7px;
    height: 7px;

    top: 32px;
    right: 18px;
}


/* نقطه پایین */

.tp-order-person__image::after {
    width: 5px;
    height: 5px;

    bottom: 55px;
    left: 8px;

    opacity: .8;
}
.tp-order-person__watermark {
    position: absolute;

    width: 260px;
    height: 260px;

    left: 2%;
    top: 10%;

    color: #073B76;
    opacity: .035;

    z-index: 1;

    transform: rotate(-18deg);

    pointer-events: none;
}

.tp-order-person__watermark svg {
    width: 100%;
    height: 100%;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.1;
    stroke-linecap: round;
    stroke-linejoin: round;
}
@media (min-width: 600px){
	.tp-order-cards {
    grid-template-columns: repeat(2, 1fr) !important;
}
}
@media (max-width: 1200px){
.part4 .g-cols.cols_2{
    grid-template-columns:  1fr;
}
}
/**************************part5********************/



/* =========================================================
   TECHNO POSHTIBAN
   PROCESS SECTION — MORPH IMAGE + OPEN TEXT
   ========================================================= */

.tp-process-row {
    position: relative;
    width: 100%;
    overflow: hidden;

    padding-top: 55px !important;
    padding-bottom: 60px !important;

    background:
        radial-gradient(
            ellipse 55% 80% at 8% 45%,
            rgba(211,224,241,.72) 0%,
            rgba(211,224,241,.28) 45%,
            transparent 75%
        ),
        radial-gradient(
            ellipse 55% 75% at 92% 55%,
            rgba(211,224,241,.60) 0%,
            rgba(211,224,241,.20) 45%,
            transparent 75%
        ),
        linear-gradient(
            180deg,
            #F7FAFD 0%,
            #EDF5FC 52%,
            #F8FBFF 100%
        );
}


/* دکور خیلی ظریف پس زمینه */

.tp-process-row::before {
    content: "";

    position: absolute;

    width: 430px;
    height: 260px;

    left: -170px;
    bottom: -130px;

    background:
        radial-gradient(
            ellipse,
            rgba(211,224,241,.85) 0%,
            rgba(211,224,241,.30) 48%,
            transparent 75%
        );

    border-radius: 50%;

    pointer-events: none;
}


/* ---------------------------------------------------------
   GRID
   --------------------------------------------------------- */

.tp-process-row > .l-section-h {
    position: relative;
    z-index: 2;
}

.tp-process-row .g-cols {
    --columns-gap: 0px !important;
    gap: 0 !important;
}


/* ---------------------------------------------------------
   COLUMN
   --------------------------------------------------------- */

.tp-process-row .wpb_column {
    position: relative;

    padding-inline: 3px !important;

    box-sizing: border-box;
}


/* خط جداکننده بین مراحل */

.tp-process-row .wpb_column:not(:last-child)::after {
    content: "";

    position: absolute;

    top: 300px;
    bottom: 20px;

    left: 0;

    width: 1px;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(7,59,118,.10) 25%,
            rgba(7,59,118,.12) 75%,
            transparent
        );

    pointer-events: none;

    z-index: 2;
}


/* ---------------------------------------------------------
   ITEM
   --------------------------------------------------------- */

.tp-process-item {
    position: relative;

    width: 100%;

    direction: rtl;
    text-align: center;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   IMAGE
   --------------------------------------------------------- */

.tp-process-item__image {
    position: relative;

    width: 100%;
    height: 315px;

    overflow: hidden;

    background: #DCEAF7;

    box-sizing: border-box;

    isolation: isolate;
}


.tp-process-item__image img {
    width: 100% !important;
    height: 100% !important;

    display: block;

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

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

    transform: scale(1.03);

    transition:
        transform .55s ease,
        filter .45s ease;
}


/* ---------------------------------------------------------
   MORPH — 8%
   --------------------------------------------------------- */

/* مرحله اول */

.tp-process-row .wpb_column:nth-child(1)
.tp-process-item__image {
    clip-path: polygon(
        8% 0,
        100% 0,
        100% 100%,
        0 100%
    );
}


/* مرحله دوم */

.tp-process-row .wpb_column:nth-child(2)
.tp-process-item__image {
    clip-path: polygon(
        8% 0,
        100% 0,
        92% 100%,
        0 100%
    );
}


/* مرحله سوم */

.tp-process-row .wpb_column:nth-child(3)
.tp-process-item__image {
    clip-path: polygon(
        8% 0,
        100% 0,
        92% 100%,
        0 100%
    );
}


/* مرحله چهارم */

.tp-process-row .wpb_column:nth-child(4)
.tp-process-item__image {
    clip-path: polygon(
        0% 0,
        100% 0,
        92% 100%,
        0 100%
    );
}


/* ---------------------------------------------------------
   IMAGE FADE
   --------------------------------------------------------- */

.tp-process-item__image::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(255,255,255,.08) 66%,
            rgba(255,255,255,.60) 88%,
            rgba(255,255,255,.96) 100%
        );
}


/* ---------------------------------------------------------
   SHINE
   --------------------------------------------------------- */

.tp-process-item__image::before {
    content: "";

    position: absolute;

    top: 0;
    left: -80%;

    width: 45%;
    height: 100%;

    z-index: 4;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.20),
            transparent
        );

    transform: skewX(-18deg);

    transition: left .8s ease;

    pointer-events: none;
}

.tp-process-item:hover
.tp-process-item__image::before {
    left: 135%;
}


.tp-process-item:hover
.tp-process-item__image img {
    transform: scale(1.07);
}


/* ---------------------------------------------------------
   CONTENT
   مهم:
   دیگر کارت سفید نیست
   --------------------------------------------------------- */

/* هاله نرم بین عکس و بخش متن */
.tp-process-item__content {
    position: relative;
    z-index: 7;
    width: 100%;
    margin: 0;
    padding: 38px 22px 22px;
    min-height: 155px;
    box-sizing: border-box;
    direction: rtl;
    text-align: center;
    background:
        radial-gradient(
            ellipse 75% 55% at 50% 0%,
            rgba(255,255,255,.95) 0%,
            rgba(255,255,255,.48) 42%,
            rgba(237,245,252,0) 78%
        );
}

/* یک منحنی خیلی ظریف در محل اتصال عکس و متن */
.tp-process-item__content::before {
    content: "";
    display: block;

    position: absolute;

    top: -16px;
    left: 8%;
    right: 8%;

    height: 28px;

    border-radius: 50% 50% 0 0 / 100% 100% 0 0;

    background: rgba(255,255,255,.72);

    filter: blur(5px);

    opacity: .85;

    pointer-events: none;

    z-index: -1;
}


/* ---------------------------------------------------------
   ICON
   --------------------------------------------------------- */

.tp-process-item__icon {
    position: absolute;

    top: -29px;
    right: 50%;

    width: 56px;
    height: 56px;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: translateX(50%);

    background: #FFFFFF;

    border:
        1px solid rgba(7,59,118,.08);

    border-radius: 50%;

    color: #073B76;

    box-shadow:
        0 8px 22px rgba(7,59,118,.14);

    z-index: 10;

    transition:
        color .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}


.tp-process-item__icon svg {
    width: 25px;
    height: 25px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.7;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ---------------------------------------------------------
   NUMBER
   --------------------------------------------------------- */

.tp-process-item__number {
    position: absolute;

    top: -17px;
    right: calc(50% - 38px);

    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #1261A8;

    border:
        3px solid #FFFFFF;

    border-radius: 50%;

    color: #FFFFFF;

    font-size: 12px;
    font-weight: 900;

    line-height: 1;

    box-shadow:
        0 5px 14px rgba(7,59,118,.18);

    z-index: 12;

    transition:
        background-color .3s ease,
        transform .3s ease;
}


/* ---------------------------------------------------------
   TITLE
   --------------------------------------------------------- */

.tp-process-item__content h3 {
    position: relative;

    margin: 0 0 15px;

    color: #073B76;

    font-size: 17px;
    font-weight: 900;

    line-height: 1.5;

    text-align: center;
	padding: 0;
}


/* خط طلایی */

.tp-process-item__content h3::after {
    content: "";

    display: block;

    width: 32px;
    height: 3px;

    margin: 8px auto 0;

    background: #FEBD3F;

    border-radius: 20px;

    box-shadow:
        0 2px 8px rgba(254,189,63,.25);
}


/* ---------------------------------------------------------
   TEXT
   --------------------------------------------------------- */

.tp-process-item__content p {
    max-width: 270px;

    margin: 0 auto;

    color: #58708A;

    font-size: 13px;
    font-weight: 500;

    line-height: 2;

    text-align: center;
}


/* ---------------------------------------------------------
   CONNECTING LINE
   --------------------------------------------------------- */

.tp-process-row .g-cols {
    position: relative;
}


/*
   مسیر افقی ظریف بین چهار مرحله
*/

.tp-process-row .g-cols::before {
    content: "";

    position: absolute;

    top: 318px;

    left: 8%;
    right: 8%;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(18,97,168,.10) 10%,
            rgba(18,97,168,.18) 50%,
            rgba(18,97,168,.10) 90%,
            transparent 100%
        );

    z-index: 1;

    pointer-events: none;
}


/* ---------------------------------------------------------
   HOVER
   --------------------------------------------------------- */

.tp-process-item:hover
.tp-process-item__icon {
    color: #1261A8;

    transform:
        translateX(50%)
        translateY(-3px);

    box-shadow:
        0 11px 26px rgba(18,97,168,.18);
}


.tp-process-item:hover
.tp-process-item__number {
    background: #FEBD3F;

    color: #073B76;

    transform: scale(1.06);
}


/* ---------------------------------------------------------
   LAPTOP
   --------------------------------------------------------- */

@media (max-width: 1199px) {

    .tp-process-row {
        padding-top: 45px !important;
        padding-bottom: 50px !important;
    }

    .tp-process-item__image {
        height: 285px;
    }

    .tp-process-item__content {
        padding-inline: 16px;
    }

    .tp-process-item__content h3 {
        font-size: 16px;
    }



    .tp-process-row .g-cols::before {
        top: 288px;
    }

    .tp-process-row .wpb_column:not(:last-child)::after {
        top: 275px;
    }
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1024px) {

    .tp-process-row .g-cols {
        grid-template-columns:
            repeat(2, minmax(0,1fr)) !important;
    }
.tp-process-row .wpb_column:nth-child(2) .tp-process-item__image {
    clip-path: polygon(0% 0, 100% 0, 92% 100%, 0 100%);
}
	.tp-process-row .wpb_column:nth-child(3) .tp-process-item__image {
    clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%);
}
    .tp-process-row .wpb_column {
        padding-inline: 8px !important;
        margin-bottom: 30px;
    }

    .tp-process-item__image {
        height: 270px;
    }

    .tp-process-row .g-cols::before {
        display: none;
    }

    .tp-process-row .wpb_column:not(:last-child)::after {
        display: none;
    }
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 600px) {
.tp-process-row .wpb_column .tp-process-item__image {
    clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%) !important;
}
    .tp-process-row {
        padding-top: 35px !important;
        padding-bottom: 40px !important;
    }

    .tp-process-row .g-cols {
        grid-template-columns: 1fr !important;
    }

    .tp-process-row .wpb_column {
        padding-inline: 12px !important;

        margin-bottom: 35px;
    }

    .tp-process-row .wpb_column:last-child {
        margin-bottom: 0;
    }

    .tp-process-item__image {
        height: 270px;
    }


    /* مورب کمی ظریف‌تر روی موبایل */

    .tp-process-row .wpb_column:nth-child(1)
    .tp-process-item__image {
        clip-path: polygon(
            0 0,
            100% 0,
            96% 100%,
            0 100%
        );
    }

    .tp-process-row .wpb_column:nth-child(2)
    .tp-process-item__image,
    .tp-process-row .wpb_column:nth-child(3)
    .tp-process-item__image {
        clip-path: polygon(
            4% 0,
            100% 0,
            96% 100%,
            0 100%
        );
    }

    .tp-process-row .wpb_column:nth-child(4)
    .tp-process-item__image {
        clip-path: polygon(
            4% 0,
            100% 0,
            100% 100%,
            0 100%
        );
    }


    .tp-process-item__content {
        padding:
            36px 16px 10px;

        min-height: 140px;
    }


    .tp-process-item__icon {
        width: 52px;
        height: 52px;

        top: -27px;
    }

    .tp-process-item__icon svg {
        width: 23px;
        height: 23px;
    }


    .tp-process-item__number {
        width: 29px;
        height: 29px;

        top: -16px;

        right: calc(50% - 36px);
    }


    .tp-process-item__content h3 {
        font-size: 16px;
    }

    .tp-process-item__content p {
        max-width: 310px;



        line-height: 1.9;
    }
}


/* ---------------------------------------------------------
   VERY SMALL MOBILE
   --------------------------------------------------------- */

@media (max-width: 400px) {

    .tp-process-item__image {
        height: 245px;
    }

    .tp-process-item__content {
        padding-inline: 12px;
    }

    .tp-process-item__content h3 {
        font-size: 15px;
    }

    .tp-process-item__content p {
        font-size: 10px;
    }
}
/*****************************part6************************/

/* =========================================================
   TECHNOPOSHTIBAN
   FAQ + CUSTOMER REVIEWS
   ========================================================= */


/* =========================================================
   MAIN SECTION
   ========================================================= */

.tp-faq-reviews {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            ellipse 55% 70% at 0% 20%,
            rgba(211,224,241,.55) 0%,
            rgba(211,224,241,.18) 42%,
            transparent 75%
        ),
        radial-gradient(
            ellipse 50% 65% at 100% 80%,
            rgba(211,224,241,.45) 0%,
            rgba(211,224,241,.12) 42%,
            transparent 75%
        ),
        linear-gradient(
            180deg,
            #F7FAFD 0%,
            #EEF5FB 100%
        );
}


/* =========================================================
   TWO COLUMNS
   ========================================================= */

.tp-faq-reviews > .l-section-h {
    position: relative;
    z-index: 2;
}

.tp-faq-reviews .g-cols {
    align-items: flex-start;
}


/* =========================================================
   COMMON HEADING
   ========================================================= */

.tp-faq-heading,
.tp-reviews-heading {
    width: 100%;
    direction: rtl;
    text-align: right;
    margin-bottom: 25px;
}


/* =========================================================
   HEADING LABEL
   ========================================================= */

.tp-faq-heading__label,
.tp-reviews-heading__label {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 9px;

    color: #073B76;

    font-size: 13px;
    font-weight: 800;
    line-height: 1.5;
}


/* LABEL ICON */

.tp-faq-heading__icon,
.tp-reviews-heading__icon {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 25px;

    color: #FEBD3F;
}

.tp-faq-heading__icon svg,
.tp-reviews-heading__icon svg {
    width: 100%;
    height: 100%;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   MAIN TITLES
   ========================================================= */

.tp-faq-heading__title,
.tp-reviews-heading__title {
    margin: 0 0 9px;

    color: #073B76;

    font-size: 30px;
    font-weight: 900;

    line-height: 1.45;
}

.tp-faq-heading__title span,
.tp-reviews-heading__title span {
    color: #FEBD3F;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.tp-faq-heading__description,
.tp-reviews-heading__description {
    max-width: 520px;

    margin: 0;

    color: #58708A;

    font-size: 15px;
    font-weight: 500;

    line-height: 1.9;
}


/* =========================================================
   FAQ
   ========================================================= */

.tp-faq-column .w-tabs {
    width: 100%;
    direction: rtl;
}


/* REMOVE DEFAULT GAP */

.tp-faq-column .w-tabs-sections {
    display: flex;
    flex-direction: column;
    gap: 9px;
}


/* EACH FAQ ITEM */

.tp-faq-column .w-tabs-section {
    position: relative;

    overflow: hidden;

     margin-bottom: 10px;

    background: #FFFFFF !important;

    color: #073B76 !important;

    border: 1px solid rgba(7,59,118,.08);

    border-radius: 14px;

    box-shadow:
        0 5px 18px rgba(7,59,118,.045);

    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}


/* HOVER */

.tp-faq-column .w-tabs-section:hover {
    border-color: rgba(18,97,168,.18);

    box-shadow:
        0 9px 24px rgba(7,59,118,.08);

    transform: translateY(-1px);
}


/* HEADER */

.tp-faq-column .w-tabs-section-header {
    position: relative;

    min-height: 58px;

    display: flex !important;
    align-items: center;

    padding: 15px 20px 15px 52px !important;

    background: transparent !important;

    color: #073B76 !important;

    direction: rtl;

    text-align: right;

    border: 0 !important;
}


/* QUESTION */

.tp-faq-column .w-tabs-section-title {
    width: 100%;

    margin: 0 !important;

    color: #073B76 !important;

    font-size: 14px !important;
    font-weight: 800 !important;

    line-height: 1.8 !important;

    text-align: right;
}


/* PLUS / MINUS CONTROL */

.tp-faq-column .w-tabs-section-control {
    position: absolute !important;

    left: 17px !important;
    right: auto !important;

    top: 50% !important;

    width: 28px !important;
    height: 28px !important;

    margin: 0 !important;

    transform: translateY(-50%);

    border-radius: 50%;

    background: #F0F6FC;

    color: #1261A8;

    transition:
        background-color .3s ease,
        color .3s ease,
        transform .3s ease;
}


/* CONTROL LINES */

.tp-faq-column .w-tabs-section-control::before,
.tp-faq-column .w-tabs-section-control::after {
    background: currentColor !important;
}


/* ACTIVE FAQ */

.tp-faq-column .w-tabs-section.active {
    border-color: rgba(18,97,168,.20);

    box-shadow:
        0 10px 28px rgba(7,59,118,.09);
}

.tp-faq-column .w-tabs-section.active .w-tabs-section-control {
    background: #073B76;
    color: #FFFFFF;

    transform: translateY(-50%) rotate(180deg);
}


/* ANSWER */

.tp-faq-column .w-tabs-section-content {
    background: #F8FBFE !important;

    border-top: 1px solid rgba(7,59,118,.06);
}


/* ANSWER INNER */

.tp-faq-column .w-tabs-section-content-h {
    padding: 15px 20px 17px !important;

    direction: rtl;

    color: #58708A;
}


/* ANSWER TEXT */

.tp-faq-column .w-tabs-section-content p,
.tp-faq-column .w-tabs-section-content li {
    color: #58708A;

    font-size: 13px;
    font-weight: 500;

    line-height: 2;

    text-align: right;
}


/* ANSWER LIST */

.tp-faq-column .w-tabs-section-content ol,
.tp-faq-column .w-tabs-section-content ul {
    margin: 0;
    padding-right: 20px;
}


/* =========================================================
   REVIEWS
   ========================================================= */

.tp-reviews-column {
    direction: rtl;
}


/* GRID */

.tp-reviews-column .w-grid {
    width: 100%;
}


/* GRID LIST */

.tp-reviews-column .w-grid-list {
    align-items: stretch;
}


/* EACH REVIEW */

.tp-reviews-column .w-grid-item {
    min-width: 0;
}


/* REVIEW CARD */

.tp-reviews-column .w-grid-item-h {
    position: relative;

    height: 100%;

    padding: 22px 22px 20px;

    background:
        linear-gradient(
            145deg,
            #FFFFFF 0%,
            #F9FBFD 100%
        );

    border: 1px solid rgba(7,59,118,.08);

    border-radius: 18px;

    box-shadow:
        0 7px 22px rgba(7,59,118,.055);

    direction: rtl;

    overflow: hidden;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}


/* GOLD TOP LINE */

.tp-reviews-column .w-grid-item-h::before {
    content: "";

    position: absolute;

    top: 0;
    right: 22px;

    width: 42px;
    height: 3px;

    border-radius: 0 0 4px 4px;

    background: #FEBD3F;
}


/* SOFT DECORATIVE GLOW */

.tp-reviews-column .w-grid-item-h::after {
    content: "";

    position: absolute;

    width: 110px;
    height: 110px;

    left: -55px;
    bottom: -65px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(211,224,241,.65) 0%,
            rgba(211,224,241,0) 70%
        );

    pointer-events: none;
}


/* HOVER */

.tp-reviews-column .w-grid-item:hover .w-grid-item-h {
    transform: translateY(-4px);

    border-color: rgba(18,97,168,.17);

    box-shadow:
        0 13px 30px rgba(7,59,118,.10);
}


/* =========================================================
   RATING
   ========================================================= */

.tp-reviews-column .us_testimonial_rating {
    margin: 0 0 12px;
}


/* STARS */

.tp-reviews-column .w-testimonial-rating {
    display: flex;

    align-items: center;

    gap: 3px;

    direction: ltr;
}


/* STAR */

.tp-reviews-column .w-testimonial-rating i {
    position: relative;

    width: 15px;
    height: 15px;

    display: block;

    font-size: 0;

    color: #FEBD3F;
}


/* STAR SHAPE */

.tp-reviews-column .w-testimonial-rating i::before {
    content: "★";

    display: block;

    font-size: 15px;

    line-height: 15px;

    color: #FEBD3F;
}


/* =========================================================
   REVIEW TEXT
   ========================================================= */

.tp-reviews-column .usg_post_content_1 {
    position: relative;

    z-index: 2;

    margin: 0 !important;

    padding: 0 !important;
}


/* REMOVE DEFAULT P MARGINS */

.tp-reviews-column .usg_post_content_1 p {
    margin: 0 0 7px;

    color: #58708A;

    font-size: 11px;
    font-weight: 500;

    line-height: 2;

    text-align: right;
}


/* FIRST PARAGRAPH - CUSTOMER QUESTION */

.tp-reviews-column .usg_post_content_1 > p:first-child {
    color: #073B76;

    font-size: 12px;
    font-weight: 800;

    line-height: 1.9;
}


/* ANSWER */

.tp-reviews-column .usg_post_content_1 .w-comments-item-text p,
.tp-reviews-column .usg_post_content_1 p:not(:first-child) {
    color: #58708A;

    font-size: 10.5px;

    line-height: 1.95;
}


/* =========================================================
   AUTHOR
   ========================================================= */

.tp-reviews-column .usg_hwrapper_1 {
    position: relative;

    z-index: 3;

    margin-top: 15px !important;

    padding-top: 11px;

    border-top: 1px solid rgba(7,59,118,.07);

    justify-content: flex-start !important;

    direction: rtl;
}


/* AUTHOR WRAPPER */

.tp-reviews-column .usg_vwrapper_1 {
    gap: 2px !important;
}


/* NAME */

.tp-reviews-column .us_testimonial_author {
    color: #073B76;

    font-size: 12px;

    font-weight: 900;

    line-height: 1.5;
}


/* LOCATION */

.tp-reviews-column .us_testimonial_role {
    color: #7B91A6 !important;

    font-size: 9.5px;

    font-weight: 500;

    line-height: 1.5;
}


/* =========================================================
   REMOVE IMAGE IF IMPREZA LAYOUT ADDS ONE
   ========================================================= */

.tp-reviews-column .w-grid-item img,
.tp-reviews-column .w-post-elm.post_image {
    display: none !important;
}


/* =========================================================
   RESPONSIVE - TABLET
   ========================================================= */

@media (max-width: 1024px) {

    .tp-faq-heading,
    .tp-reviews-heading {
        margin-bottom: 20px;
    }

    .tp-faq-heading__title,
    .tp-reviews-heading__title {
        font-size: 27px;
    }

    .tp-faq-column .w-tabs-section-header {
        min-height: 54px;

        padding: 13px 17px 13px 48px !important;
    }

    .tp-reviews-column .w-grid-item-h {
        padding: 20px 18px 18px;
    }

}


/* =========================================================
   RESPONSIVE - MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-faq-reviews {
        background:
            linear-gradient(
                180deg,
                #F5F9FD 0%,
                #EDF5FB 100%
            );
    }


    /* COLUMNS */

    .tp-faq-reviews .g-cols {
        row-gap: 42px;
    }


    /* HEADINGS */

    .tp-faq-heading,
    .tp-reviews-heading {
        text-align: center;

        margin-bottom: 20px;
    }

    .tp-faq-heading__label,
    .tp-reviews-heading__label {
        font-size: 12px;
    }

    .tp-faq-heading__icon,
    .tp-reviews-heading__icon {
        width: 21px;
        height: 21px;

        flex-basis: 21px;
    }

    .tp-faq-heading__title,
    .tp-reviews-heading__title {
        font-size: 25px;
    }

    .tp-faq-heading__description,
    .tp-reviews-heading__description {
        margin-inline: auto;

    }


    /* FAQ */

    .tp-faq-column .w-tabs-sections {
        gap: 7px;
    }

    .tp-faq-column .w-tabs-section-header {
        min-height: 54px;

        padding: 12px 15px 12px 46px !important;
    }


    .tp-faq-column .w-tabs-section-control {
        left: 13px !important;

        width: 25px !important;
        height: 25px !important;
    }

    .tp-faq-column .w-tabs-section-content-h {
        padding: 13px 15px 15px !important;
    }

    .tp-faq-column .w-tabs-section-content p,
    .tp-faq-column .w-tabs-section-content li {


        line-height: 1.95;
    }


    /* REVIEWS */

    .tp-reviews-column .w-grid-item-h {
        padding: 20px 18px 18px;

        border-radius: 16px;
    }

    .tp-reviews-column .usg_post_content_1 > p:first-child {
        font-size: 11.5px;
    }

    .tp-reviews-column .usg_post_content_1 p:not(:first-child) {
        font-size: 10.5px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .tp-faq-heading__title,
    .tp-reviews-heading__title {
        font-size: 23px;
    }

    .tp-faq-heading__description,
    .tp-reviews-heading__description {
        font-size: 10.5px;
    }

    .tp-faq-column .w-tabs-section-header {
        padding-right: 13px !important;
        padding-left: 42px !important;
    }


	

    .tp-reviews-column .w-grid-item-h {
        padding: 18px 15px 17px;
    }

}















/* =========================================================
   TECHNO POSHTIBAN
   CUSTOMER REVIEWS

   ========================================================= */


/* ---------------------------------------------------------
   REVIEW ITEM
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial {
    position: relative;

    width: 100%;
    height: auto;

    box-sizing: border-box;

    direction: rtl;
}


/* ---------------------------------------------------------
   CARD
   --------------------------------------------------------- */
.tp-reviews-column article.us_testimonial .w-grid-item-h {
    position: relative;

    width: 100%;
    height: auto;

    box-sizing: border-box;

    padding: 26px 25px 22px;

    background:
        linear-gradient(
            145deg,
            #FFFFFF 0%,
            #F9FBFD 100%
        );

    border: 1px solid rgba(7,59,118,.08);

    border-radius: 18px;

    box-shadow:
        0 8px 24px rgba(7,59,118,.055);

    overflow: hidden;

    direction: rtl;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


/* خط طلایی بالای کارت */

.tp-reviews-column article.us_testimonial .w-grid-item-h::before {
    content: "";

    position: absolute;

    top: 0;
    right: 25px;

    width: 36px;
    height: 3px;

    background: #FEBD3F;

    border-radius: 0 0 5px 5px;
}


/* دکور نوری بسیار ظریف */
.tp-reviews-column article.us_testimonial .w-grid-item-h::after {
    content: "";

    position: absolute;

    width: 120px;
    height: 120px;

    left: -65px;
    bottom: -70px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(211,224,241,.45) 0%,
            rgba(211,224,241,0) 72%
        );

    pointer-events: none;
}


/* ---------------------------------------------------------
   INTERNAL WRAPPER
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial .usg_vwrapper_2 {
    position: relative;

    z-index: 2;

    width: 100%;

    direction: rtl;
}


/* ---------------------------------------------------------
   STARS
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial .us_testimonial_rating {
    margin: 0 0 13px !important;

    direction: ltr;

    text-align: right;
}


.tp-reviews-column article.us_testimonial .w-testimonial-rating {
    display: flex;

    align-items: center;

    justify-content: flex-start;

    gap: 3px;

    direction: ltr;
}


.tp-reviews-column article.us_testimonial
.w-testimonial-rating i {
    width: 15px;
    height: 15px;

    display: block;

    position: relative;
}


/* ستاره واقعی Impreza */
.tp-reviews-column article.us_testimonial
.w-testimonial-rating i::before {
    color: #FEBD3F;
}


/* ---------------------------------------------------------
   REVIEW TEXT
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial
.usg_post_content_1 {
    width: 100%;

    margin: 0 !important;

    direction: rtl;
}


.tp-reviews-column article.us_testimonial
.usg_post_content_1 p {
    margin: 0 !important;

    color: #58708A;

    font-size: 12.5px;

    font-weight: 500;

    line-height: 2;

    text-align: right !important;
}


/* ---------------------------------------------------------
   AUTHOR AREA
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial
.usg_hwrapper_1 {
    position: relative;

    width: 100%;

    margin-top: 16px !important;

    padding-top: 12px;

    border-top:
        1px solid rgba(7,59,118,.08);

    direction: rtl;
}


/* ---------------------------------------------------------
   AUTHOR NAME
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial
.us_testimonial_author {
    margin: 0 !important;
}


.tp-reviews-column article.us_testimonial
.us_testimonial_author .w-post-elm-value {
    display: block;

    color: #073B76;

    font-size: 14px;

    font-weight: 900;

    line-height: 1.5;
}


/* ---------------------------------------------------------
   LOCATION
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial
.us_testimonial_role {
    margin: 0 !important;
}


.tp-reviews-column article.us_testimonial
.us_testimonial_role .w-post-elm-value {
    display: block;

    color: #7C90A4;

    font-size: 12px;

    font-weight: 500;

    line-height: 1.5;
}


/* ---------------------------------------------------------
   HOVER
   --------------------------------------------------------- */

.tp-reviews-column article.us_testimonial:hover
.w-grid-item-h {
    transform: translateY(-4px);

    border-color:
        rgba(18,97,168,.15);

    box-shadow:
        0 14px 32px rgba(7,59,118,.10);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1200px) {

   .tp-reviews-column article.us_testimonial
    .w-grid-item-h {
        padding: 23px 20px 20px;
    }



}
@media (max-width: 1024px) {

.part6 .g-cols.cols_2 {
    grid-template-columns: 1fr;
}

}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tp-reviews-column article.us_testimonial
    .w-grid-item-h {
        padding: 22px 19px 19px;

        border-radius: 16px;
    }

    .tp-reviews-column article.us_testimonial
    .w-grid-item-h::before {
        right: 19px;
        width: 32px;
    }


   .tp-reviews-column article.us_testimonial
    .usg_hwrapper_1 {
        margin-top: 14px !important;

        padding-top: 11px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .tp-reviews-column article.us_testimonial
    .w-grid-item-h {
        padding: 20px 16px 18px;
    }



}

/* =========================================
   Review Cards - Equal Height
   ========================================= */


.tp-reviews-column article.us_testimonial .w-grid-item-h {
    height: 100% !important;

}

/* محتوای اصلی Review */
.tp-reviews-column article.us_testimonial .usg_vwrapper_2 {
padding:0 !important;
}

/* متن فضای باقی‌مانده را پر کند */
.tp-reviews-column article.us_testimonial .usg_post_content_1 {
    flex: 1 1 auto;
}

/* نام و منطقه همیشه پایین کارت */
.tp-reviews-column article.us_testimonial .usg_hwrapper_1 {
    margin-top: 16px !important;
}

/*************************part7**********************/
/* =========================================================
   TECHNO POSHTIBAN
   Coverage Section
   ========================================================= */


/* =========================================================
   SECTION
   ========================================================= */

.tp-coverage-section {
    position: relative;
    overflow: hidden;

    padding-top: 72px !important;
    padding-bottom: 72px !important;

    background:
        radial-gradient(
            ellipse 55% 65% at 8% 20%,
            rgba(211,224,241,.72) 0%,
            rgba(211,224,241,.28) 42%,
            transparent 75%
        ),
        radial-gradient(
            ellipse 55% 65% at 94% 82%,
            rgba(211,224,241,.62) 0%,
            rgba(211,224,241,.20) 42%,
            transparent 75%
        ),
        linear-gradient(
            180deg,
            #F8FBFF 0%,
            #EDF5FC 55%,
            #F7FAFD 100%
        );
}


/* تصویر تهران در پس زمینه */
.tp-coverage-section::before {
     content: "";

    position: absolute;
    inset: 0;

    z-index: 0;

    background-image:
        linear-gradient(
            180deg,
            rgba(248,251,255,.58) 0%,
            rgba(248,251,255,.28) 38%,
            rgba(237,245,252,.42) 72%,
            rgba(248,251,255,.72) 100%
        ),
        url("../../uploads/2026/10/Panoramic-Cityscape-with-Snowy-Mountains-and-Tower.webp");

    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    opacity: 1;

    pointer-events: none;
}


/* محتوا بالای بک گراند */
.tp-coverage-section > * {
    position: relative;
    z-index: 2;
}


/* =========================================================
   HEADING
   ========================================================= */

.tp-coverage-heading {
    width: 100%;
    max-width: 760px;

    margin: 0 auto 44px;

    direction: rtl;
    text-align: center;
}

.tp-coverage-heading__label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 18px;
    padding: 6px 11px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 30px;
    color: rgba(255, 255, 255, .90);
    background: rgba(255, 255, 255, .07);
    font-size: 12px;
    font-weight: 700;
}

.tp-coverage-heading__icon {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #FEBD3F;
}

.tp-coverage-heading__icon svg {
    width: 100%;
    height: 100%;

    display: block;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-coverage-heading__title {
    margin: 0 0 11px;

    color: #fff;

    font-size: 36px;
    font-weight: 900;

    line-height: 1.45;
}

.tp-coverage-heading__title span {
    color: #FEBD3F;
}

.tp-coverage-heading__description {
    max-width: 650px;

    margin: 0 auto;

    color: rgba(255,255,255,.76);

    font-size: 15px;
    font-weight: 500;

    line-height: 2;
}
.tp-coverage-intro1 {
    text-align: center;
}

/* =========================================================
   MAIN LAYOUT
   Desktop:
   1/4 Intro
   3/4 Regions
   ========================================================= */

.tp-coverage-main {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 3fr) !important;

    gap: 22px !important;

    align-items: stretch !important;
}


/* =========================================================
   INTRO / 22 REGIONS
   ========================================================= */

.tp-coverage-intro {
    position: relative;

    width: 100%;
    height: 100%;
    min-height: 100%;

    box-sizing: border-box;

    padding: 38px 30px;

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

    direction: rtl;
    text-align: right;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(254,189,63,.12),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #073B76 0%,
            #0B4D91 55%,
            #1261A8 100%
        );

    border-radius: 25px;

    overflow: hidden;

    box-shadow:
        0 18px 40px rgba(7,59,118,.15);
}


/* دایره‌های تزئینی */
.tp-coverage-intro::before {
    content: "";

    position: absolute;

    width: 260px;
    height: 260px;

    left: -135px;
    bottom: -125px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.12);

    box-shadow:
        0 0 0 26px rgba(255,255,255,.025),
        0 0 0 54px rgba(255,255,255,.018);

    pointer-events: none;
}

.tp-coverage-intro::after {
    content: "";

    position: absolute;

    width: 170px;
    height: 170px;

    right: -75px;
    top: -80px;

    border-radius: 50%;

    background: rgba(254,189,63,.08);

    pointer-events: none;
}

.tp-coverage-intro > * {
    position: relative;
    z-index: 2;
}


/* Badge */
.tp-coverage-intro__badge {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    margin-bottom: 18px;

    padding: 6px 11px;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 30px;

    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.07);

    font-size: 12px;
    font-weight: 700;
}

.tp-coverage-intro__dot {
    width: 6px;
    height: 6px;

    flex: 0 0 6px;

    border-radius: 50%;

    background: #FEBD3F;

    box-shadow:
        0 0 0 5px rgba(254,189,63,.09);
}


/* Number */
.tp-coverage-intro__number {
    color: #FFFFFF;

    font-size: 82px;
    font-weight: 900;

    line-height: .9;

    letter-spacing: -3px;
}

.tp-coverage-intro__number-text {
    margin-top: 9px;

    color: #FEBD3F;

    font-size: 15px;
    font-weight: 800;

    line-height: 1.5;
}

.tp-coverage-intro__text {


    margin: 17px 0 23px;

    color: rgba(255,255,255,.76);

    font-size: 15px;
    font-weight: 500;

    line-height: 2;
}





/* =========================================================
   REGION GRID
   ========================================================= */

.tp-coverage-main > .vc_column_container:nth-child(2) {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 18px;

    align-content: stretch;
}

.tp-coverage-main > .vc_column_container:nth-child(2) > .vc_column-inner {
    display: contents !important;
}


/* =========================================================
   REGION CARD
   ========================================================= */

.tp-coverage-card {
    position: relative;

    width: 100%;
    min-height: 305px;

    box-sizing: border-box;

    padding: 0;

    display: flex;
    flex-direction: column;

    direction: rtl;
    text-align: right;

    background:
        linear-gradient(
            145deg,
            #FFFFFF 0%,
            #F9FBFD 100%
        );

    border: 1px solid rgba(7,59,118,.085);

    border-radius: 22px;

    overflow: hidden;

    box-shadow:
        0 10px 28px rgba(7,59,118,.065);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


/* خط طلایی */
.tp-coverage-card::before {
    content: "";

    position: absolute;

    top: 0;
    right: 24px;

    width: 38px;
    height: 3px;

    background: #FEBD3F;

    border-radius: 0 0 5px 5px;

    z-index: 20;
}


/* =========================================================
   ORGANIC IMAGE
   ========================================================= */

/* =========================================================
   Coverage Card - Organic Corner Image
   ========================================================= */



/* =========================================================
   Icon روی مرز عکس
   ========================================================= */

.tp-coverage-card__icon {
    position: absolute;

    left: 18px;
    bottom: 13px;

    width: 50px;
    height: 50px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border: 4px solid #FFFFFF;
    border-radius: 50%;

    background: #073B76;
    color: #FFFFFF;

    z-index: 8;

    box-shadow:
        0 7px 18px rgba(7,59,118,.20);
}

.tp-coverage-card__icon svg {
    width: 24px;
    height: 24px;

    display: block;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   Content - نزدیک‌تر به عکس
   ========================================================= */


.tp-coverage-card__content h3 {
    margin: 0 0 4px;

    color: #073B76;

    font-size: 19px;
    font-weight: 900;

    line-height: 1.5;
}

.tp-coverage-card__content p {
    margin: 0 0 9px;

    color: #58708A;

    font-size: 10px;
    font-weight: 500;

    line-height: 1.8;
}

.tp-coverage-card__regions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 4px 7px;

    margin-bottom: 12px;
}

.tp-coverage-card__regions span {
    display: inline-flex;
    align-items: center;

    color: #1261A8;

    font-size: 9px;
    font-weight: 800;

    line-height: 1.5;
}







/* =========================================================
   Hover
   ========================================================= */

.tp-coverage-card:hover .tp-coverage-card__visual img {
    transform: scale(1.045);
}

.tp-coverage-card:hover .tp-coverage-card__icon {
    background: #1261A8;
}


/* =========================================================
   Tablet
   ========================================================= */

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



}


/* =========================================================
   Mobile
   ========================================================= */

@media (max-width:768px) {

  
    .tp-coverage-card__icon {
        left: 15px;
        bottom: 10px;

        width: 45px;
        height: 45px;
    }

    .tp-coverage-card__icon svg {
        width: 22px;
        height: 22px;
    }

}


/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width:480px) {



}

/* =========================================================
   ICON
   ========================================================= */

.tp-coverage-card__icon {
    position: absolute;

    left: 18px;
    bottom: 8px;

    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border: 4px solid #FFFFFF;

    border-radius: 50%;

    background: #073B76;

    color: #FFFFFF;

    z-index: 8;

    box-shadow:
        0 7px 17px rgba(7,59,118,.18);
}

.tp-coverage-card__icon svg {
    width: 24px;
    height: 24px;

    display: block;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   CARD CONTENT
   ========================================================= */

.tp-coverage-card__content {
    position: relative;

    width: 100%;

    box-sizing: border-box;

    margin-top: -2px;

    padding:
        3px
        22px
        18px;

    direction: rtl;
    text-align: right;

    z-index: 5;
}


/* Title */
.tp-coverage-card__content h3 {
    margin: 0 0 4px;

    color: #073B76;

    font-size: 18px;
    font-weight: 900;

    line-height: 1.5;
}


/* Description */
.tp-coverage-card__content p {
    margin: 0 0 9px;

    color: #58708A;

    font-size: 10px;
    font-weight: 500;

    line-height: 1.8;
}


/* =========================================================
   REGION NUMBERS
   ========================================================= */

.tp-coverage-card__regions {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 4px 7px;

    margin-bottom: 12px;
}

.tp-coverage-card__regions span {
    display: inline-flex;
    align-items: center;

    color: #1261A8;

    font-size: 9px;
    font-weight: 800;

    line-height: 1.5;
}







/* =========================================================
   CARD HOVER
   ========================================================= */

.tp-coverage-card:hover {
    transform: translateY(-5px);

    border-color:
        rgba(18,97,168,.18);

    box-shadow:
        0 18px 38px rgba(7,59,118,.11);
}

.tp-coverage-card:hover
.tp-coverage-card__visual img {
    transform: scale(1.045);
}

.tp-coverage-card:hover
.tp-coverage-card__icon {
    background: #1261A8;
}


/* =========================================================
   TABLET
   769 - 1024
   ========================================================= */

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

    .tp-coverage-section {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    .tp-coverage-main {
        grid-template-columns: 1fr !important;

        gap: 22px !important;
    }

    .tp-coverage-intro {
        min-height: 300px;

        padding: 32px;

        align-items: center;

        text-align: center;
    }

    .tp-coverage-intro__text {
        max-width: 550px;
    }

    .tp-coverage-main > .vc_column_container:nth-child(2) {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 18px;
    }

    .tp-coverage-card {
        min-height: 300px;
    }

}


/* =========================================================
   MOBILE
   <= 768
   ========================================================= */

@media (max-width:768px) {

    .tp-coverage-section {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }


    /* Heading */

    .tp-coverage-heading {
        margin-bottom: 30px;

        padding-inline: 18px;
    }

    .tp-coverage-heading__label {
        gap: 6px;

        margin-bottom: 7px;

        font-size: 12px;
    }

    .tp-coverage-heading__icon {
        width: 21px;
        height: 21px;
    }

    .tp-coverage-heading__title {
        margin-bottom: 8px;

        font-size: 27px;
    }

    .tp-coverage-heading__description {
        font-size: 13px;

        line-height: 1.9;
    }


    /* Main */

    .tp-coverage-main {
        grid-template-columns: 1fr !important;

        gap: 18px !important;
    }


    /* Intro */

    .tp-coverage-intro {
        min-height: 275px;

        padding: 30px 24px;

        border-radius: 20px;

        align-items: center;

        text-align: center;
    }

    .tp-coverage-intro__number {
        font-size: 70px;
    }

    .tp-coverage-intro__number-text {
        font-size: 14px;
    }

    .tp-coverage-intro__text {
        max-width: 480px;

        margin: 14px 0 19px;

        font-size: 11.5px;
    }


    /* Region grid */

    .tp-coverage-main > .vc_column_container:nth-child(2) {
        grid-template-columns: 1fr;

        gap: 14px;
    }


    /* Cards */

    .tp-coverage-card {
        min-height: 300px;

        border-radius: 19px;
    }


	

    .tp-coverage-card__content {
        padding:
            3px
            18px
            17px;
    }

    .tp-coverage-card__content h3 {
        font-size: 17px;
    }

    .tp-coverage-card__content p {
        font-size: 10px;
    }

    .tp-coverage-card__regions span {
        font-size: 9px;
    }

    .tp-coverage-card__icon {
        left: 15px;
        bottom: 8px;

        width: 45px;
        height: 45px;
    }

    .tp-coverage-card__icon svg {
        width: 22px;
        height: 22px;
    }

}


/* =========================================================
   SMALL MOBILE
   <= 480
   ========================================================= */

@media (max-width:480px) {

    .tp-coverage-card {
        min-height: 285px;
    }


    .tp-coverage-card__content {
        padding-inline: 16px;
    }

    .tp-coverage-card__content h3 {
        font-size: 16px;
    }

    .tp-coverage-card__content p {
        font-size: 9.5px;
    }

    .tp-coverage-card__regions {
        gap: 4px 6px;
    }

    .tp-coverage-card__regions span {
        font-size: 8.5px;
    }


	

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tp-coverage-card,
    .tp-coverage-card__visual img {
        transition: none !important;
    }

}
/* =========================================================
   COVERAGE CARD — IMAGE + CONTENT
   ========================================================= */

.tp-coverage-card {
    position: relative;
    width: 100%;
    min-height: 305px;

    padding: 0 !important;

    display: grid;
    grid-template-columns: 56% 44%;

    direction: ltr;

    overflow: hidden;

    box-sizing: border-box;
}


/* =========================================================
   IMAGE
   ========================================================= */

.tp-coverage-card__visual {
    position: relative;

    width: 100%;
    height: 100%;
    min-height: 305px;

    overflow: hidden;

    z-index: 2;
}


/* خود عکس */
.tp-coverage-card__visual img {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
    object-position: center;

    clip-path: polygon(
        0 0,
        100% 0,
        100% 22%,
        98% 31%,
        94% 40%,
        89% 48%,
        82% 55%,
        73% 61%,
        63% 67%,
        52% 73%,
        40% 80%,
        28% 88%,
        17% 96%,
        0 100%,
        0 0
    );

    transition: transform .45s ease;
}


/*
   یک لایه سفید برای نرم‌تر کردن انتهای Curve
*/
.tp-coverage-card__visual::after {
    content: "";

    position: absolute;

    right: -1px;
    bottom: -1px;

    width: 82px;
    height: 105px;

    background: #FFFFFF;

    border-radius: 100% 0 0 0;

    z-index: 2;

    pointer-events: none;
}


/* =========================================================
   ICON
   ========================================================= */

.tp-coverage-card__icon {
    position: absolute;

    left: 20px;
    bottom: 20px;

    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border: 4px solid #FFFFFF;
    border-radius: 50%;

    background: #073B76;
    color: #FFFFFF;

    z-index: 8;

    box-shadow:
        0 7px 18px rgba(7,59,118,.22);
}

.tp-coverage-card__icon svg {
    width: 25px;
    height: 25px;

    display: block;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   CONTENT
   ========================================================= */

.tp-coverage-card__content {
    position: relative;

    width: 100%;
    height: 100%;

    box-sizing: border-box;

    padding: 38px 20px 22px 8px;

    display: flex;
    flex-direction: column;

    justify-content: center;

    direction: rtl;
    text-align: right;

    background: #FFFFFF;

    z-index: 5;
}


/* عنوان */

.tp-coverage-card__content h3 {
    margin: 0 0 5px;

    color: #073B76;

    font-size: 19px;
    font-weight: 900;

    line-height: 1.5;
}


/* توضیح */

.tp-coverage-card__content p {
    margin: 0 0 13px;

    color: #58708A;

    font-size: 15px;
    font-weight: 500;

    line-height: 1.8;
}


/* =========================================================
   REGIONS
   ========================================================= */

.tp-coverage-card__regions {
    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: 4px;

    margin-bottom: 15px;
}

.tp-coverage-card__regions span {
    position: relative;

    display: flex;
    align-items: center;

    color: #1261A8;

    font-size: 12px;
    font-weight: 800;

    line-height: 1.5;
}


/* نقطه آبی */

.tp-coverage-card__regions span::before {
    content: "";

    width: 5px;
    height: 5px;

    flex: 0 0 5px;

    margin-left: 7px;

    border-radius: 50%;

    background: #1261A8;
}





/* =========================================================
   HOVER
   ========================================================= */

.tp-coverage-card:hover
.tp-coverage-card__visual img {
    transform: scale(1.045);
}

.tp-coverage-card:hover
.tp-coverage-card__icon {
    background: #1261A8;
}


/* =========================================================
   TABLET
   ========================================================= */

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

    .tp-coverage-card {
        min-height: 300px;

        grid-template-columns: 55% 45%;
    }

    .tp-coverage-card__visual {
        min-height: 300px;
    }

    .tp-coverage-card__content {
        padding: 28px 17px 20px 5px;
    }

    .tp-coverage-card__content h3 {
        font-size: 17px;
    }


}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:768px) {

    .tp-coverage-card {
        min-height: 290px;

        grid-template-columns: 55% 45%;
    }

    .tp-coverage-card__visual {
        min-height: 290px;
    }

    .tp-coverage-card__content {
        padding: 25px 15px 18px 4px;
    }

    .tp-coverage-card__content h3 {
        font-size: 17px;
    }



    .tp-coverage-card__regions {
        gap: 3px;
        margin-bottom: 11px;
    }



    .tp-coverage-card__icon {
        left: 14px;
        bottom: 14px;

        width: 45px;
        height: 45px;
    }

    .tp-coverage-card__icon svg {
        width: 22px;
        height: 22px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width:480px) {

    .tp-coverage-card {
        min-height: 270px;
    }

    .tp-coverage-card__visual {
        min-height: 270px;
    }

    .tp-coverage-card__content {
        padding: 22px 12px 15px 3px;
    }

    .tp-coverage-card__content h3 {
        font-size: 16px;
    }

	

}
/* =========================================
   Coverage Number - 22
   ========================================= */

.tp-coverage-intro__number {
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 150px;
    height: 145px;

    margin: 12px 0 4px;

    color: #FFFFFF;

    font-size: 88px;
    font-weight: 900;
    line-height: 1;

    letter-spacing: -3px;

    z-index: 2;

    text-shadow:
        0 6px 18px rgba(0,0,0,.12);
}


/* حلقه‌های ظریف پشت عدد */
.tp-coverage-intro__number::before {
    content: "";

    position: absolute;

    width: 118px;
    height: 118px;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    border: 1px solid rgba(211,224,241,.28);

    border-radius: 50%;

    box-shadow:
        0 0 0 14px rgba(211,224,241,.055),
        0 0 0 28px rgba(211,224,241,.035);

    z-index: -1;
}


/* یک حلقه طلایی خیلی ظریف */
.tp-coverage-intro__number::after {
    content: "";

    position: absolute;

    width: 92px;
    height: 92px;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%)
               rotate(-25deg);

    border: 1px solid rgba(254,189,63,.22);

    border-radius: 50%;

    border-left-color: transparent;
    border-bottom-color: transparent;

    z-index: -1;
}


/* متن زیر عدد */
.tp-coverage-intro__number-text {
    margin-top: 3px;

    color: #FEBD3F;

    font-size: 15px;
    font-weight: 800;

    line-height: 1.5;

    letter-spacing: .1px;
}
@media (max-width:768px) {

    .tp-coverage-intro__number {
        min-width: 125px;
        height: 120px;

        font-size: 72px;
    }

    .tp-coverage-intro__number::before {
        width: 98px;
        height: 98px;
    }

    .tp-coverage-intro__number::after {
        width: 76px;
        height: 76px;
    }

}
/******8888part8**********************************/
/* =========================================================
   MAIN CTA - LEFT CONTENT
   ========================================================= */

.tp-main-cta {
    position: relative;
    overflow: hidden;
}

.tp-main-cta__content {
    position: relative;
    width: 100%;
    max-width: 560px;

    padding: 55px 20px 50px 0;

    box-sizing: border-box;

    direction: rtl;
    text-align: left;

    z-index: 5;
}


/* Badge */

.tp-main-cta__badge {
        display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 18px;
    padding: 6px 11px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 30px;
    color: rgba(255, 255, 255, .90);
    background: rgba(255, 255, 255, .07);
    font-size: 12px;
    font-weight: 700;
}

.tp-main-cta__badge-icon {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(254,189,63,.16);
    color: #FEBD3F;

    flex: 0 0 25px;
}

.tp-main-cta__badge-icon svg {
    width: 14px;
    height: 14px;

    display: block;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.7;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* Title */

.tp-main-cta__title {
    margin: 0 0 14px;

    color: #FFFFFF;

    font-size: 36px;
    font-weight: 900;

    line-height: 1.5;
}

.tp-main-cta__title span {
    color: #FEBD3F;
}


/* Description */

.tp-main-cta__description {


    margin: 0 0 27px;

    color: rgba(255,255,255,.78);

    font-size: 15px;
    font-weight: 500;

    line-height: 2;
}


/* Features */

.tp-main-cta__features {
    display: grid;

    grid-template-columns: repeat(2, minmax(0,1fr));

    gap: 16px 25px;


}

.tp-main-cta__feature {
    display: flex;
    align-items: center;

    gap: 9px;

    min-width: 0;

    direction: ltr;
}

.tp-main-cta__feature-icon {
    width: 37px;
    height: 37px;

    flex: 0 0 37px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(254,189,63,.25);
    border-radius: 50%;

    background: rgba(255,255,255,.05);

    color: #FEBD3F;
}

.tp-main-cta__feature-icon svg {
    width: 19px;
    height: 19px;

    display: block;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-main-cta__feature-text {
    display: flex;
    flex-direction: column;

    gap: 2px;

    min-width: 0;
}

.tp-main-cta__feature-text strong {
    color: #FFFFFF;

    font-size: 14px;
    font-weight: 800;

    line-height: 1.5;
}

.tp-main-cta__feature-text small {
    color: rgba(255,255,255,.58);

    font-size: 13px;


    line-height: 1.5;
}


/* Signature */

.tp-main-cta__signature {
    display: flex;
    flex-direction: column;

    gap: 2px;

    margin-top: 28px;

    color: rgba(255,255,255,.65);

    font-size: 13px;

    line-height: 1.6;
}

.tp-main-cta__signature strong {
    color: #FFFFFF;

    font-size: 14px;
    font-weight: 800;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1024px) {

    .tp-main-cta__content {
        padding: 40px 15px 40px 0;
    }

    .tp-main-cta__title {
        font-size: 30px;
    }



}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:768px) {

    .tp-main-cta__content {
        max-width: none;

        padding: 35px 18px 35px;
    }

    .tp-main-cta__title {
        font-size: 27px;
    }



    .tp-main-cta__features {
        gap: 14px 15px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width:480px) {

    .tp-main-cta__title {
        font-size: 24px;
    }

    .tp-main-cta__features {
        grid-template-columns: 1fr;
    }

}
/* =========================================
   Main CTA - Form Heading
   ========================================= */

.tp-main-cta-form-heading {
    width: 100%;
    direction: rtl;
    text-align: right;
    margin-bottom: 20px;
}

.tp-main-cta-form-heading__label {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 8px;

    color: #073B76;

    font-size: 11px;
    font-weight: 800;
    line-height: 1.5;
}

.tp-main-cta-form-heading__dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;

    border-radius: 50%;

    background: #FEBD3F;

    box-shadow:
        0 0 0 5px rgba(254,189,63,.12);
}

.tp-main-cta-form-heading__title {
    margin: 0 0 7px;

    color: #073B76;

    font-size: 27px;
    font-weight: 900;

    line-height: 1.45;
}

.tp-main-cta-form-heading__title span {
    color: #FEBD3F;
}




/* Tablet */

@media (max-width:1024px) {

    .tp-main-cta-form-heading__title {
        font-size: 24px;
    }



}


/* Mobile */

@media (max-width:768px) {

    .tp-main-cta-form-heading {
        margin-bottom: 17px;
    }

    .tp-main-cta-form-heading__title {
        font-size: 23px;
    }



}
/* =========================================
   Techno Poshtiban - Form Column Box
========================================= */

.formcolumn {
    position: relative;
    box-sizing: border-box;
    padding: 34px 32px !important;
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(7, 59, 118, 0.08);
    border-radius: 24px;
    box-shadow:
        0 18px 45px rgba(7, 59, 118, 0.14),
        0 4px 14px rgba(7, 59, 118, 0.06);
    overflow: hidden;
}

/* خط طلایی بالای باکس */
.formcolumn::before {
    content: "";
    position: absolute;
    top: 0;
    right: 34px;
    width: 70px;
    height: 4px;
    background: #FEBD3F;
    border-radius: 0 0 8px 8px;
}

/* هاله خیلی ظریف داخل باکس */
.formcolumn::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    left: -90px;
    bottom: -100px;
    background: radial-gradient(
        circle,
        rgba(211, 224, 241, 0.45) 0%,
        rgba(211, 224, 241, 0) 72%
    );
    pointer-events: none;
}

/* محتویات ستون بالای دکور قرار بگیرند */
.formcolumn > .vc_column-inner {
    position: relative;
    z-index: 2;
}


/* =========================================
   Hover بسیار ظریف
========================================= */

.formcolumn {
    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}

.formcolumn:hover {
    transform: translateY(-3px);
    border-color: rgba(254, 189, 63, 0.25);
    box-shadow:
        0 24px 55px rgba(7, 59, 118, 0.17),
        0 5px 18px rgba(7, 59, 118, 0.07);
}


/* =========================================
   Tablet
========================================= */

@media (max-width: 1024px) {

    .formcolumn {
        padding: 28px 25px !important;
        border-radius: 21px;
    }

    .formcolumn::before {
        right: 28px;
        width: 60px;
    }
}


/* =========================================
   Mobile
========================================= */

@media (max-width: 768px) {

    .formcolumn {
        padding: 25px 20px !important;
        border-radius: 19px;
        box-shadow:
            0 14px 35px rgba(7, 59, 118, 0.12),
            0 3px 12px rgba(7, 59, 118, 0.05);
    }

    .formcolumn::before {
        right: 22px;
        width: 52px;
        height: 3px;
    }

    .formcolumn:hover {
        transform: none;
    }
}
/* =========================================
   TP - CTA FORM
========================================= */

/* ---------- Form Heading ---------- */

.tp-main-cta-form-heading {
    width: 100%;
    direction: rtl;
    text-align: right;
    margin-bottom: 24px;
}

.tp-main-cta-form-heading__label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 9px;
    color: #073B76;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.5;
}

.tp-main-cta-form-heading__dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: #FEBD3F;
    box-shadow: 0 0 0 5px rgba(254,189,63,.13);
}

.tp-main-cta-form-heading__title {
    margin: 0 0 8px !important;
    padding: 0 !important;
    color: #073B76;
    font-size: 29px;
    font-weight: 900;
    line-height: 1.45;
}

.tp-main-cta-form-heading__title span {
    color: #FEBD3F;
}

.tp-main-cta-form-heading__text {
    margin: 0 !important;
    color: #58708A;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.9;
}


/* =========================================
   Gravity Forms
========================================= */

.formcolumn #gform_wrapper_5 {
    width: 100%;
    margin: 0 !important;
    direction: rtl;
}


/* فرم اصلی */

.formcolumn #gform_5 {
    width: 100%;
    margin: 0 !important;
}


/* فاصله بین فیلدها */

.formcolumn #gform_fields_5 {
    display: flex;
    flex-direction: column;
    gap: 0;
}


/* =========================================
   Phone Field
========================================= */

.formcolumn #field_5_12 {
    width: 100%;
    margin: 0 0 17px !important;
    padding: 0 !important;
}


/* مخفی کردن Label پیش‌فرض */

.formcolumn #field_5_12 .gfield_label {
    display: none !important;
}


/* کانتینر */

.formcolumn #field_5_12 .ginput_container {
    width: 100%;
    margin: 0 !important;
}


/* Input */

.formcolumn #field_5_12 input {
    width: 100% !important;
    height: 54px !important;
    box-sizing: border-box;
    padding: 0 18px !important;

    border: 1px solid #B7CCE3 !important;
    border-radius: 12px !important;

    background: #F8FBFF !important;
    color: #073B76 !important;

    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    direction: rtl;
    text-align: right;

    outline: none !important;

    box-shadow:
        inset 0 1px 2px rgba(7,59,118,.025),
        0 2px 8px rgba(7,59,118,.035);

    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        background-color .25s ease;
}


/* Placeholder */

.formcolumn #field_5_12 input::placeholder {
    color: #7C90A4 !important;
    opacity: 1;
    font-weight: 500;
}


/* Focus */

.formcolumn #field_5_12 input:focus {
    border-color: #1261A8 !important;
    background: #FFFFFF !important;

    box-shadow:
        0 0 0 3px rgba(18,97,168,.10),
        0 5px 15px rgba(7,59,118,.06) !important;
}


/* حذف فلش input number */

.formcolumn #field_5_12 input[type="number"] {
    appearance: textfield !important;
    -moz-appearance: textfield !important;
}

.formcolumn #field_5_12 input[type="number"]::-webkit-inner-spin-button,
.formcolumn #field_5_12 input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}


/* =========================================
   Privacy / Confidential
========================================= */

.formcolumn #field_5_11 {
    position: relative;

    display: flex;
    align-items: center;

    width: 100%;
    box-sizing: border-box;

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

    color: #58708A !important;

    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.7;

    direction: rtl;
}


/* قفل */

.formcolumn #field_5_11::before {
    content: "";
    width: 29px;
    height: 29px;
    flex: 0 0 29px;

    margin-left: 9px;

    border-radius: 9px;

    background:
        rgba(7,59,118,.06);

    border: 1px solid rgba(7,59,118,.10);

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23073B76' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10' width='14' height='10' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3Ccircle cx='12' cy='15' r='1'/%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
}


/* متن محرمانه */

.formcolumn #field_5_11 {
    color: #58708A !important;
}


/* =========================================
   Captcha
========================================= */

.formcolumn #field_5_14 {
    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================
   Submit Button
========================================= */

/* =========================================
   TP Gold Button - Gravity Forms
========================================= */

.formcolumn #gform_submit_button_5 {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    min-width: 180px;
    height: 52px;

    margin: 0 !important;
    padding: 0 28px !important;

    border: 1px solid #FEBD3F !important;
    border-radius: 15px !important;

    background: linear-gradient(
        135deg,
        #FEBD3F 0%,
        #FFD978 100%
    ) !important;

    color: #073B76 !important;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 900 !important;

    line-height: 1 !important;
    cursor: pointer;
    overflow: hidden;

    box-shadow:
        0 8px 20px rgba(254,189,63,.22);

    transition:
        color .3s ease,
        background .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}


/* نور عبوری */

.formcolumn #gform_submit_button_5::before {
    content: "";
    position: absolute;

    top: 0;
    left: -80%;

    width: 55%;
    height: 100%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.38),
        transparent
    );

    transform: skewX(-20deg);

    transition: left .55s ease;

    pointer-events: none;
}


/* هاله نور */

.formcolumn #gform_submit_button_5::after {
    content: "";
    position: absolute;

    width: 80px;
    height: 80px;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    background: radial-gradient(
        circle,
        rgba(255,255,255,.18) 0%,
        transparent 70%
    );

    opacity: .7;
    pointer-events: none;
}


/* Hover */

.formcolumn #gform_submit_button_5:hover {
    transform: translateY(-2px);

    background: transparent !important;

    color: #073B76 !important;

    box-shadow:
        0 10px 25px rgba(254,189,63,.18);
}

.formcolumn #gform_submit_button_5:hover::before {
    left: 130%;
}


/* Active */

.formcolumn #gform_submit_button_5:active {
    transform: translateY(0);
}


/* موبایل */

@media (max-width:768px) {

    .formcolumn #gform_submit_button_5 {
        width: 100%;
        min-width: 0;
        height: 52px;
        border-radius: 14px !important;
    }

}


/* =========================================
   فرم در حالت خطا
========================================= */

.formcolumn .gfield_error input {
    border-color: #D9534F !important;
    box-shadow:
        0 0 0 3px rgba(217,83,79,.08) !important;
}


/* =========================================
   Tablet
========================================= */

@media (max-width:1024px) {

    .tp-main-cta-form-heading {
        margin-bottom: 20px;
    }

    .tp-main-cta-form-heading__title {
        font-size: 25px;
    }



}


/* =========================================
   Mobile
========================================= */

@media (max-width:768px) {

    .tp-main-cta-form-heading {
        margin-bottom: 18px;
    }

    .tp-main-cta-form-heading__title {
        font-size: 23px;
    }



    .formcolumn #field_5_12 input {
        height: 52px !important;
    }

    .formcolumn #gform_submit_button_5 {
        width: 100%;
        height: 50px;
    }

}
.formcolumn {
    position: relative;
    box-sizing: border-box;
    padding: 34px 32px !important;

    background: rgba(255, 255, 255, 0.97);

    border: 1px solid rgba(7, 59, 118, 0.08);
    border-radius: 24px;

    box-shadow:
        0 18px 45px rgba(7, 59, 118, 0.14),
        0 0 0 1px rgba(211, 224, 241, 0.25);

    overflow: visible;
    z-index: 2;
}

/* هاله آبی پشت باکس */
.formcolumn::after {
    content: "";
    position: absolute;

    width: 85%;
    height: 75%;

    left: 7.5%;
    top: 12%;

    background: rgba(45, 127, 249, 0.20);

    filter: blur(45px);

    border-radius: 50%;

    z-index: -1;
    pointer-events: none;
}
/*************************part9*********************/
.tp-articles-button {
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 9px;
    min-height: 44px;

    padding: 0 10px 0 17px;

    border: 1px solid rgba(7, 59, 118, .16);
    border-radius: 13px;

    background: #FFFFFF;

    color: #073B76;

    text-decoration: none !important;

    font-size: 12px;
    font-weight: 800;
    line-height: 1;

    box-shadow: 0 6px 18px rgba(7, 59, 118, .06);

    transition:
        background .3s ease,
        border-color .3s ease,
        color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}

.tp-articles-button__text {
    display: block;
}

.tp-articles-button__icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #073B76;
    color: #FFFFFF;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease;
}

.tp-articles-button__icon svg {
    width: 15px;
    height: 15px;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-articles-button:hover {
    background: #073B76;
    border-color: #073B76;
    color: #FFFFFF !important;

    transform: translateY(-2px);

    box-shadow: 0 10px 24px rgba(7, 59, 118, .14);
}

.tp-articles-button:hover .tp-articles-button__icon {
    background: #FEBD3F;
    color: #073B76;

    transform: translateX(-3px);
}
/* =========================================================
   TECHNOPOSHTIBAN - ARTICLES SECTION
   Cards + Articles Button
========================================================= */


/* =========================================================
   ARTICLES GRID
========================================================= */




/* =========================================================
   ARTICLE CARD
========================================================= */
.tp-articles-section .w-grid-item-h {
    position: relative;

    display: flex !important;
    flex-direction: column !important;

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

    box-sizing: border-box;

    background: #FFFFFF !important;

    border: 1px solid rgba(7,59,118,.08) !important;
    border-radius: 18px !important;

    overflow: hidden;

    box-shadow:
        0 8px 24px rgba(7,59,118,.07),
        0 2px 6px rgba(7,59,118,.035) !important;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


/* Hover */

.tp-articles-section .w-grid-item-h:hover {
    transform: translateY(-5px);

    border-color: rgba(18,97,168,.15) !important;

    box-shadow:
        0 18px 38px rgba(7,59,118,.12),
        0 4px 10px rgba(7,59,118,.05) !important;
}


/* =========================================================
   ARTICLE IMAGE
========================================================= */

.tp-articles-section .usg_post_image_1 {
  position: relative;

    width: 100%;
    height: 245px;

    margin: 0 !important;

    overflow: hidden;

    flex: 0 0 245px;
}





.tp-articles-section .layout_9417 .usg_post_image_1 img {


    transition: transform .5s ease;
}


/* Hover image */

.tp-articles-section .w-grid-item-h:hover
.usg_post_image_1 img {
    transform: scale(1.045);
}


/* =========================================================
   ARTICLE CONTENT
========================================================= */




/* =========================================================
   CATEGORY BADGE
========================================================= */

.tp-articles-section .usg_post_taxonomy_1 {
    margin: 0 0 9px !important;

    line-height: 1;
}


.tp-articles-section .usg_post_taxonomy_1 .w-post-elm-list {
    display: flex;

    flex-wrap: wrap;

    gap: 5px;
}


.tp-articles-section .usg_post_taxonomy_1 .w-btn {
       display: inline-flex !important;
    align-items: center;

    min-height: 23px;

    margin: 0 !important;
    padding: 0 10px !important;

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

    background: #EEF5FC !important;

    color: #1261A8 !important;

    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    box-shadow: none !important;
}


.tp-articles-section
.usg_post_taxonomy_1 .w-btn:hover {
    background: #D3E0F1 !important;
    color: #073B76 !important;
}


/* =========================================================
   ARTICLE TITLE
========================================================= */

.tp-articles-section .usg_post_title_1 {
    margin: 0 0 8px !important;

    color: #073B76 !important;

    font-size: 17px !important;
    font-weight: 900 !important;

    line-height: 1.55 !important;

    text-align: right;
}


.tp-articles-section .usg_post_title_1 a {
    color: #073B76 !important;
    text-decoration: none !important;

    transition: color .25s ease;
}


.tp-articles-section .usg_post_title_1 a:hover {
    color: #1261A8 !important;
}


/* =========================================================
   ARTICLE EXCERPT
========================================================= */

.tp-articles-section .usg_post_content_1 {
    margin: 0 !important;

    color: #58708A !important;

    font-size: 15px !important;
    font-weight: 500 !important;

    line-height: 1.9 !important;

    text-align: right;

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    overflow: hidden;
}


/* =========================================================
   DATE
========================================================= */

.tp-articles-section .usg_hwrapper_1 {
    width: 100%;

    margin-top: 13px !important;
    padding-top: 11px !important;

    border-top: 1px solid rgba(7,59,118,.07);

    color: #8BA0B5 !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    line-height: 1.5;

    direction: rtl;
}


.tp-articles-section .usg_post_date_1 {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    color: #8BA0B5 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.5;
}
.tp-articles-section .layout_9417 .usg_post_date_1::before {
    content: "";

    width: 16px;
    height: 16px;
    flex: 0 0 16px;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238BA0B5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M4 9h16'/%3E%3Cpath d='M8 13h.01M12 13h.01M16 13h.01M8 17h.01M12 17h.01'/%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
/* =========================================================
   SMALL GOLD ACCENT
========================================================= */

.tp-articles-section .w-grid-item-h::before {
    content: "";

    position: absolute;

    top: 0;
    right: 24px;

    width: 38px;
    height: 3px;

    background: #FEBD3F;

    border-radius: 0 0 6px 6px;

    z-index: 5;
}







/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px) {

   .tp-articles-section .usg_post_image_1 {
        height: 220px;
        flex-basis: 220px;
    }

    .tp-articles-section
    .usg_vwrapper_1 {
        padding: 18px 20px 15px !important;
    }

    .tp-articles-section
    .usg_post_title_1 {
        font-size: 15px !important;
    }


}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 768px) {

   .tp-articles-section .w-grid-item-h {
        border-radius: 16px !important;
    }

    .tp-articles-section
    .usg_post_image_1 {
        height: 220px;
        flex-basis: 220px;
    }

    .tp-articles-section
    .usg_vwrapper_1 {
        padding: 19px 18px 16px !important;
    }

    .tp-articles-section
    .usg_post_title_1 {
        font-size: 16px !important;
    }



    .tp-articles-section
    .w-grid-item-h::before {
        right: 18px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .tp-articles-section
    .usg_post_image_1 {
        height: 205px;
        flex-basis: 205px;
    }

    .tp-articles-section
    .usg_vwrapper_1 {
        padding: 18px 16px 15px !important;
    }
}
/*****************************footer*************************/
/* =========================================================
   TECHNOPOSHTIBAN - FOOTER BACKGROUND
========================================================= */

.tp-footer {


    background:
        radial-gradient(
            circle at 12% 82%,
            rgba(45,127,249,.18) 0%,
            rgba(45,127,249,0) 30%
        ),
        radial-gradient(
            circle at 88% 18%,
            rgba(254,189,63,.07) 0%,
            rgba(254,189,63,0) 24%
        ),
        linear-gradient(
            145deg,
            #052A56 0%,
            #073B76 48%,
            #063365 100%
        ) !important;
}


/* =========================================================
   LARGE SOFT CURVE
========================================================= */

.tp-footer::before {
    content: "";

    position: absolute;

    width: 720px;
    height: 260px;

    left: -170px;
    bottom: -175px;

    border: 1px solid rgba(45,127,249,.20);

    border-radius: 50%;

    transform: rotate(-9deg);

    box-shadow:
        0 0 0 22px rgba(45,127,249,.035),
        0 0 0 44px rgba(45,127,249,.022);

    pointer-events: none;
}


/* =========================================================
   GOLD CURVE
========================================================= */

.tp-footer::after {
    content: "";

    position: absolute;

    width: 520px;
    height: 190px;

    right: -170px;
    top: -125px;

    border: 1px solid rgba(254,189,63,.18);

    border-radius: 50%;

    transform: rotate(-14deg);

    pointer-events: none;
}


/* =========================================================
   CONTENT ABOVE DECOR
========================================================= */

.tp-footer > * {
    position: relative;
    z-index: 2;
}


/* =========================================================
   EXTRA SOFT GLOW
   روی یک المان داخلی یا ستون اصلی فوتر
========================================================= */

.tp-footer .l-section-h {
    position: relative;
    z-index: 3;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width:768px) {

    .tp-footer::before {
        width: 460px;
        height: 190px;

        left: -180px;
        bottom: -125px;

        box-shadow:
            0 0 0 16px rgba(45,127,249,.035),
            0 0 0 32px rgba(45,127,249,.02);
    }

    .tp-footer::after {
        width: 340px;
        height: 140px;

        right: -160px;
        top: -90px;
    }
}
.tp-footer-brand {
    width: 100%;
    direction: rtl;
    text-align: right;
}

.tp-footer-brand__logo {
    width: 190px;
    margin-bottom: 18px;
}

.tp-footer-brand__logo img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

.tp-footer-brand__text {
    max-width: 330px;
    margin: 0 0 22px !important;

    color: rgba(255,255,255,.68);

    font-size: 15px;
    font-weight: 500;
    line-height: 2.1;
}


/* =========================================
   Socials
========================================= */

.tp-footer-brand__socials {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tp-footer-brand__social {
    width: 35px;
    height: 35px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(211,224,241,.16);
    border-radius: 10px;

    background: rgba(255,255,255,.035);

    color: #D3E0F1;

    text-decoration: none !important;

    transition:
        background .3s ease,
        border-color .3s ease,
        color .3s ease,
        transform .3s ease;
}

.tp-footer-brand__social svg {
    width: 17px;
    height: 17px;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-footer-brand__social:hover {
    background: #FEBD3F;
    border-color: #FEBD3F;
    color: #073B76;

    transform: translateY(-3px);
}


/* =========================================
   Mobile
========================================= */

@media (max-width:768px) {

    .tp-footer-brand__logo {
        width: 165px;
        margin-bottom: 15px;
    }



}
.tp-footer-column-heading {
    position: relative;

    margin: 0 0 20px;

    direction: rtl;
    text-align: right;
}

.tp-footer-column-heading span {
    position: relative;

    display: inline-block;

    color: #FFFFFF;

    font-size: 16px;
    font-weight: 900;
    line-height: 1.5;
}

.tp-footer-column-heading span::after {
    content: "";

    display: block;

    width: 28px;
    height: 3px;

    margin-top: 7px;

    background: #FEBD3F;

    border-radius: 0 0 5px 5px;
}
/* ================================
   Techno Poshtiban - Footer Menu
================================ */

.tp-footer .us_menu_1 , .tp-footer .us_menu_2{
    width: 100%;
    direction: rtl;
    text-align: right;
}

.tp-footer .menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}

.tp-footer .menu > li {
    margin: 0 0 10px !important;
    padding: 0 !important;
    list-style: none;
}

.tp-footer .menu > li:last-child {
    margin-bottom: 0 !important;
}

.tp-footer .menu > li > a {
    position: relative;
    display: inline-flex;
    align-items: center;

    color: rgba(255,255,255,.68) !important;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.7;

    text-decoration: none !important;

    transition:
        color .25s ease,
        transform .25s ease;
}


/* فلش کوچک کنار لینک */
.tp-footer .menu > li > a::before {
    content: "←";

    display: inline-block;
    margin-left: 8px;

    color: #FEBD3F;
    font-size: 10px;
    font-weight: 700;

    opacity: .75;

    transition:
        transform .25s ease,
        opacity .25s ease;
}


/* Hover */
.tp-footer .menu > li > a:hover {
    color: #FFFFFF;
    transform: translateX(-3px);
}

.tp-footer .menu > li > a:hover::before {
    opacity: 1;
    transform: translateX(-3px);
}


/* ================================
   Mobile
================================ */

@media (max-width:768px) {

    .tp-footer .menu > li {
        margin-bottom: 9px !important;
    }



}
/* ================================
   Techno Poshtiban - Footer Contact
================================ */

.tp-footer-contact {
    width: 100%;
    direction: rtl;
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.tp-footer-contact__item {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.tp-footer-contact__icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(211,224,241,.14);
    border-radius: 10px;

    background: rgba(255,255,255,.035);
    color: #FEBD3F;

    transition:
        background .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.tp-footer-contact__icon svg {
    width: 22px;
    height: 22px;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-footer-contact__content {
    min-width: 0;

    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tp-footer-contact__content small {
    display: block;

    color: rgba(255,255,255,.45);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
}

.tp-footer-contact__content strong,
.tp-footer-contact__content a {
    display: block;

    color: rgba(255,255,255,.82);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.6;

    text-decoration: none !important;

    transition: color .25s ease;
}

.tp-footer-contact__content a:hover {
    color: #FEBD3F;
}

.tp-footer-contact__item:hover .tp-footer-contact__icon {
    background: rgba(254,189,63,.10);
    border-color: rgba(254,189,63,.28);
    transform: translateY(-2px);
}


/* Mobile */

@media (max-width:768px) {

    .tp-footer-contact {
        gap: 12px;
    }

    .tp-footer-contact__icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }



}
.tp-footer-contact__content a {
    overflow-wrap: anywhere;
}
/*copyright*/
.tp-footer-bottom {
    position: relative;
    width: 100%;
    margin-top: 32px;
    padding-top: 18px;
    border-top: 1px solid rgba(211,224,241,.12);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

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

.tp-footer-bottom__copyright {
    color: rgba(255,255,255,.45);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.7;
}

.tp-footer-bottom__links {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tp-footer-bottom__links a {
    color: rgba(255,255,255,.48);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.7;
    text-decoration: none !important;
    transition: color .25s ease;
}

.tp-footer-bottom__links a:hover {
    color: #FEBD3F;
}

.tp-footer-bottom__links span {
    width: 3px;
    height: 3px;
    flex: 0 0 3px;
    border-radius: 50%;
    background: rgba(254,189,63,.55);
}


/* Mobile */

@media (max-width:768px) {

    .tp-footer-bottom {
        margin-top: 32px;
        padding-top: 16px;

        flex-direction: column;
        justify-content: center;
        text-align: center;

        gap: 9px;
    }



}
.tp-footer-bottom__designer {
    display:flex;
    align-items:center;
    gap:4px;

    color:rgba(255,255,255,.45);
    font-size:14px;
    font-weight:500;
    line-height:1.7;
}

.tp-footer-bottom__designer a {
    color:#FEBD3F;
    font-weight:700;
    text-decoration:none !important;
    transition:color .25s ease;
}

.tp-footer-bottom__designer a:hover {
    color:#FFD978;
}
@media (max-width:1024px) {
.innerfooter {
    grid-template-columns: repeat(2, 1fr) !important;
}
}
@media (max-width:480px) {
.innerfooter {
    grid-template-columns:1fr !important;
}
}














/*buttons*/
/* =========================================================
   TECHNOPOSHTIBAN
   MASTER BUTTON SYSTEM
   ========================================================= */

:root {
    --tp-navy: #073B76;
    --tp-navy-dark: #052A56;
    --tp-blue: #1261A8;

    --tp-gold: #FEBD3F;
    --tp-gold-light: #FFD978;
    --tp-gold-dark: #F7B52F;

    --tp-light-blue: #D3E0F1;
    --tp-white: #FFFFFF;

    --tp-btn-ease: cubic-bezier(.22, 1, .36, 1);
}


/* =========================================================
   01. COMMON BUTTON BASE
   ========================================================= */

.tp-gold-button,
.tp-outline-button,
.tp-gold-cta,
.tp-blue-cta {

    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    direction: rtl;

    text-decoration: none !important;

    overflow: hidden;

    box-sizing: border-box;

    cursor: pointer;

    -webkit-tap-highlight-color: transparent;
}


/* جلوگیری از تغییر اندازه داخلی */
.tp-gold-button *,
.tp-outline-button *,
.tp-gold-cta *,
.tp-blue-cta * {
    box-sizing: border-box;
}


/* =========================================================
   02. COMMON ICON / SVG
   ========================================================= */

.tp-gold-button__icon,
.tp-outline-button__icon,
.tp-gold-cta__icon,
.tp-blue-cta__icon {

    display: flex;
    align-items: center;
    justify-content: center;

    position: relative;

    flex-shrink: 0;
}


.tp-gold-button__icon svg,
.tp-outline-button__icon svg,
.tp-gold-cta__icon svg,
.tp-blue-cta__icon svg {

    display: block;

    fill: none;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   03. COMMON INTERACTION
   ========================================================= */

.tp-gold-button:hover,
.tp-outline-button:hover,
.tp-gold-cta:hover,
.tp-blue-cta:hover {

    text-decoration: none !important;
}


.tp-gold-button:focus-visible,
.tp-outline-button:focus-visible,
.tp-gold-cta:focus-visible,
.tp-blue-cta:focus-visible {

    outline: 3px solid rgba(45,127,249,.35);
    outline-offset: 4px;
}


.tp-gold-button:active,
.tp-outline-button:active,
.tp-gold-cta:active,
.tp-blue-cta:active {

    transform:
        translateY(-1px)
        scale(.985);
}


/* =========================================================
   04. HERO GOLD
   ثبت درخواست تعمیرات
   ========================================================= */

.tp-gold-button {

    gap: 14px;

    min-width: 220px;
    height: 58px;

    padding: 8px 18px;

    color: var(--tp-navy);

    background:
        linear-gradient(
            135deg,
            var(--tp-gold-light) 0%,
            var(--tp-gold) 55%,
            var(--tp-gold-dark) 100%
        );

    border: 1px solid rgba(255,255,255,.45);

    border-radius: 18px;

    box-shadow:
        0 8px 24px rgba(254,189,63,.35),
        inset 0 1px 0 rgba(255,255,255,.45);

    font-size: 15px;
    font-weight: 800;

    transition:
        background .4s cubic-bezier(.2,.8,.2,1),
        border-color .4s cubic-bezier(.2,.8,.2,1),
        color .4s cubic-bezier(.2,.8,.2,1),
        box-shadow .4s cubic-bezier(.2,.8,.2,1),
        transform .4s cubic-bezier(.2,.8,.2,1);
}


/* نور متحرک */

.tp-gold-button::before {

    content: "";

    position: absolute;

    top: -30%;
    left: -60%;

    width: 42%;
    height: 160%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.38),
            transparent
        );

    transform: skewX(-20deg);

    pointer-events: none;

    transition: left .8s ease;
}


/* نور داخلی */

.tp-gold-button::after {

    content: "";

    position: absolute;

    inset: 1px;

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 30% 20%,
            rgba(255,255,255,.18),
            transparent 40%
        );

    pointer-events: none;
}


.tp-gold-button__text {

    position: relative;

    z-index: 2;

    white-space: nowrap;

    transition: color .4s ease;
}


.tp-gold-button__icon {

    z-index: 2;

    flex: 0 0 52px;

    width: 52px;
    height: 52px;

    background: rgba(255,255,255,.30);

    border: 1px solid rgba(255,255,255,.25);

    border-radius: 16px;

    transition:
        background .4s ease,
        border-color .4s ease,
        transform .4s var(--tp-btn-ease);
}


.tp-gold-button__icon svg {

    width: 24px;
    height: 24px;

    stroke: var(--tp-navy);

    stroke-width: 2;

    transition:
        stroke .4s ease,
        transform .4s var(--tp-btn-ease);
}


/* Hover */

.tp-gold-button:hover {

    color: var(--tp-gold) !important;

    background: transparent;

    border-color: var(--tp-gold);

    box-shadow:
        0 0 0 1px rgba(254,189,63,.08),
        0 10px 30px rgba(254,189,63,.12);

    transform: translateY(-3px);
}


.tp-gold-button:hover::before {
    left: 125%;
}


.tp-gold-button:hover::after {
    opacity: 0;
}


.tp-gold-button:hover .tp-gold-button__icon {

    background: rgba(254,189,63,.08);

    border-color: rgba(254,189,63,.35);

    transform: translateX(-2px);
}


.tp-gold-button:hover .tp-gold-button__icon svg {

    stroke: var(--tp-gold);

    transform: translateX(-3px);
}


.tp-gold-button:active {

    box-shadow:
        0 5px 15px rgba(254,189,63,.15);
}


/* =========================================================
   05. OUTLINE / PARTS
   ثبت سفارش قطعه
   ========================================================= */

.tp-outline-button {

    gap: 12px;

    min-width: 220px;
    height: 58px;

    padding: 8px 24px;

    color: var(--tp-white);

    background: #073b76;

    border: 0;

    border-radius: 16px;

    font-size: 15px;
    font-weight: 700;

    isolation: isolate;

    transition:
        color .35s ease,
        background .35s ease,
        box-shadow .35s ease,
        transform .35s var(--tp-btn-ease);
}


/* Border نورانی */

.tp-outline-button::before {

    content: "";

    position: absolute;

    inset: 0;

    padding: 1.5px;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            rgba(45,127,249,.15) 0%,
            rgba(45,127,249,.85) 20%,
            rgba(255,255,255,1) 50%,
            rgba(45,127,249,.85) 80%,
            rgba(45,127,249,.15) 100%
        );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;

    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    mask-composite: exclude;

    animation:
        tp-border-glow 3s linear infinite;

    pointer-events: none;

    z-index: -1;
}


/* Glow */

.tp-outline-button::after {

    content: "";

    position: absolute;

    inset: 0;

    border-radius: inherit;

    box-shadow:
        0 0 12px rgba(45,127,249,.18),
        0 0 28px rgba(45,127,249,.10);

    pointer-events: none;

    z-index: -2;

    transition: opacity .35s ease;
}


@keyframes tp-border-glow {

    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 200% 50%;
    }
}


.tp-outline-button__text {

    position: relative;

    z-index: 2;

    white-space: nowrap;

    color: var(--tp-white);

    transition: color .35s ease;
}


.tp-outline-button__icon {

    z-index: 2;

    width: 50px;
    height: 50px;

    flex: 0 0 50px;

    background:
        rgba(211,224,241,.08);

    border:
        1px solid rgba(211,224,241,.16);

    border-radius: 14px;

    transition:
        background .35s ease,
        border-color .35s ease,
        transform .35s var(--tp-btn-ease);
}


.tp-outline-button__icon svg {

    width: 23px;
    height: 23px;

    stroke: var(--tp-white);

    stroke-width: 1.8;

    transition:
        transform .35s var(--tp-btn-ease),
        stroke .35s ease;
}


/* Hover */

.tp-outline-button:hover {

    color: var(--tp-white);

    background: var(--tp-navy);

    transform: translateY(-3px);

    box-shadow:
        0 12px 28px rgba(7,59,118,.35),
        inset 0 1px 0 rgba(255,255,255,.08);
}


.tp-outline-button:hover::before {
    opacity: 0;
}


.tp-outline-button:hover::after {
    opacity: 0;
}


.tp-outline-button:hover .tp-outline-button__text {
    color: var(--tp-white);
}


.tp-outline-button:hover .tp-outline-button__icon {

    background:
        rgba(255,255,255,.08);

    border-color:
        rgba(255,255,255,.18);

    transform: translateX(-2px);
}


.tp-outline-button:hover .tp-outline-button__icon svg {

    stroke: var(--tp-white);

    transform: scale(1.06);
}


.tp-outline-button:active {

    box-shadow:
        0 7px 18px rgba(7,59,118,.25);
}


/* =========================================================
   06. GOLD PILL
   ثبت سفارش فوری
   ========================================================= */

.tp-gold-cta {
  flex-direction: row-reverse;
    min-width: 310px;
    min-height: 76px;

    padding: 8px 10px 8px 30px;

    color: var(--tp-navy);

    background:
        linear-gradient(
            135deg,
            var(--tp-gold-light) 0%,
            var(--tp-gold) 48%,
            var(--tp-gold-dark) 100%
        );

    border: 1px solid rgba(255,255,255,.45);

    border-radius: 999px;

    box-shadow:
        0 10px 30px rgba(254,189,63,.28),
        inset 0 1px 0 rgba(255,255,255,.55);

    transition:
        transform .35s var(--tp-btn-ease),
        box-shadow .35s ease,
        filter .35s ease;
}


/* نور */

.tp-gold-cta::before {

    content: "";

    position: absolute;

    top: -20%;
    left: -35%;

    width: 35%;
    height: 140%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.42),
            transparent
        );

    transform: skewX(-20deg);

    transition: left .7s ease;

    pointer-events: none;
}


.tp-gold-cta__content {

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 2px;

    line-height: 1.2;

    text-align: center;
}


.tp-gold-cta__title {

    display: block;

    font-size: 18px;
    font-weight: 800;

    color: var(--tp-navy);

    white-space: nowrap;
}


.tp-gold-cta__subtitle {

    display: block;

    font-size: 12px;
    font-weight: 600;

    color: rgba(7,59,118,.72);

    white-space: nowrap;
}


.tp-gold-cta__icon {

    flex: 0 0 52px;

    width: 52px;
    height: 52px;

    margin-left: 12px;

    background: var(--tp-navy);

    border-radius: 50%;

    box-shadow:
        0 5px 15px rgba(7,59,118,.25),
        inset 0 1px 0 rgba(255,255,255,.15);

    transition:
        transform .35s var(--tp-btn-ease),
        background .35s ease;
}


.tp-gold-cta__icon svg {

    width: 22px;
    height: 22px;

    stroke: var(--tp-white);

    stroke-width: 2.2;

    transition:
        transform .35s var(--tp-btn-ease);
}


/* Hover */

.tp-gold-cta:hover {

    color: var(--tp-navy);

    transform: translateY(-3px);

    filter: saturate(1.05);

    box-shadow:
        0 16px 38px rgba(254,189,63,.36),
        inset 0 1px 0 rgba(255,255,255,.65);
}


.tp-gold-cta:hover::before {
    left: 125%;
}


.tp-gold-cta:hover .tp-gold-cta__icon {
    transform: scale(1.08);
}


.tp-gold-cta:hover .tp-gold-cta__icon svg {
    transform: translateX(-3px);
}


.tp-gold-cta:active {

    box-shadow:
        0 8px 20px rgba(254,189,63,.25);
}


/* =========================================================
   07. BLUE PILL
   تماس با ما
   ========================================================= */

.tp-blue-cta {

    min-width: 270px;
    min-height: 60px;

    padding: 2px 12px 2px 0px;

    color: var(--tp-white);

    background:
        linear-gradient(
            135deg,
            var(--tp-blue) 0%,
            var(--tp-navy) 55%,
            var(--tp-navy-dark) 100%
        );

    border:
        1px solid rgba(255,255,255,.16);

    border-radius: 999px;

    box-shadow:
        0 12px 32px rgba(7,59,118,.30),
        inset 0 1px 0 rgba(255,255,255,.14);

    transition:
        transform .35s var(--tp-btn-ease),
        box-shadow .35s ease,
        background .35s ease,
        border-color .35s ease;
}


/* نور */

.tp-blue-cta::before {

    content: "";

    position: absolute;

    top: -30%;
    left: -45%;

    width: 38%;
    height: 160%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.28),
            transparent
        );

    transform: skewX(-20deg);

    transition: left .75s ease;

    pointer-events: none;
}


/* نور داخلی */

.tp-blue-cta::after {

    content: "";

    position: absolute;

    inset: 1px;

    border-radius: inherit;

    background:
        radial-gradient(
            circle at 30% 20%,
            rgba(255,255,255,.12),
            transparent 38%
        );

    pointer-events: none;
}


.tp-blue-cta__content {

    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 3px;

    line-height: 1.2;

    text-align: center;
}


.tp-blue-cta__title {

    display: block;

    font-size: 17px;
    font-weight: 400;

    color: var(--tp-white);

    white-space: nowrap;
}


.tp-blue-cta__phone {

    display: block;

    direction: ltr;

    font-size: 22px;
    font-weight: 600;

    letter-spacing: .4px;

    color: var(--tp-white);

    white-space: nowrap;
}


.tp-blue-cta__icon {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
    margin-left: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.22),
            rgba(255,255,255,.08)
        );

    border:
        1px solid rgba(255,255,255,.24);

    border-radius: 50%;

    box-shadow:
        0 5px 18px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.20);

    transition:
        transform .35s var(--tp-btn-ease),
        background .35s ease,
        border-color .35s ease;
}


.tp-blue-cta__icon svg {

    width: 40px;
    height: 40px;

    stroke: var(--tp-white);

    stroke-width: 1.9;

    transition:
        transform .35s var(--tp-btn-ease);
}


/* Hover */

.tp-blue-cta:hover {

    color: var(--tp-white);

    transform: translateY(-3px);

    background:
        linear-gradient(
            135deg,
            var(--tp-navy),
            var(--tp-blue)
        );

    border-color:
        rgba(254,189,63,.65);

    box-shadow:
        0 18px 42px rgba(7,59,118,.38),
        0 0 24px rgba(45,127,249,.18),
        inset 0 1px 0 rgba(255,255,255,.18);
}


.tp-blue-cta:hover::before {
    left: 125%;
}


.tp-blue-cta:hover .tp-blue-cta__icon {

    transform: scale(1.08);

    background: var(--tp-gold);

    border-color: var(--tp-gold);

    box-shadow:
        0 0 20px rgba(254,189,63,.35);
}


.tp-blue-cta:hover .tp-blue-cta__icon svg {

    stroke: var(--tp-navy);

    transform: scale(1.05);
}


.tp-blue-cta:active {

    box-shadow:
        0 8px 20px rgba(7,59,118,.25);
}


/* =========================================================
   08. MOBILE
   ========================================================= */

@media (max-width: 576px) {

    /* HERO GOLD */

    .tp-gold-button {

        min-width: 260px;
        height: 60px;

        gap: 10px;

        padding: 6px 12px;

        border-radius: 16px;

        font-size: 15px;
    }


    .tp-gold-button__icon {

        flex-basis: 46px;

        width: 46px;
        height: 46px;

        border-radius: 14px;
    }


    .tp-gold-button__icon svg {

        width: 21px;
        height: 21px;
    }


    /* OUTLINE */

    .tp-outline-button {

        min-width: 260px;

        height: 60px;

        gap: 9px;

        padding: 6px 14px;

        border-radius: 14px;

        font-size: 15px;
    }


    .tp-outline-button__icon {

        width: 46px;
        height: 46px;

        flex-basis: 46px;

        border-radius: 12px;
    }


    .tp-outline-button__icon svg {

        width: 21px;
        height: 21px;
    }


    /* GOLD PILL */

    .tp-gold-cta {

        min-width: 260px;

        min-height: 68px;

        padding-left: 20px;
    }


    .tp-gold-cta__icon {

        flex-basis: 48px;

        width: 48px;
        height: 48px;

        margin-right: 9px;
    }


    .tp-gold-cta__title {
        font-size: 16px;
    }


    .tp-gold-cta__subtitle {
        font-size: 11px;
    }


    /* BLUE PILL */

    .tp-blue-cta {

        min-width: 260px;

        min-height: 68px;

        padding-right: 20px;
        padding-left: 10px;
    }


    .tp-blue-cta__icon {

        flex-basis: 48px;

        width: 48px;
        height: 48px;

        margin-left: 9px;
    }


    .tp-blue-cta__title {
        font-size: 15px;
    }


    .tp-blue-cta__phone {
        font-size: 19px;
    }
}


/* =========================================================
   09. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tp-gold-button,
    .tp-gold-button *,
    .tp-gold-button::before,
    .tp-gold-button::after,

    .tp-outline-button,
    .tp-outline-button *,
    .tp-outline-button::before,
    .tp-outline-button::after,

    .tp-gold-cta,
    .tp-gold-cta *,
    .tp-gold-cta::before,
    .tp-gold-cta::after,

    .tp-blue-cta,
    .tp-blue-cta *,
    .tp-blue-cta::before,
    .tp-blue-cta::after {

        animation: none !important;

        transition: none !important;
    }
}




@media (max-width: 768px) {

    .tp-blue-cta {
		min-width: 212px;
        min-height: 52px;
        height: 52px;
        padding: 5px 12px 5px 16px;
    }

    .tp-blue-cta__icon {
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
    }

    .tp-blue-cta__icon svg {
        width: 21px;
        height: 21px;
    }

    .tp-blue-cta__content {
        gap: 1px;
    }

    .tp-blue-cta__title {
        font-size: 15px;

    }

    .tp-blue-cta__phone {
        font-size: 16px;

    }
}


/****************************inner-services***************************/
/* =========================================
   SERVICE HERO
========================================= */

.l-header .l-subheader.at_middle {
   
    box-shadow:
        0 4px 14px rgba(7, 59, 118, .06) !important;
}
.home .l-header .l-subheader.at_middle {
   
    box-shadow:none !important;
}
.tp-service-hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse 55% 90% at 0% 50%,
            rgba(211,224,241,.75) 0%,
            rgba(211,224,241,.30) 45%,
            transparent 75%
        ),
        linear-gradient(
            180deg,
            #F8FBFF 0%,
            #EEF6FC 100%
        );
}

.tp-service-hero .l-section-h {
    position: relative;
    z-index: 2;
}

.tp-service-hero .g-cols {
    min-height: 430px;
    align-items: center;
}


/* =========================
   CONTENT
========================= */



.g-breadcrumbs {
    color: #7C90A4;
}
.g-breadcrumbs-separator {
    color: #FEBD3F;
    font-weight: 800;
}



.tp-service-hero__title {
    margin: 0 0 13px !important;

    color: #073B76;
    font-size: 39px;
    font-weight: 900;
    line-height: 1.4;
}

.tp-service-hero__title span {
    color: #FEBD3F;
}

.tp-service-hero__description {
    max-width: 530px;

    margin: 0 0 20px !important;

    color: #58708A;
    font-size: 15px;
    font-weight: 500;
    line-height: 2;
}



/* =========================
   ACTIONS
========================= */

.tp-service-hero__actions {
    display: flex;
    align-items: center;
    gap: 10px;
}


/* Gold */

.tp-service-hero__gold-btn {
    height: 52px;
    min-width: 190px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 0 22px;

    box-sizing: border-box;

    border-radius: 15px;

    background: linear-gradient(
        135deg,
        #FEBD3F 0%,
        #FFD978 100%
    );

    color: #073B76;

    font-size: 11px;
    font-weight: 900;
    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(254,189,63,.20);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.tp-service-hero__gold-btn svg {
    width: 17px;
    height: 17px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-service-hero__gold-btn:hover {
    color: #073B76;
    transform: translateY(-2px);
    box-shadow:
        0 12px 25px rgba(254,189,63,.28);
}


/* Call */

.tp-service-hero__call-btn {
    height: 52px;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 0 16px;

    border: 1px solid rgba(7,59,118,.12);
    border-radius: 15px;

    background: #FFFFFF;

    color: #073B76;

    text-decoration: none !important;

    box-shadow:
        0 6px 18px rgba(7,59,118,.06);

    transition:
        border-color .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}

.tp-service-hero__call-icon {
    width: 32px;
    height: 32px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #073B76;
    color: #FFFFFF;
}

.tp-service-hero__call-icon svg {
    width: 16px;
    height: 16px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-service-hero__call-btn > span:last-child {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.tp-service-hero__call-btn strong {
    color: #073B76;
    font-size: 10px;
    font-weight: 900;
}

.tp-service-hero__call-btn small {
    color: #7C90A4;
    font-size: 9px;
    font-weight: 600;
}

.tp-service-hero__call-btn:hover {
    transform: translateY(-2px);
    border-color: rgba(18,97,168,.20);
    box-shadow:
        0 10px 24px rgba(7,59,118,.10);
}


/* =========================
   VISUAL
========================= */

.tp-service-hero__visual {
    position: relative;

    width: 100%;
    height: 430px;

    display: flex;
    align-items: center;
    justify-content: center;

    direction: ltr;
}

.tp-service-hero__shape {
    position: absolute;

    width: 590px;
    height: 430px;

    left: 50%;
    top: 50%;

    transform:
        translate(-50%, -50%)
        rotate(-50deg);

    background:
        linear-gradient(
            145deg,
            #D3E0F1 0%,
            #BBD4ED 100%
        );

    border-radius:
        48% 52% 58% 42% /
        46% 38% 62% 54%;

    opacity: .55;
}
.tp-service-hero__visual::before {
    content: "";
    position: absolute;
    width: 430px;
    height: 460px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-8deg);

    background:
        linear-gradient(
            145deg,
            #D3E0F1 0%,
            #8FC3F5 42%,
            #1261A8 100%
        );

    border-radius:
        48% 52% 58% 42% /
        42% 38% 62% 58%;

    z-index: 0;
}
.tp-service-hero__visual::after {
    content: "";
    position: absolute;
    width: 460px;
    height: 370px;
    left: 58%;
    top: 54%;
    transform: translate(-50%, -50%) rotate(12deg);

    background: rgba(18, 97, 168, .82);

    border-radius:
        62% 38% 48% 52% /
        55% 45% 55% 45%;

    z-index: 1;
}
.tp-service-hero__image {
    position: relative;
    z-index: 3;
}
.tp-service-hero__image {
    position: relative;

    width: 470px;
    height: 400px;

    display: flex;
    align-items: flex-end;
    justify-content: center;

    z-index: 3;
}

.tp-service-hero__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
    object-position: center bottom;

    filter:
        drop-shadow(0 18px 25px rgba(7,59,118,.13));
}


/* Badge */

.tp-service-hero__badge {
    position: absolute;

    right: 5%;
    bottom: 38px;

    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px 13px;

    border: 1px solid rgba(7,59,118,.08);
    border-radius: 13px;

    background: rgba(255,255,255,.94);

    box-shadow:
        0 10px 25px rgba(7,59,118,.10);

    direction: rtl;

    z-index: 5;
}

.tp-service-hero__badge-icon {
    width: 35px;
    height: 35px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(254,189,63,.14);
    color: #1261A8;
}

.tp-service-hero__badge-icon svg {
    width: 22px;
    height: 22px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tp-service-hero__badge span:last-child {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.tp-service-hero__badge strong {
    color: #073B76;
    font-size: 14px;
    font-weight: 900;
}

.tp-service-hero__badge small {
    color: #7C90A4;
    font-size: 13px;
    font-weight: 500;
}
.tp-service-hero__content {
    padding: 42px 55px 42px 20px;
}
.tp-service-hero__feature-icon {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(254,189,63,.13);
    color: #1261A8;
}

.tp-service-hero__feature-icon svg {
    width: 14px;
    height: 14px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1024px) {
    .tp-service-hero__content {
        padding: 35px 35px 35px 10px;
    }
    .tp-service-hero .g-cols {
        min-height: 400px;
    }

    .tp-service-hero__content {
        padding: 35px 10px 35px 0;
    }

    .tp-service-hero__title {
        font-size: 32px;
    }

    .tp-service-hero__description {
        font-size: 13px;
    }

    .tp-service-hero__visual {
        height: 400px;
    }

    .tp-service-hero__shape {
        width: 330px;
        height: 285px;
    }

    .tp-service-hero__image {
        width: 400px;
        height: 360px;
    }

    .tp-service-hero__badge {
        right: 0;
        bottom: 30px;
    }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {
    .tp-service-hero__content {
        padding: 25px 18px 35px;
    }
    .tp-service-hero .g-cols {
        min-height: auto;
        display: flex !important;
        flex-direction: column !important;
    }

    .tp-service-hero .vc_column_container {
        width: 100% !important;
    }

    /* تصویر بالا */

    .tp-service-hero__visual {
        order: 1;
        height: 310px;
        margin-bottom: 0;
    }

    .tp-service-hero__content {
        order: 2;

        max-width: none;

        padding: 25px 18px 35px;

        text-align: center;
    }

    .tp-service-hero__breadcrumb {
        justify-content: center;
    }



    .tp-service-hero__title {
        font-size: 28px;
    }

    .tp-service-hero__description {
        margin-right: auto !important;
        margin-left: auto !important;

        font-size: 13px;
        line-height: 1.9;
    }



    .tp-service-hero__actions {
        justify-content: center;
        flex-wrap: wrap;
    }

    .tp-service-hero__shape {
        width: 285px;
        height: 230px;
    }

    .tp-service-hero__image {
        width: 330px;
        height: 295px;
    }

    .tp-service-hero__badge {
        right: 8%;
        bottom: 18px;
    }
}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .tp-service-hero__visual {
        height: 275px;
    }

    .tp-service-hero__image {
        width: 290px;
        height: 260px;
    }

    .tp-service-hero__shape {
        width: 250px;
        height: 210px;
    }

    .tp-service-hero__title {
        font-size: 25px;
    }





    .tp-service-hero__actions {
        flex-direction: column;
        width: 100%;
    }

    .tp-service-hero__gold-btn,
    .tp-service-hero__call-btn {
        width: 100%;
        justify-content: center;
    }

    .tp-service-hero__badge {
        right: 3%;
        bottom: 12px;
    }
}
/* =========================================
   SERVICE HERO VISUAL - RESPONSIVE SHAPES
========================================= */

@media (max-width: 1024px) {
.tp-service-hero__actions {

    flex-direction: column;
}
    .tp-service-hero__visual::before {
        width: 350px;
        height: 300px;

        left: 50%;
        top: 50%;

        transform:
            translate(-50%, -50%)
            rotate(-8deg);
    }

    .tp-service-hero__visual::after {
        width: 300px;
        height: 235px;

        left: 57%;
        top: 53%;

        transform:
            translate(-50%, -50%)
            rotate(11deg);
    }

}


@media (max-width: 768px) {

    .tp-service-hero__visual::before {
        width: 285px;
        height: 235px;

        left: 50%;
        top: 50%;

        transform:
            translate(-50%, -50%)
            rotate(-8deg);
    }

    .tp-service-hero__visual::after {
        width: 245px;
        height: 190px;

        left: 57%;
        top: 53%;

        transform:
            translate(-50%, -50%)
            rotate(11deg);
    }

}


@media (max-width: 480px) {

    .tp-service-hero__visual::before {
        width: 250px;
        height: 205px;

        left: 50%;
        top: 50%;

        transform:
            translate(-50%, -50%)
            rotate(-8deg);
    }

    .tp-service-hero__visual::after {
        width: 215px;
        height: 165px;

        left: 57%;
        top: 53%;

        transform:
            translate(-50%, -50%)
            rotate(11deg);
    }

}


/********************inner-heading*****************/






.tp-section-heading__title {
    margin: 0 0 10px !important;

    color: #073B76;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
}

.tp-section-heading__title span {
    color: #FEBD3F;
}




@media (max-width: 768px) {

    .tp-section-heading {
        margin-bottom: 25px;
        padding-inline: 18px;
    }



    .tp-section-heading__title {
        font-size: 20px;
        line-height: 1.5;
    }


}
/* =========================================
   TECHNOPOSHTIBAN - SERVICE FEATURES
   ========================================= */

.tp-svc-feature {
    position: relative;
    height: 100%;
    min-height: 205px;
    padding: 25px 24px 22px;
    box-sizing: border-box;

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

    direction: rtl;
    text-align: center;

    background: #FFFFFF;
    border: 1px solid rgba(7, 59, 118, .08);
    border-radius: 18px;

    box-shadow:
        0 8px 24px rgba(7, 59, 118, .055);

    overflow: hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


/* نور ظریف بالای کارت */
.tp-svc-feature::before {
    content: "";
    position: absolute;

    top: 0;
    right: 15%;
    left: 15%;

    height: 2px;

    background: linear-gradient(
        90deg,
        transparent,
        #FEBD3F,
        transparent
    );

    opacity: .7;
}


/* آیکن */
.tp-svc-feature__icon {
    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 14px;

    border-radius: 15px;

    background:
        linear-gradient(
            145deg,
            rgba(254, 189, 63, .16),
            rgba(211, 224, 241, .45)
        );

    color: #1261A8;

    transition:
        background .35s ease,
        color .35s ease,
        transform .35s ease,
        box-shadow .35s ease;
}


.tp-svc-feature__icon svg {
    width: 25px;
    height: 25px;

    display: block;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* محتوای کارت */
.tp-svc-feature__content {
    width: 100%;
    max-width: 330px;
}


/* عنوان */
.tp-svc-feature__title {
    margin: 0 0 9px !important;

    color: #073B76;

    font-size: 15px;
    font-weight: 900;
    line-height: 1.6;

    transition: color .3s ease;
}


/* متن */
.tp-svc-feature__text {
    margin: 0 !important;

    color: #58708A;

    font-size: 13px;
    font-weight: 500;
    line-height: 2;

    text-align: center;
}


/* لینک داخل متن */
.tp-svc-feature__text a {
    color: #1261A8;
    font-weight: 800;

    text-decoration: none !important;

    border-bottom: 1px solid rgba(18, 97, 168, .25);

    transition:
        color .25s ease,
        border-color .25s ease;
}


.tp-svc-feature__text a:hover {
    color: #FEBD3F;
    border-color: #FEBD3F;
}


/* =========================================
   HOVER
   ========================================= */

.tp-svc-feature:hover {
    transform: translateY(-5px);

    border-color: rgba(254, 189, 63, .32);

    box-shadow:
        0 15px 35px rgba(7, 59, 118, .10);
}


.tp-svc-feature:hover .tp-svc-feature__icon {

    color: #FEBD3F;

    transform: translateY(-2px);

    box-shadow:
        0 8px 18px rgba(7, 59, 118, .16);
}


.tp-svc-feature:hover .tp-svc-feature__title {
    color: #1261A8;
}


/* =========================================
   DESKTOP - چهار ستون
   ========================================= */

.tp-service-features .g-cols {
    align-items: stretch !important;
    --columns-gap: 14px !important;
}


.tp-service-features .vc_column_container {
    min-width: 0;
}


.tp-service-features .vc_column-inner {
    height: 100%;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {

    .tp-svc-feature {
        min-height: 215px;
        padding: 22px 17px 20px;
        border-radius: 16px;
    }

    .tp-svc-feature__icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
        margin-bottom: 12px;
        border-radius: 14px;
    }

    .tp-svc-feature__icon svg {
        width: 23px;
        height: 23px;
    }

.tp-svc-feature .g-cols.cols_4{
    grid-template-columns: repeat(2, 1fr);
}

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 768px) {

    .tp-service-features {
        padding-top: 14px !important;
        padding-bottom: 14px !important;
    }

    .tp-service-features .g-cols {
        --columns-gap: 10px !important;
        row-gap: 10px !important;
    }

    .tp-svc-feature {
        min-height: 0;
        height: 100%;

        padding: 20px 15px 18px;

        border-radius: 15px;
    }

    .tp-svc-feature__icon {
        width: 45px;
        height: 45px;
        flex-basis: 45px;

        margin-bottom: 11px;

        border-radius: 13px;
    }

    .tp-svc-feature__icon svg {
        width: 21px;
        height: 21px;
    }

    .tp-svc-feature__title {
        margin-bottom: 7px !important;
        font-size: 14px;
        line-height: 1.6;
    }

    .tp-svc-feature__text {
        font-size: 13px;
        line-height: 1.9;
    }

}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 480px) {

    .tp-service-features .g-cols {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px !important;
    }

    .tp-service-features .vc_column_container {
        width: 100% !important;
    }

    .tp-svc-feature {
        padding: 18px 12px 17px;
        border-radius: 14px;
    }

    .tp-svc-feature__icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }

    .tp-svc-feature__icon svg {
        width: 20px;
        height: 20px;
    }



}
/* =========================================
   SERVICE PROBLEMS
   ========================================= */

.tp-svc-problems__grid {
    position: relative;
    z-index: 2;

    width: calc(100% - 48px);
    max-width: 1250px;

    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}


/* هر مشکل */
.tp-svc-problem {
    position: relative;


    padding: 14px 18px;

    box-sizing: border-box;

    display: flex;
    align-items: center;

  
    box-shadow: 0 5px 16px rgba(7,59,118,.035);

    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}


/* آیکن یکسان برای همه */
.tp-svc-problem::before {
    content: "✓";

    width: 30px;
    height: 30px;

    flex: 0 0 30px;

    margin-left: 11px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(254,189,63,.15);

    color: #1261A8;

    font-size: 14px;
    font-weight: 900;
    line-height: 1;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease;
}


/* متن */
.tp-svc-problem__text {
    color: #073B76;


    font-weight: 800;
    line-height: 1.7;
}


/* Hover */
.tp-svc-problem:hover {
    transform: translateY(-3px);

    background: #FFFFFF;

    border-color: rgba(254,189,63,.30);

    box-shadow: 0 10px 25px rgba(7,59,118,.08);
}


.tp-svc-problem:hover::before {
    background: #073B76;
    color: #FEBD3F;

    transform: scale(1.08);
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width:1024px) {

    .tp-svc-problems__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .tp-svc-problem {
        min-height: 70px;
        padding: 13px 14px;
    }

    .tp-svc-problem::before {
        width: 28px;
        height: 28px;
        flex-basis: 28px;

        margin-left: 9px;

        font-size: 13px;
    }

    .tp-svc-problem__text {
      font-weight: 600;
    }

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width:768px) {

    .tp-svc-problems__grid {
        width: calc(100% - 30px);

        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    .tp-svc-problem {
        min-height: 68px;
        padding: 11px 10px;

        border-radius: 12px;
    }

    .tp-svc-problem::before {
        width: 27px;
        height: 27px;
        flex-basis: 27px;

        margin-left: 8px;

        font-size: 12px;
    }

    .tp-svc-problem__text {
        font-size: 14px;
        line-height: 1.65;
    }

}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width:480px) {

    .tp-svc-problems__grid {
        width: calc(100% - 24px);
        gap: 8px;
    }

    .tp-svc-problem {
        min-height: 64px;
        padding: 9px 8px;
    }

    .tp-svc-problem::before {
        width: 25px;
        height: 25px;
        flex-basis: 25px;

        margin-left: 7px;

        font-size: 12px;
    }



}
/* =========================================
   SERVICE CTA
   ========================================= */

.tp-svc-cta {
    position: relative;
    width: calc(100% - 48px);
    max-width: 1250px;
    min-height: 135px;

    margin: 45px auto 0;

    padding: 25px 30px;
    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    direction: rtl;

    background:
        radial-gradient(
            circle at 8% 50%,
            rgba(18,97,168,.75),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #052A56 0%,
            #073B76 55%,
            #1261A8 100%
        );

    border-radius: 20px;

    overflow: hidden;

    box-shadow:
        0 15px 40px rgba(7,59,118,.15);
}


/* نور طلایی ظریف */
.tp-svc-cta::before {
    content: "";

    position: absolute;

    width: 170px;
    height: 170px;

    left: -70px;
    top: -65px;

    border-radius: 50%;

    background: rgba(254,189,63,.10);

    filter: blur(8px);

    pointer-events: none;
}


/* محتوای سمت راست */
.tp-svc-cta__content {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;

    gap: 15px;
}


/* آیکن */
.tp-svc-cta__icon {
    width: 48px;
    height: 48px;

    flex: 0 0 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px;

    background: rgba(254,189,63,.14);

    border: 1px solid rgba(254,189,63,.25);

    color: #FEBD3F;
}


.tp-svc-cta__icon span {
    font-size: 22px;
    font-weight: 900;
}


/* متن */
.tp-svc-cta__text {
    direction: rtl;
    text-align: right;
}


.tp-svc-cta__title {
    margin: 0 0 6px !important;

    color: #FFFFFF;

    font-size: 18px;
    font-weight: 900;
    line-height: 1.6;
}


.tp-svc-cta__description {
    margin: 0 !important;

    color: rgba(255,255,255,.72);

    font-size: 12px;
    font-weight: 500;
    line-height: 1.8;
}


/* دکمه */



/* =========================================
   TABLET
   ========================================= */

@media (max-width: 768px) {

    .tp-svc-cta {
        width: calc(100% - 30px);

        min-height: auto;

        margin: 35px auto;

        padding: 22px 20px;

        gap: 20px;
    }

    .tp-svc-cta__title {
        font-size: 15px;
    }





}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 560px) {

    .tp-svc-cta {
        flex-direction: column;
        align-items: stretch;

        padding: 20px 17px;

        border-radius: 17px;
    }

    .tp-svc-cta__content {
        align-items: flex-start;
    }

    .tp-svc-cta__icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
        border-radius: 12px;
    }

    .tp-svc-cta__title {
        font-size: 14px;
    }




}
/* =========================================
   TECHNOPOSHTIBAN - SERVICE NOTE
   ========================================= */

.tp-svc-note {
    position: relative;

    width: calc(100% - 48px);
    max-width: 1250px;

    margin: 28px auto 0px;

    padding: 16px 20px;

    box-sizing: border-box;

    display: flex;
    align-items: center;

    gap: 14px;

    direction: rtl;
    text-align: right;

    background: #F4F8FC;

    border: 1px solid rgba(7,59,118,.08);
    border-right: 3px solid #FEBD3F;

    border-radius: 14px;

    box-shadow: 0 5px 18px rgba(7,59,118,.035);

    overflow: hidden;
}


/* هاله بسیار ظریف */
.tp-svc-note::before {
    content: "";

    position: absolute;

    width: 130px;
    height: 130px;

    left: -55px;
    top: -45px;

    border-radius: 50%;

    background: rgba(211,224,241,.45);

    pointer-events: none;
}


/* آیکن */
.tp-svc-note__icon {
    position: relative;
    z-index: 1;

    width: 38px;
    height: 38px;

    flex: 0 0 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    background: rgba(254,189,63,.15);

    color: #1261A8;
}


.tp-svc-note__icon span {
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}


/* محتوا */
.tp-svc-note__content {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: baseline;
    gap: 10px;

    min-width: 0;
}


/* عنوان */
.tp-svc-note__title {
    flex: 0 0 auto;

    color: #073B76;

    font-size: 15px;
    font-weight: 900;

    white-space: nowrap;
}


/* متن */
.tp-svc-note__text {
    margin: 0 !important;

    color: #58708A;

    font-size: 14px;
    font-weight: 500;

    line-height: 1.9;
}


/* =========================================
   HOVER
   ========================================= */

.tp-svc-note {
    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}

.tp-svc-note:hover {
    border-right-color: #1261A8;

    box-shadow:
        0 8px 22px rgba(7,59,118,.07);
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 768px) {

    .tp-svc-note {
        width: calc(100% - 30px);

        margin: 24px auto 30px;

        padding: 14px 15px;

        gap: 11px;

        align-items: flex-start;
    }

    .tp-svc-note__icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;

        border-radius: 10px;
    }

    .tp-svc-note__icon span {
        font-size: 16px;
    }

    .tp-svc-note__content {
        display: block;
    }

    .tp-svc-note__title {
        display: block;

        margin-bottom: 3px;

    }


}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 480px) {

    .tp-svc-note {
        width: calc(100% - 24px);

        padding: 13px 12px;

        border-radius: 12px;
    }

    .tp-svc-note__icon {
        width: 31px;
        height: 31px;
        flex-basis: 31px;

        border-radius: 9px;
    }

    .tp-svc-note__icon span {
        font-size: 15px;
    }
}
/******************************table**********************/
 /* =========================================
   TECHNOPOSHTIBAN
   SERVICE PRICE TABLE
   ========================================= */

.tp-svc-price {
    position: relative;
    width: 100%;
    padding: 2rem 0 0;
    box-sizing: border-box;

    direction: rtl;

    background:
        linear-gradient(
            180deg,
            #F8FBFF 0%,
            #FFFFFF 100%
        );

    overflow: hidden;
}


/* =========================================
   HEADING
   ========================================= */

.tp-svc-price__heading {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 760px;

    margin: 0 auto 32px;

    padding: 0 20px;
    box-sizing: border-box;

    text-align: center;
}


.tp-svc-price__label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 8px;

    color: #1261A8;

    font-size: 12px;
    font-weight: 800;
}


.tp-svc-price__label::before {
    content: "";

    width: 7px;
    height: 7px;

    margin-left: 7px;

    border-radius: 50%;

    background: #FEBD3F;

    box-shadow:
        0 0 0 5px rgba(254,189,63,.10);
}


.tp-svc-price__title {
    margin: 0 0 9px !important;

    color: #073B76;

    font-size: 31px;
    font-weight: 900;
    line-height: 1.5;
}


.tp-svc-price__title span {
    color: #FEBD3F;
}


.tp-svc-price__description {
    max-width: 600px;

    margin: 0 auto !important;

    color: #58708A;

    font-size: 11px;
    font-weight: 500;

    line-height: 1.9;
}


/* =========================================
   TABLE WRAPPER
   ========================================= */

.tp-svc-price__table-wrap {
    position: relative;
    z-index: 2;

    width: calc(100% - 48px);
    max-width: 1320px;

    margin: 0 auto;

    overflow-x: auto;
    overflow-y: hidden;

    border-radius: 18px;

    background: #FFFFFF;

    border: 1px solid rgba(7,59,118,.08);

    box-shadow:
        0 12px 35px rgba(7,59,118,.07);

    -webkit-overflow-scrolling: touch;

    scrollbar-width: thin;
    scrollbar-color: #B7CCE3 #F4F8FC;
}


/* Chrome / Edge scrollbar */
.tp-svc-price__table-wrap::-webkit-scrollbar {
    height: 7px;
}

.tp-svc-price__table-wrap::-webkit-scrollbar-track {
    background: #F4F8FC;
}

.tp-svc-price__table-wrap::-webkit-scrollbar-thumb {
    background: #B7CCE3;
    border-radius: 20px;
}


/* =========================================
   TABLE
   ========================================= */

.tp-svc-price__table {
    width: 100%;

    min-width: 1050px;

    border-collapse: separate;
    border-spacing: 0;

    table-layout: fixed;

    direction: rtl;

    color: #073B76;

    font-size: 11px;
}


/* =========================================
   COLUMN WIDTHS
   ========================================= */

.tp-svc-price__table th:first-child,
.tp-svc-price__table td:first-child {
    width: 55px;
}

.tp-svc-price__table th:nth-child(2),
.tp-svc-price__table td:nth-child(2) {
    width: 330px;
}


/* =========================================
   HEADER
   ========================================= */

.tp-svc-price__table thead th {
    height: 64px;

    padding: 12px 10px;

    box-sizing: border-box;

    background: #073B76;

    color: #FFFFFF;

    border: 0;

    font-size: 14px;
    font-weight: 800;

    line-height: 1.6;

    white-space: normal;
	text-align:center;
}


/* header first cell */
.tp-svc-price__table thead th:first-child {
    border-radius: 0 0 0 0;
}


/* header bottom separator */
.tp-svc-price__table thead th {
    border-bottom: 3px solid #FEBD3F;
}


/* =========================================
   BODY CELLS
   ========================================= */

.tp-svc-price__table tbody td {
    min-height: 62px;

    padding: 14px 11px;

    box-sizing: border-box;

    background: #FFFFFF;

    border-bottom: 1px solid rgba(7,59,118,.065);

    color: #58708A;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.8;

    text-align: center;

    vertical-align: middle;

    transition:
        background .25s ease,
        color .25s ease;
}


/* service name */
.tp-svc-price__table tbody td:nth-child(2) {
    color: #073B76;
border-right: 1px solid rgba(7, 59, 118, .08);
    font-weight: 700;

    text-align: center;
}


/* row number */
.tp-svc-price__table tbody td:first-child {
    color: #9AAABD;

    font-size: 14px;
    font-weight: 800;
}


/* =========================================
   ROW HOVER
   ========================================= */

.tp-svc-price__table tbody tr:hover td {
    background: #F8FBFF;
}


.tp-svc-price__table tbody tr:hover td:first-child {
    color: #1261A8;
}


/* =========================================
   PRICE CELLS
   ========================================= */

.tp-svc-price__table tbody td:nth-child(n+3) {
    color: #1261A8;

    font-size: 14px;
    font-weight: 900;
border-right: 1px solid rgba(7, 59, 118, .08);
    white-space: nowrap;
}


/* قیمت‌ها کمی برجسته‌تر */
.tp-svc-price__table tbody td:nth-child(n+3)::after {
    content: " تومان";

    color: #8A9CAF;

    font-size: 11px;
    font-weight: 600;
}


/* =========================================
   EMPTY PRICE
   ========================================= */

.tp-svc-price__table tbody td:nth-child(n+3) {
    position: relative;
}


/* =========================================
   LAST ROW
   ========================================= */

.tp-svc-price__table tbody tr:last-child td {
    border-bottom: 0;
}


/* =========================================
   MOBILE TABLE
   ========================================= */

@media (max-width: 768px) {

    .tp-svc-price {
        padding: 48px 0 55px;
    }


    .tp-svc-price__heading {
        margin-bottom: 25px;

        padding-inline: 18px;
    }





    .tp-svc-price__title {
        font-size: 25px;
    }





    .tp-svc-price__table-wrap {
        width: calc(100% - 24px);

        border-radius: 14px;
    }


    .tp-svc-price__table {
        min-width: 1000px;

    }


    .tp-svc-price__table th:first-child,
    .tp-svc-price__table td:first-child {
        width: 48px;
    }


    .tp-svc-price__table th:nth-child(2),
    .tp-svc-price__table td:nth-child(2) {
        width: 290px;
    }


    .tp-svc-price__table thead th {
        height: 58px;
text-align:center;
        padding: 10px 8px;


    }


    .tp-svc-price__table tbody td {
        padding: 13px 9px;



        line-height: 1.75;
    }


    .tp-svc-price__table tbody td:nth-child(2) {
        font-size: 13px;
    }


    .tp-svc-price__table tbody td:nth-child(n+3) {
        font-size: 13px;
    }


    .tp-svc-price__table tbody td:nth-child(n+3)::after {
        font-size: 11px;
    }

}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 480px) {

    .tp-svc-price {
        padding: 42px 0 48px;
    }


    .tp-svc-price__title {
        font-size: 23px;
    }


    .tp-svc-price__table-wrap {
        width: calc(100% - 18px);

        border-radius: 12px;
    }


    .tp-svc-price__table {
        min-width: 960px;
    }


    .tp-svc-price__table th:nth-child(2),
    .tp-svc-price__table td:nth-child(2) {
        width: 270px;
    }


    .tp-svc-price__table thead th {
        height: 54px;

        padding: 8px 7px;


    }


    .tp-svc-price__table tbody td {
        padding: 12px 7px;


    }


}
/* =========================================
   TECHNOPOSHTIBAN - SERVICE CONTACT
   ========================================= */

.tp-svc-contact {
    position: relative;

    width: calc(100% - 48px);
    max-width: 1250px;

    margin: 40px auto;

    padding: 22px 25px;

    box-sizing: border-box;

    display: flex;
    align-items: center;
    gap: 15px;

    direction: rtl;

    background:
        linear-gradient(
            135deg,
            #F4F8FC 0%,
            #FFFFFF 100%
        );

    border: 1px solid rgba(7,59,118,.08);
    border-radius: 18px;

    box-shadow:
        0 8px 25px rgba(7,59,118,.055);

    overflow: hidden;
}


/* خط طلایی سمت راست */
.tp-svc-contact::before {
    content: "";

    position: absolute;

    top: 18px;
    bottom: 18px;
    right: 0;

    width: 3px;

    border-radius: 3px 0 0 3px;

    background: #FEBD3F;
}


/* آیکن */
.tp-svc-contact__icon {
    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: rgba(254,189,63,.14);

    color: #1261A8;
}


.tp-svc-contact__icon span {
    font-size: 20px;
    font-weight: 900;
}


/* محتوا */
.tp-svc-contact__content {
    flex: 1 1 auto;
    min-width: 0;

    text-align: right;
}


.tp-svc-contact__title {
    margin: 0 0 5px !important;

    color: #073B76;

    font-size: 15px;
    font-weight: 900;

    line-height: 1.6;
}


.tp-svc-contact__text {
    margin: 0 !important;

    color: #58708A;

    font-size: 14px;
    font-weight: 500;

    line-height: 1.9;
}


/* =========================================
   PHONE BUTTON
   ========================================= */

.tp-svc-contact__phone {
    flex: 0 0 auto;

    min-width: 185px;
    height: 52px;

    padding: 0 15px;

    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    border-radius: 14px;

    background: #073B76;

    color: #FFFFFF;

    text-decoration: none !important;

    box-shadow:
        0 7px 18px rgba(7,59,118,.14);

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}


.tp-svc-contact__phone-icon {
    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #FEBD3F;

    color: #073B76;
}


.tp-svc-contact__phone-icon svg {
    width: 22px;
    height: 22px;

    fill: none;
    stroke: currentColor;

    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


.tp-svc-contact__phone-content {
    display: flex;
    flex-direction: column;

    gap: 1px;

    text-align: right;
}


.tp-svc-contact__phone-content strong {
    color: #FFFFFF;

    font-size: 13px;
    font-weight: 800;
}


.tp-svc-contact__phone-content span {
    color: #FEBD3F;

    font-size: 14px;
    font-weight: 900;

    direction: ltr;
}


.tp-svc-contact__phone:hover {
    color: #FFFFFF;

    background: #1261A8;

    transform: translateY(-2px);

    box-shadow:
        0 10px 24px rgba(7,59,118,.18);
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 768px) {

    .tp-svc-contact {
        width: calc(100% - 30px);

        margin: 32px auto;

        padding: 18px;

        align-items: flex-start;

        flex-wrap: wrap;
    }

    .tp-svc-contact__icon {
        width: 40px;
        height: 40px;
        flex-basis: 40px;

        border-radius: 11px;
    }

    .tp-svc-contact__icon span {
        font-size: 18px;
    }

    .tp-svc-contact__content {
        flex: 1 1 calc(100% - 55px);
    }

    .tp-svc-contact__title {
        font-size: 14px;
    }

    .tp-svc-contact__text {
        font-size: 13px;
        line-height: 1.85;
    }

    .tp-svc-contact__phone {
        width: 100%;
        height: 48px;
        margin-top: 5px;
    }

}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 480px) {

    .tp-svc-contact {
        width: calc(100% - 24px);

        padding: 15px;

        border-radius: 15px;
    }





}
/* =========================================
   TP SERVICE PROCESS
   ========================================= */




/* ---------- Heading ---------- */

.tp-svc-process__heading {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 760px;
    margin: 0 auto 35px;
    padding: 0 20px;
    box-sizing: border-box;
    text-align: center;
}

.tp-svc-process__label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-bottom: 8px;
    color: #1261A8;
    font-size: 12px;
    font-weight: 800;
}

.tp-svc-process__label::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #FEBD3F;
    box-shadow: 0 0 0 5px rgba(254,189,63,.10);
}

.tp-svc-process__title {
    margin: 0 !important;
    color: #073B76;
    font-size: 31px;
    font-weight: 900;
    line-height: 1.5;
}

.tp-svc-process__title span {
    color: #FEBD3F;
}


/* ---------- Steps ---------- */

.tp-svc-process__steps {
    position: relative;
    z-index: 2;

    max-width: 1250px;

    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.single-us_portfolio .tp-svc-process__steps {
    grid-template-columns: repeat(4, 1fr);
}
/* ---------- Connector line ---------- */

.tp-svc-process__steps::before {
    content: "";

    position: absolute;

    top: 34px;
    right: 12%;
    left: 12%;

    height: 1px;

    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(18,97,168,.16) 15%,
        rgba(18,97,168,.16) 85%,
        transparent 100%
    );

    z-index: 0;
}


/* ---------- Step ---------- */

.tp-svc-process__step {
    position: relative;
    z-index: 1;

    min-height: 205px;

    padding: 25px 22px 22px;

    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: center;

    text-align: center;

    background: #F8FBFF;

    border: 1px solid rgba(7,59,118,.07);
    border-radius: 18px;

    box-shadow:
        0 7px 22px rgba(7,59,118,.045);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease,
        background .35s ease;
}


/* ---------- Number ---------- */

.tp-svc-process__number {
    width: 48px;
    height: 48px;

    flex: 0 0 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 15px;

    box-sizing: border-box;

    border: 3px solid #073B76;
    border-radius: 10px;

    background: #FFFFFF;

    color: #073B76;

    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: 900;

    box-shadow:
        5px 5px 0 rgba(7,59,118,.10);

    transition:
        background .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}


/* ---------- Content ---------- */

.tp-svc-process__content {
    width: 100%;
    max-width: 260px;
}

.tp-svc-process__content h3 {
    margin: 0 0 9px !important;

    color: #073B76;

    font-size: 14px;
    font-weight: 900;

    line-height: 1.6;

    transition: color .3s ease;
}

.tp-svc-process__content p {
    margin: 0 !important;

    color: #58708A;

    font-size: 13px;
    font-weight: 500;

    line-height: 2;
}


/* ---------- Hover ---------- */

.tp-svc-process__step:hover {
    transform: translateY(-5px);

    background: #FFFFFF;

    border-color: rgba(254,189,63,.35);

    box-shadow:
        0 15px 32px rgba(7,59,118,.09);
}

.tp-svc-process__step:hover .tp-svc-process__number {
    background: #073B76;
    color: #FEBD3F;

    border-color: #073B76;

    transform: translateY(-2px);

    box-shadow:
        5px 5px 0 rgba(254,189,63,.22);
}

.tp-svc-process__step:hover .tp-svc-process__content h3 {
    color: #1261A8;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {

    .tp-svc-process__steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .tp-svc-process__steps::before {
        display: none;
    }

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 768px) {

    .tp-svc-process {
        padding: 48px 0 55px;
    }

    .tp-svc-process__heading {
        margin-bottom: 25px;
        padding-inline: 18px;
    }

    .tp-svc-process__label {
        font-size: 11px;
    }

    .tp-svc-process__title {
        font-size: 25px;
        line-height: 1.55;
    }

    .tp-svc-process__steps {
        width: calc(100% - 24px);

        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 9px;
    }

    .tp-svc-process__step {
        min-height: 190px;
        padding: 20px 14px 18px;
        border-radius: 14px;
    }

    .tp-svc-process__number {
        width: 43px;
        height: 43px;
        flex-basis: 43px;

        margin-bottom: 12px;

        font-size: 16px;
    }



    .tp-svc-process__content p {

        line-height: 1.9;
    }

}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 480px) {

    .tp-svc-process {
        padding: 42px 0 48px;
    }

    .tp-svc-process__title {
        font-size: 23px;
    }

    .tp-svc-process__steps {
        width: calc(100% - 18px);
        gap: 8px;
    }

    .tp-svc-process__step {
        min-height: 185px;
        padding: 18px 11px 16px;
    }

    .tp-svc-process__number {
        width: 40px;
        height: 40px;
        flex-basis: 40px;

        font-size: 15px;
    }





}
/* =========================================
   TP SERVICE WORK CTA
   ========================================= */

.tp-svc-work-cta {
    position: relative;

    width: calc(100% - 48px);
    max-width: 1250px;

    min-height: 145px;

    margin: 40px auto 50px;
    padding: 25px 30px;

    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    direction: rtl;

    background:
        radial-gradient(
            circle at 10% 50%,
            rgba(18,97,168,.65) 0%,
            rgba(18,97,168,0) 32%
        ),
        linear-gradient(
            110deg,
            #052A56 0%,
            #073B76 58%,
            #1261A8 100%
        );

    border-radius: 20px;

    box-shadow:
        0 16px 40px rgba(7,59,118,.16);

    overflow: hidden;
}


/* نور ظریف پس زمینه */

.tp-svc-work-cta::before {
    content: "";

    position: absolute;

    width: 220px;
    height: 220px;

    left: -80px;
    top: -70px;

    border-radius: 50%;

    background: rgba(211,224,241,.07);

    pointer-events: none;
}


/* خط طلایی بالای باکس */

.tp-svc-work-cta::after {
    content: "";

    position: absolute;

    top: 0;
    right: 12%;
    left: 12%;

    height: 2px;

    background: linear-gradient(
        90deg,
        transparent,
        #FEBD3F,
        transparent
    );

    opacity: .8;
}


/* =========================================
   CONTENT
   ========================================= */

.tp-svc-work-cta__content {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;

    gap: 15px;

    min-width: 0;
}


.tp-svc-work-cta__icon {
    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background: rgba(254,189,63,.13);

    color: #FEBD3F;
}


.tp-svc-work-cta__icon svg {
    width: 27px;
    height: 27px;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}


.tp-svc-work-cta__text {
    min-width: 0;
}


.tp-svc-work-cta__text h2 {
    margin: 0 0 7px !important;

    color: #FFFFFF;

    font-size: 18px;
    font-weight: 900;

    line-height: 1.5;
}


.tp-svc-work-cta__text p {
    max-width: 650px;

    margin: 0 !important;

    color: rgba(255,255,255,.78);

    font-size: 14px;
    font-weight: 500;

    line-height: 2;
}


/* =========================================
   BUTTONS
   ========================================= */

.tp-svc-work-cta__actions {
    position: relative;
    z-index: 2;

    flex: 0 0 auto;

    display: flex;
    align-items: center;

    gap: 9px;
}


.tp-svc-work-cta__button {
    height: 48px;

    padding: 0 17px;

    box-sizing: border-box;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    border-radius: 12px;

    text-decoration: none !important;

    font-size: 13px;
    font-weight: 900;

    white-space: nowrap;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease,
        border-color .3s ease,
        color .3s ease;
}


.tp-svc-work-cta__button svg {
    width: 16px;
    height: 16px;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* دکمه طلایی */

.tp-svc-work-cta__button--gold {
    min-width: 155px;

    background: linear-gradient(
        135deg,
        #FEBD3F 0%,
        #FFD978 100%
    );

    color: #073B76;

    box-shadow:
        0 8px 20px rgba(254,189,63,.20);
}


.tp-svc-work-cta__button--gold:hover {
    color: #073B76;

    transform: translateY(-2px);

    box-shadow:
        0 12px 25px rgba(254,189,63,.30);
}


/* دکمه تلفنی */

.tp-svc-work-cta__button--outline {
    min-width: 135px;

    background: rgba(255,255,255,.07);

    border: 1px solid rgba(255,255,255,.25);

    color: #FFFFFF;
}


.tp-svc-work-cta__button--outline:hover {
    color: #073B76;

    background: #FFFFFF;

    border-color: #FFFFFF;

    transform: translateY(-2px);

    box-shadow:
        0 8px 20px rgba(0,0,0,.12);
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {

    .tp-svc-work-cta {
        padding: 22px 24px;

        gap: 20px;
    }

    .tp-svc-work-cta__text h2 {
        font-size: 16px;
    }



    .tp-svc-work-cta__button {
        padding-inline: 13px;
    }

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 768px) {

    .tp-svc-work-cta {
        width: calc(100% - 24px);

        margin: 30px auto 40px;

        padding: 22px 18px;

        flex-direction: column;

        align-items: stretch;

        gap: 18px;

        border-radius: 16px;
    }


    .tp-svc-work-cta__content {
        align-items: flex-start;
    }


    .tp-svc-work-cta__icon {
        width: 44px;
        height: 44px;
        flex-basis: 44px;

        border-radius: 12px;
    }


    .tp-svc-work-cta__icon svg {
        width: 23px;
        height: 23px;
    }


    .tp-svc-work-cta__text h2 {
        font-size: 14px;
    }





    .tp-svc-work-cta__actions {
        width: 100%;
    }


    .tp-svc-work-cta__button {
        flex: 1;

        min-width: 0;

        height: 46px;

        padding-inline: 10px;

        font-size: 12px;
    }

}


/* =========================================
   SMALL MOBILE
   ========================================= */

@media (max-width: 480px) {

    .tp-svc-work-cta {
        width: calc(100% - 18px);

        padding: 18px 14px;

        border-radius: 14px;
    }


    .tp-svc-work-cta__content {
        gap: 11px;
    }


    .tp-svc-work-cta__icon {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }


    .tp-svc-work-cta__text h2 {
        font-size: 13px;
    }





    .tp-svc-work-cta__actions {
        gap: 7px;
    }


    .tp-svc-work-cta__button {
        height: 44px;

      
    }

}
/********************comment****************************/
/* =========================================================
   TECHNOPOSHTIBAN
   COMMENTS / REVIEWS - MODERN STYLE
   ========================================================= */

#comments.w-comments {
    width: calc(100% - 48px);
    max-width: 1180px;
    margin: 55px auto 70px;
    direction: rtl;
    text-align: right;
    color: #102A43;
}


/* ---------------------------------------------------------
   عنوان بخش
   --------------------------------------------------------- */

#comments .w-comments-title {
    position: relative;
    margin: 0 0 32px !important;
    padding: 0 0 16px;
    color: #073B76;
    font-size: 24px;
    font-weight: 900;
    line-height: 1.6;
    border-bottom: 1px solid rgba(7,59,118,.08);
}

#comments .w-comments-title::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    width: 75px;
    height: 3px;
    border-radius: 10px;
    background: #FEBD3F;
}

#comments .w-comments-title > span {
    color: #1261A8;

	
    font-weight: 800;
}

#comments .w-comments-title a {
    color: #1261A8;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none !important;
    transition: color .25s ease;
}

#comments .w-comments-title a:hover {
    color: #FEBD3F;
}


/* ---------------------------------------------------------
   لیست کامنت‌ها
   --------------------------------------------------------- */

#comments .w-comments-list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}


/* ---------------------------------------------------------
   کامنت اصلی
   --------------------------------------------------------- */

#comments .w-comments-list > .w-comments-item {
    position: relative;
    margin: 0 0 16px !important;
    padding: 22px 24px 19px !important;
    box-sizing: border-box;

    background: #FFFFFF;
    border: 1px solid rgba(7,59,118,.08);
    border-radius: 16px;

    box-shadow:
        0 7px 24px rgba(7,59,118,.045);

    list-style: none !important;

    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}

#comments .w-comments-list > .w-comments-item:hover {
    border-color: rgba(18,97,168,.16);

    box-shadow:
        0 12px 30px rgba(7,59,118,.075);

    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   نوار ظریف سمت راست
   --------------------------------------------------------- */

#comments .w-comments-list > .w-comments-item::before {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 20px;
    right: 0;
    width: 3px;

    border-radius: 3px 0 0 3px;
    background: #FEBD3F;

    opacity: .9;
}


/* ---------------------------------------------------------
   اطلاعات نویسنده
   --------------------------------------------------------- */

#comments .w-comments-item-meta {
    display: flex;
    align-items: center;
    gap: 11px;

    margin: 0 0 15px !important;
    min-height: 50px;
}


/* آواتار */

#comments .w-comments-item-meta .avatar {
display:none;
}


/* نام */

#comments .w-comments-item-author {
    display: flex;
    align-items: center;

    margin: 0 !important;
}

#comments .w-comments-item-author span {
    color: #073B76;
    font-size: 14px;
    font-weight: 900;
}

#comments .w-comments-item-author a {
    text-decoration: none !important;
}


/* تاریخ */

#comments .w-comments-item-date {
    margin-right: auto;

    color: #9AAABD !important;

    font-size: 12px;
    font-weight: 500;

    text-decoration: none !important;
}


/* ---------------------------------------------------------
   متن کامنت
   --------------------------------------------------------- */

#comments .w-comments-item-text {
    margin: 0 !important;
    padding: 0 0 15px;

    color: #58708A;

    font-size: 14px;
    font-weight: 500;

    line-height: 2;

    text-align: right;
}

#comments .w-comments-item-text p {
    margin: 0 !important;
}

#comments .w-comments-item-text br {
    line-height: 1.8;
}

#comments .w-comments-item-text a {
    color: #1261A8;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid rgba(18,97,168,.22);
}

#comments .w-comments-item-text a:hover {
    color: #FEBD3F;
    border-color: #FEBD3F;
}


/* ---------------------------------------------------------
   دکمه پاسخ
   --------------------------------------------------------- */

#comments .comment-reply-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 54px;
    height: 28px;

    padding: 0 11px;

    box-sizing: border-box;

    border-radius: 8px;

    background: #F4F8FC;
    border: 1px solid rgba(7,59,118,.08);

    color: #1261A8 !important;

    font-size: 12px;
    font-weight: 800;

    text-decoration: none !important;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        transform .25s ease;
}

#comments .comment-reply-link:hover {
    background: #073B76;
    border-color: #073B76;
    color: #FFFFFF !important;

    transform: translateY(-1px);
}


/* ---------------------------------------------------------
   پاسخ‌های تکنو پشتیبان
   --------------------------------------------------------- */

#comments .w-comments-item .children {
    position: relative;

    margin: 18px 0 0 !important;
    padding: 0 24px 0 0 !important;

    list-style: none !important;
}


/* خط اتصال Reply */

#comments .w-comments-item .children::before {
    content: "";

    position: absolute;

    top: 0;
    right: 8px;
    bottom: 18px;

    width: 1px;

    background:
        linear-gradient(
            to bottom,
            rgba(254,189,63,.65),
            rgba(211,224,241,.25)
        );
}


/* کارت پاسخ */

#comments .children > .w-comments-item {
    position: relative;

    margin: 0 0 10px !important;
    padding: 17px 19px 15px !important;

    background:
        linear-gradient(
            135deg,
            #F4F8FC 0%,
            #FFFFFF 100%
        );

    border: 1px solid rgba(18,97,168,.10);

    border-radius: 13px;

    box-shadow:
        0 5px 16px rgba(7,59,118,.035);

    list-style: none !important;
}


/* نوار طلایی پاسخ */

#comments .children > .w-comments-item::before {
    content: "";

    position: absolute;

    top: 15px;
    bottom: 15px;
    right: 0;

    width: 3px;

    border-radius: 3px 0 0 3px;

    background: #1261A8;
}


/* نام تکنو پشتیبان */

#comments .children > .w-comments-item .w-comments-item-author span {
    display: inline-flex;

    padding: 4px 8px;

    border-radius: 6px;

    background: #073B76;

    color: #FEBD3F;

    font-size: 12px;
    font-weight: 900;
}


/* آواتار پاسخ */

#comments .children > .w-comments-item .avatar {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px;

    box-shadow:
        0 0 0 1px rgba(18,97,168,.12),
        0 4px 12px rgba(7,59,118,.08);
}


/* ---------------------------------------------------------
   Pagination
   --------------------------------------------------------- */

#comments .w-comments-pagination {
    margin: 25px 0 0;
    text-align: center;
}


/* ---------------------------------------------------------
   فرم ارسال دیدگاه
   --------------------------------------------------------- */

#comments #respond {
    position: relative;

    margin: 45px 0 0;
    padding: 30px;

    box-sizing: border-box;

    background:
        linear-gradient(
            135deg,
            #F4F8FC 0%,
            #FFFFFF 100%
        );

    border: 1px solid rgba(7,59,118,.08);

    border-radius: 18px;

    box-shadow:
        0 10px 30px rgba(7,59,118,.055);

    overflow: hidden;
}


/* نوار بالای فرم */

#comments #respond::before {
    content: "";

    position: absolute;

    top: 0;
    right: 12%;
    left: 12%;

    height: 3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #FEBD3F,
            transparent
        );
}


/* عنوان فرم */

#comments #reply-title {
    margin: 0 0 20px !important;

    color: #073B76;

    font-size: 19px;
    font-weight: 900;
    line-height: 1.6;
}

#comments #cancel-comment-reply-link {
    color: #1261A8;

    font-size: 10px;
    font-weight: 700;

    text-decoration: none;
}


/* پیام ورود */

#comments .logged-in-as {
    margin: 0 0 15px !important;

    color: #7C90A4;

    font-size: 12px;
    line-height: 1.9;
}

#comments .logged-in-as a {
    color: #1261A8;
    text-decoration: none;
}


/* Textarea */

#comments #respond textarea {
    width: 100% !important;
    min-height: 145px;

    padding: 16px 18px !important;

    box-sizing: border-box;

    resize: vertical;

    border: 1px solid rgba(7,59,118,.10) !important;
    border-radius: 13px !important;

    background: #FFFFFF !important;

    color: #102A43 !important;

    font-family: inherit;
    font-size: 11px;

    line-height: 2;

    box-shadow:
        inset 0 1px 2px rgba(7,59,118,.025);

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}

#comments #respond textarea::placeholder {
    color: #9AAABD;
}

#comments #respond textarea:focus {
    border-color: rgba(18,97,168,.35) !important;

    outline: none;

    box-shadow:
        0 0 0 3px rgba(18,97,168,.07);
}


/* خطای فیلد */

#comments .w-form-row-state {
    color: #D45B5B;
    font-size: 9px;
}


/* ---------------------------------------------------------
   دکمه ارسال
   --------------------------------------------------------- */

#comments .form-submit {
    margin: 15px 0 0 !important;
}

#comments .form-submit .w-btn {
    min-width: 165px;
    height: 48px;

    padding: 0 22px !important;

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

    background:
        linear-gradient(
            135deg,
            #FEBD3F 0%,
            #FFD978 100%
        ) !important;

    color: #073B76 !important;

    box-shadow:
        0 8px 20px rgba(254,189,63,.18);

    font-family: inherit;
    font-size: 12px;
    font-weight: 900;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

#comments .form-submit .w-btn:hover {
    transform: translateY(-2px);

    box-shadow:
        0 12px 25px rgba(254,189,63,.28);
}

#comments .form-submit .w-btn-label {
    color: #073B76 !important;
}


/* ---------------------------------------------------------
   موبایل
   --------------------------------------------------------- */

@media (max-width: 768px) {

    #comments.w-comments {
        width: calc(100% - 30px);
        margin: 40px auto 50px;
    }

    #comments .w-comments-title {
        margin-bottom: 24px !important;
        font-size: 20px;
    }

    #comments .w-comments-list > .w-comments-item {
        padding: 18px 17px 16px !important;
        border-radius: 14px;
    }

    #comments .w-comments-item-meta {
        gap: 9px;
        margin-bottom: 12px !important;
    }






    #comments .w-comments-item .children {
        margin-top: 14px !important;
        padding-right: 15px !important;
    }

    #comments .children > .w-comments-item {
        padding: 15px 14px 14px !important;
        border-radius: 11px;
    }

    #comments #respond {
        margin-top: 35px;
        padding: 22px 18px;
        border-radius: 15px;
    }

    #comments #reply-title {
        font-size: 17px;
    }

    #comments #respond textarea {
        min-height: 125px;
    }

    #comments .form-submit .w-btn {
        width: 100%;
    }
}


@media (max-width: 480px) {

    #comments.w-comments {
        width: calc(100% - 24px);
    }

    #comments .w-comments-title {
        font-size: 18px;
    }

    #comments .w-comments-title a {
        font-size: 10px;
    }

    #comments .w-comments-list > .w-comments-item {
        padding: 16px 14px 14px !important;
    }

    #comments .w-comments-item-date {
        display: block;
        
    }



    #comments .comment-reply-link {
        height: 26px;
        min-width: 50px;
        font-size: 8px;
    }

    #comments #respond {
        padding: 20px 14px;
    }
}
.w-grid-item {
    display: contents;
}
/****************************education********************88/
 * /* =========================================
   Techno Poshtiban
   Education Header
   ========================================= */

.tp-education-header {
    position: relative;
    width: 100%;
    min-height: 125px;
    padding: 28px 24px;
    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: center;

    direction: rtl;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 82% 45%,
            rgba(18, 97, 168, .12) 0,
            rgba(18, 97, 168, 0) 32%
        ),
        radial-gradient(
            circle at 15% 70%,
            rgba(254, 189, 63, .08) 0,
            rgba(254, 189, 63, 0) 28%
        ),
        linear-gradient(
            135deg,
            #F8FBFF 0%,
            #F4F8FC 50%,
            #EDF4FB 100%
        );

    border-bottom: 1px solid rgba(7, 59, 118, .08);
}


/* خط طلایی بالای هدر */

.tp-education-header::before {
    content: "";
    position: absolute;

    top: 0;
    right: 0;

    width: 100%;
    height: 3px;

    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(254, 189, 63, .15) 15%,
        #FEBD3F 50%,
        rgba(254, 189, 63, .15) 85%,
        transparent 100%
    );
}


/* المان دکوراتیو سمت چپ */

.tp-education-header::after {
    content: "";

    position: absolute;

    width: 230px;
    height: 230px;

    left: -100px;
    top: 50%;

    transform: translateY(-50%);

    border-radius: 50%;

    border: 1px solid rgba(18, 97, 168, .07);

    box-shadow:
        0 0 0 35px rgba(18, 97, 168, .025),
        0 0 0 70px rgba(18, 97, 168, .018);

    pointer-events: none;
}


/* محتوای داخلی */

.tp-education-header__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 1380px;

    margin: 0 auto;

    text-align: center;
}


/* عنوان */

.tp-education-header__title {
    position: relative;

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

    color: #073B76;

    font-size: 32px;
    font-weight: 900;
    line-height: 1.5;

    letter-spacing: -.3px;
}


/* خط طلایی زیر عنوان */

.tp-education-header__title::after {
    content: "";

    display: block;

    width: 55px;
    height: 3px;

    margin: 13px auto 0;

    border-radius: 10px;

    background: #FEBD3F;

    box-shadow: 0 3px 10px rgba(254, 189, 63, .25);
}


/* =========================================
   Tablet
   ========================================= */

@media (max-width: 992px) {

    .tp-education-header {
        min-height: 135px;
        padding: 30px 20px;
    }

    .tp-education-header__title {
        font-size: 29px;
    }

}


/* =========================================
   Mobile
   ========================================= */

@media (max-width: 768px) {

    .tp-education-header {
        min-height: 120px;
        padding: 26px 18px;
    }

    .tp-education-header__title {
        font-size: 25px;
        line-height: 1.5;
    }

    .tp-education-header__title::after {
        width: 45px;
        height: 3px;
        margin-top: 10px;
    }

}


/* =========================================
   Small Mobile
   ========================================= */

@media (max-width: 480px) {

    .tp-education-header {
        min-height: 110px;
        padding: 24px 15px;
    }

    .tp-education-header__title {
        font-size: 22px;
    }

}


/* =========================================
   Techno Poshtiban
   Education Sidebar - Categories
   ========================================= */

.tp-education-sidebar {
    width: 100%;
    direction: rtl;
}


/* -----------------------------------------
   عنوان بخش
   ----------------------------------------- */

.tp-education-sidebar__title {
    position: relative;

    margin: 0 0 14px !important;
    padding: 0 0 13px !important;

    color: #073B76 !important;

    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.6 !important;

    text-align: right;

    border-bottom: 1px solid rgba(7, 59, 118, .10);
}


/* خط طلایی زیر عنوان */

.tp-education-sidebar__title::after {
    content: "";

    position: absolute;

    right: 0;
    bottom: -1px;

    width: 55px;
    height: 3px;

    border-radius: 10px;

    background: #FEBD3F;
}


/* -----------------------------------------
   Grid اصلی دسته‌ها
   ----------------------------------------- */

.tp-education-categories {
    width: 100% !important;
    margin: 0 !important;
}


/* حذف فاصله پیش‌فرض */

.tp-education-categories .w-grid-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;

    width: 100%;
}


/* -----------------------------------------
   هر آیتم
   ----------------------------------------- */

.tp-education-categories .w-grid-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


.tp-education-categories .w-grid-item-h {
    position: relative;

    width: 100%;
    min-height: 48px;

    box-sizing: border-box;

    display: flex;
    align-items: center;

    padding: 7px 13px 7px 10px;

    background: #F4F8FC;

    border: 1px solid rgba(7, 59, 118, .06);
    border-radius: 11px;

    overflow: hidden;

    transition:
        background-color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease;
}


/* خط طلایی سمت راست */

.tp-education-categories .w-grid-item-h::before {
    content: "";

    position: absolute;

    right: 0;
    top: 8px;
    bottom: 8px;

    width: 3px;

    border-radius: 5px;

    background: #FEBD3F;

    transform: scaleY(0);

    transform-origin: center;

    transition: transform .25s ease;
}


/* -----------------------------------------
   عنوان لینک
   ----------------------------------------- */

.tp-education-categories .w-post-elm.post_title {
    width: 100%;
    margin: 0 !important;
}


.tp-education-categories .w-post-elm.post_title a {
    position: relative;

    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;

    box-sizing: border-box;

    padding-right: 8px;

    color: #073B76 !important;

    font-size: 14px;
    font-weight: 800;

    line-height: 1.7;

    text-decoration: none !important;

    transition:
        color .25s ease,
        padding-right .25s ease;
}


/* -----------------------------------------
   فلش سمت چپ
   ----------------------------------------- */

.tp-education-categories .w-post-elm.post_title a::before {
    content: "←";

    order: 2;

    flex: 0 0 auto;



    display: flex;
    align-items: center;
    justify-content: center;

    color: #1261A8;

    font-size: 24px;
    font-weight: 900;

    border-radius: 50%;

    

    transition:
        background-color .25s ease,
        color .25s ease,
        transform .25s ease;
}


/* -----------------------------------------
   تعداد مقالات
   ----------------------------------------- */

.tp-education-categories .w-post-elm.post_title b {
    order: 1;

    flex: 0 0 auto;

    min-width: 24px;
    height: 23px;

    padding: 0 6px;

    box-sizing: border-box;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 7px;

    background: #FFFFFF;

    border: 1px solid rgba(7, 59, 118, .08);

    color: #58708A;

    font-size: 13px;
    font-weight: 800;

    line-height: 1;

    direction: ltr;

    transition:
        background-color .25s ease,
        color .25s ease,
        border-color .25s ease;
}


/* -----------------------------------------
   Hover
   ----------------------------------------- */

.tp-education-categories .w-grid-item-h:hover {
    background: #FFFFFF;

    border-color: rgba(254, 189, 63, .45);

    box-shadow:
        0 7px 18px rgba(7, 59, 118, .07);

    transform: translateY(-1px);
}


.tp-education-categories .w-grid-item-h:hover::before {
    transform: scaleY(1);
}


.tp-education-categories .w-grid-item-h:hover .w-post-elm.post_title a {
    color: #1261A8 !important;
    padding-right: 12px;
}


.tp-education-categories .w-grid-item-h:hover .w-post-elm.post_title a::before {
   
    color: #073B76;
    transform: translateX(-2px);
}


.tp-education-categories .w-grid-item-h:hover .w-post-elm.post_title b {
    background: #073B76;
    border-color: #073B76;
    color: #FFFFFF;
}


/* -----------------------------------------
   دسته فعال
   ----------------------------------------- */

.tp-education-categories .w-grid-item.current-cat .w-grid-item-h,
.tp-education-categories .w-grid-item.is-current .w-grid-item-h {
    background: #073B76;

    border-color: #073B76;

    box-shadow:
        0 7px 18px rgba(7, 59, 118, .13);
}


.tp-education-categories .w-grid-item.current-cat .w-post-elm.post_title a,
.tp-education-categories .w-grid-item.is-current .w-post-elm.post_title a {
    color: #FFFFFF !important;
}


.tp-education-categories .w-grid-item.current-cat .w-post-elm.post_title a::before,
.tp-education-categories .w-grid-item.is-current .w-post-elm.post_title a::before {
    background: #FEBD3F;
    color: #073B76;
}


.tp-education-categories .w-grid-item.current-cat .w-post-elm.post_title b,
.tp-education-categories .w-grid-item.is-current .w-post-elm.post_title b {
    background: rgba(255,255,255,.12);
    border-color: rgba(255,255,255,.20);
    color: #FFFFFF;
}





.tp-education-categories .w-grid-item-h::after {
    display: none !important;
}

.tp-education-categories .w-post-elm {
    margin-bottom: 0 !important;
}


/* -----------------------------------------
   Tablet
   ----------------------------------------- */

@media (max-width: 992px) {

    .tp-education-sidebar__title {
        font-size: 17px !important;
    }

    .tp-education-categories .w-grid-item-h {
        min-height: 46px;
        padding: 7px 11px 7px 8px;
    }


}


/* -----------------------------------------
   Mobile
   ----------------------------------------- */

@media (max-width: 768px) {

    .tp-education-sidebar__title {
        font-size: 17px !important;
        margin-bottom: 12px !important;
    }

    .tp-education-categories .w-grid-list {
        gap: 6px !important;
    }

    .tp-education-categories .w-grid-item-h {
        min-height: 45px;
    }



}
/* =========================================
   Techno Poshtiban
   Sidebar Services
   ========================================= */

.tp-pages-sevices {
    width: 100% !important;
    margin: 0 !important;
    direction: rtl;
}


/* لیست خدمات */

.tp-pages-sevices .w-grid-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;

    width: 100%;
}


/* هر آیتم */

.tp-pages-sevices .w-grid-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* بدنه آیتم */

.tp-pages-sevices .w-grid-item-h {
    position: relative;

    width: 100%;
    min-height: 48px;

    box-sizing: border-box;

    display: flex;
    align-items: center;

    padding: 7px 14px 7px 10px;

    background: #FFF7F6;

    border: 1px solid rgba(235, 100, 100, .08);
    border-radius: 11px;

    overflow: hidden;

    transition:
        background-color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease;
}


/* نوار ظریف سمت راست */

.tp-pages-sevices .w-grid-item-h::before {
    content: "";

    position: absolute;

    right: 0;
    top: 8px;
    bottom: 8px;

    width: 3px;

    border-radius: 5px;

    background: #FEBD3F;

    transform: scaleY(0);

    transform-origin: center;

    transition: transform .25s ease;
}


/* عنوان لینک */

.tp-pages-sevices .w-post-elm.post_title {
    width: 100%;
    margin: 0 !important;
}


.tp-pages-sevices .w-post-elm.post_title a {
    position: relative;

    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-right: 7px;

    color: #073B76 !important;

    font-size: 14px;
    font-weight: 800;

    line-height: 1.7;

    text-decoration: none !important;

    transition:
        color .25s ease,
        padding-right .25s ease;
}


/* فلش سمت چپ */

.tp-pages-sevices .w-post-elm.post_title a::after {
    content: "←";

    flex: 0 0 auto;


    display: flex;
    align-items: center;
    justify-content: center;

    margin-right: 8px;

    border-radius: 50%;



    color: #1261A8;

    font-size: 24px;
    font-weight: 900;

    transition:
        background-color .25s ease,
        color .25s ease,
        transform .25s ease;
}


/* Hover */

.tp-pages-sevices .w-grid-item-h:hover {
    background: #FFFFFF;

    border-color: rgba(254, 189, 63, .45);

    box-shadow:
        0 7px 18px rgba(7, 59, 118, .07);

    transform: translateY(-1px);
}


.tp-pages-sevices .w-grid-item-h:hover::before {
    transform: scaleY(1);
}


.tp-pages-sevices .w-grid-item-h:hover .w-post-elm.post_title a {
    color: #1261A8 !important;
    padding-right: 11px;
}


.tp-pages-sevices .w-grid-item-h:hover .w-post-elm.post_title a::after {
  
    color: #073B76;

    transform: translateX(-2px);
}


/* =========================================
   صفحه فعلی / سرویس فعال
   ========================================= */

.tp-pages-sevices .w-grid-item.current_page_item .w-grid-item-h,
.tp-pages-sevices .w-grid-item.current-menu-item .w-grid-item-h {
    background: #073B76;
    border-color: #073B76;

    box-shadow:
        0 7px 18px rgba(7, 59, 118, .13);
}


.tp-pages-sevices .w-grid-item.current_page_item
.w-post-elm.post_title a,
.tp-pages-sevices .w-grid-item.current-menu-item
.w-post-elm.post_title a {
    color: #FFFFFF !important;
}


.tp-pages-sevices .w-grid-item.current_page_item
.w-post-elm.post_title a::after,
.tp-pages-sevices .w-grid-item.current-menu-item
.w-post-elm.post_title a::after {
    background: #FEBD3F;
    color: #073B76;
}


/* جلوگیری از استایل‌های پیش‌فرض اضافی */

.tp-pages-sevices .w-post-elm {
    margin-bottom: 0 !important;
}

.tp-pages-sevices .w-grid-item-h::after {
    display: none !important;
}


/* =========================================
   Tablet
   ========================================= */

@media (max-width: 992px) {

    .tp-pages-sevices .w-grid-item-h {
        min-height: 46px;
        padding: 7px 12px 7px 9px;
    }


}


/* =========================================
   Mobile
   ========================================= */

@media (max-width: 768px) {

    .tp-pages-sevices .w-grid-list {
        gap: 6px !important;
    }

    .tp-pages-sevices .w-grid-item-h {
        min-height: 45px;
    }

}
/* =========================================
   Techno Poshtiban
   Sidebar - Latest Posts
   ========================================= */

.tp-blog-sidebar {
    width: 100% !important;
    margin: 0 !important;
    direction: rtl;
}


/* لیست */

.tp-blog-sidebar .w-grid-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}


/* هر مقاله */

.tp-blog-sidebar .w-grid-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* کارت مقاله */

.tp-blog-sidebar .w-grid-item-h {
    position: relative;

    width: 100%;
    min-height: 78px;

    box-sizing: border-box;

    padding: 8px;

    display: block;

    background: #FFFFFF;

    border: 1px solid rgba(7, 59, 118, .07);
    border-radius: 12px;

    box-shadow: 0 4px 14px rgba(7, 59, 118, .035);

    overflow: hidden;

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        background-color .25s ease;
}


/* ساختار عکس + متن */

.tp-blog-sidebar .usg_hwrapper_1 {
    width: 100% !important;

    display: flex !important;
    flex-direction: row !important;

    align-items: stretch !important;

    gap: 9px !important;
}


/* تصویر */

.tp-blog-sidebar .usg_post_image_1 {
    width: 88px !important;
    max-width: 88px !important;

    flex: 0 0 88px;

    height: 70px !important;

    overflow: hidden;

    border-radius: 9px;
}


.tp-blog-sidebar .usg_post_image_1 a {
    display: block;

    width: 100%;
    height: 100%;
}


.tp-blog-sidebar .usg_post_image_1 img {
    display: block;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover;

    transition: transform .35s ease;
}


/* بخش متن */

.tp-blog-sidebar .usg_vwrapper_1 {
    width: auto !important;
    max-width: none !important;

    flex: 1 1 auto;

    min-width: 0;

    padding: 2px 0 0 !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 4px !important;
}


/* عنوان مقاله */

.tp-blog-sidebar .usg_post_title_1 {
    margin: 0 !important;

    color: #073B76 !important;

    font-size: 14px !important;
    font-weight: 800 !important;

    line-height: 1.75 !important;

    overflow: hidden;

    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}


.tp-blog-sidebar .usg_post_title_1 a {
    color: #073B76 !important;

    text-decoration: none !important;

    transition: color .25s ease;
}


/* تاریخ */

.tp-blog-sidebar .usg_post_date_1 {
    margin-top: auto !important;
    margin-bottom: 0 !important;

    color: #8A9AAF !important;

    font-size: 11px !important;
    font-weight: 600 !important;

    line-height: 1.4 !important;
}


/* -----------------------------------------
   Hover
   ----------------------------------------- */

.tp-blog-sidebar .w-grid-item-h:hover {
    background: #F8FBFF;

    border-color: rgba(254, 189, 63, .45);

    box-shadow:
        0 7px 20px rgba(7, 59, 118, .07);

    transform: translateY(-1px);
}


.tp-blog-sidebar .w-grid-item-h:hover .usg_post_image_1 img {
    transform: scale(1.05);
}


.tp-blog-sidebar .w-grid-item-h:hover .usg_post_title_1 a {
    color: #1261A8 !important;
}


/* خط طلایی ظریف */

.tp-blog-sidebar .w-grid-item-h::before {
    content: "";

    position: absolute;

    right: 0;
    top: 10px;
    bottom: 10px;

    width: 3px;

    border-radius: 5px;

    background: #FEBD3F;

    transform: scaleY(0);

    transform-origin: center;

    transition: transform .25s ease;
}


.tp-blog-sidebar .w-grid-item-h:hover::before {
    transform: scaleY(1);
}


/* حذف استایل‌های مزاحم */

.tp-blog-sidebar .w-post-elm {
    margin-bottom: 0 !important;
}

.tp-blog-sidebar .w-grid-item-h::after {
    display: none !important;
}


/* =========================================
   Tablet
   ========================================= */

@media (max-width: 992px) {

    .tp-blog-sidebar .usg_post_image_1 {
        width: 82px !important;
        max-width: 82px !important;
        flex-basis: 82px;

        height: 66px !important;
    }

 

}


/* =========================================
   Mobile
   ========================================= */

@media (max-width: 768px) {

    .tp-blog-sidebar .w-grid-list {
        gap: 7px !important;
    }

    .tp-blog-sidebar .w-grid-item-h {
        min-height: 74px;
        padding: 7px;
    }

    .tp-blog-sidebar .usg_post_image_1 {
        width: 80px !important;
        max-width: 80px !important;
        flex-basis: 80px;

        height: 64px !important;
    }



}
/*************pagination-blog*************/
/* =========================================
   Techno Poshtiban
   Education Pagination
   ========================================= */

.pagination.navigation {
    width: 100%;
    margin: 38px 0 10px !important;
    padding: 0 !important;

    direction: rtl;

    display: flex !important;
    justify-content: center;
}


/* لیست شماره‌ها */

.pagination.navigation .nav-links {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 7px;

    margin: 0;
    padding: 0;

    direction: rtl;
}


/* تمام شماره‌ها */

.pagination.navigation .page-numbers {
    width: 38px;
    height: 38px;

    box-sizing: border-box;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

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

    border-radius: 10px;

    background: #FFFFFF;

    border: 1px solid rgba(7, 59, 118, .10);

    color: #073B76 !important;

    font-size: 12px;
    font-weight: 800;

    line-height: 1;

    text-decoration: none !important;

    box-shadow: 0 3px 10px rgba(7, 59, 118, .035);

    transition:
        background-color .25s ease,
        border-color .25s ease,
        color .25s ease,
        transform .25s ease,
        box-shadow .25s ease;
}





/* صفحه فعال */

.pagination.navigation .page-numbers.current {
    background: #073B76 !important;

    border-color: #073B76 !important;

    color: #FFFFFF !important;

    box-shadow:
        0 6px 16px rgba(7, 59, 118, .18);

    transform: translateY(-1px);
}


/* Hover */

.pagination.navigation a.page-numbers:hover {
    background: #FEBD3F !important;

    border-color: #FEBD3F !important;

    color: #073B76 !important;

    transform: translateY(-2px);

    box-shadow:
        0 7px 17px rgba(254, 189, 63, .20);
}


/* سه نقطه */

.pagination.navigation .page-numbers.dots {
    width: 30px;

    background: transparent !important;

    border-color: transparent !important;

    box-shadow: none;

    color: #58708A !important;

    cursor: default;
}


/* -----------------------------------------
   دکمه بعد
   ----------------------------------------- */

.pagination.navigation .page-numbers.next {
    width: auto;
    min-width: 58px;

    padding: 0 13px !important;

    gap: 6px;

    background: #F4F8FC !important;

    border-color: rgba(7, 59, 118, .08) !important;

    color: #073B76 !important;
}


.pagination.navigation .page-numbers.next:hover {
    background: #FEBD3F !important;

    border-color: #FEBD3F !important;

    color: #073B76 !important;
}




/* جلوگیری از نمایش متن قبلی/بعدی به شکل نامناسب */

.pagination.navigation .page-numbers.next span {
    white-space: nowrap;
}


/* -----------------------------------------
   Tablet
   ----------------------------------------- */

@media (max-width: 992px) {

    .pagination.navigation {
        margin-top: 32px !important;
    }

    .pagination.navigation .nav-links {
        gap: 6px;
    }

    .pagination.navigation .page-numbers {
        width: 36px;
        height: 36px;
    }

}


/* -----------------------------------------
   Mobile
   ----------------------------------------- */

@media (max-width: 768px) {

    .pagination.navigation {
        margin-top: 28px !important;
    }

    .pagination.navigation .nav-links {
        gap: 5px;
    }

    .pagination.navigation .page-numbers {
        width: 34px;
        height: 34px;

        border-radius: 9px;

        font-size: 11px;
    }

    .pagination.navigation .page-numbers.next {
        min-width: 50px;
        padding: 0 9px !important;
    }

}


/**********************general posts tags***************/
/* =====================================================
   TECHNO POSHTIBAN — ARTICLE CONTENT MASTER CSS
   Wrapper: .tp-article-content
   Brand: Navy / Blue / Gold
===================================================== */

.tp-article-content {
    --tp-article-navy: #073B76;
    --tp-article-navy-dark: #052A56;
    --tp-article-blue: #1261A8;
    --tp-article-gold: #FEBD3F;
    --tp-article-ice: #F4F8FC;
    --tp-article-text: #263B50;
    --tp-article-muted: #58708A;
    --tp-article-border: #DCE7F2;

    direction: rtl;
    color: var(--tp-article-text);
    font-size: 16px;
    line-height: 2;
    overflow-wrap: anywhere;
}

/* =========================
   Headings — Base
========================= */

.tp-article-content h2,
.tp-article-content h3,
.tp-article-content h4,
.tp-article-content h5,
.tp-article-content h6 {
    direction: rtl;
    text-align: right;
    color: var(--tp-article-navy);
    font-weight: 800;
    line-height: 1.8;
    letter-spacing: -0.25px;
    overflow-wrap: anywhere;
}

.tp-article-content h2 {
    position: relative;
    margin: 38px 0 20px;
    padding: 0 0 12px;
    font-size: 25px;
    border-bottom: 1px solid var(--tp-article-border);
}

.tp-article-content h2::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    width: 58px;
    height: 3px;
    border-radius: 4px;
    background: var(--tp-article-gold);
}

.tp-article-content h3 {
    margin: 30px 0 14px;
    padding: 0 12px 0 0;
    border-right: 3px solid var(--tp-article-gold);
    font-size: 21px;
    color: var(--tp-article-blue);
}

.tp-article-content h4 {
    margin: 24px 0 12px;
    font-size: 18px;
    color: var(--tp-article-navy);
}

.tp-article-content h5 {
    margin: 20px 0 10px;
    font-size: 16px;
    color: var(--tp-article-blue);
}

.tp-article-content h6 {
    margin: 18px 0 8px;
    font-size: 15px;
    color: var(--tp-article-muted);
}

/* جلوگیری از فاصله نامناسب تیتر در ابتدای مقاله */

.tp-article-content > h2:first-child,
.tp-article-content > h3:first-child,
.tp-article-content > h4:first-child {
    margin-top: 0;
}

/* =========================
   Paragraphs
========================= */

.tp-article-content p {
    margin: 0 0 18px;
    color: var(--tp-article-text);
    font-size: 16px;
    line-height: 2.05;
    text-align: justify;
}

.tp-article-content p:last-child {
    margin-bottom: 0;
}

/* =========================
   Links
========================= */

.tp-article-content a {
    color: var(--tp-article-blue);
    text-decoration: none;
    text-underline-offset: 4px;
    transition: color .2s ease;
}

.tp-article-content a:hover {
    color: var(--tp-article-navy-dark);
    text-decoration: underline;
}

/* =========================
   Strong / Emphasis
========================= */

.tp-article-content strong,
.tp-article-content b {
    color: var(--tp-article-navy);
    font-weight: 800;
}

.tp-article-content em,
.tp-article-content i {
    color: var(--tp-article-blue);
}

/* =========================
   Blockquote
========================= */

.tp-article-content blockquote {
    position: relative;
    margin: 26px 0;
    padding: 20px 22px;
    background: var(--tp-article-ice);
    border: 1px solid var(--tp-article-border);
    border-right: 4px solid var(--tp-article-gold);
    border-radius: 10px;
    color: var(--tp-article-text);
    font-size: 16px;
    line-height: 2;
}

.tp-article-content blockquote p {
    margin-bottom: 10px;
}

.tp-article-content blockquote p:last-child {
    margin-bottom: 0;
}

.tp-article-content blockquote > :first-child {
    margin-top: 0;
}

.tp-article-content blockquote > :last-child {
    margin-bottom: 0;
}
blockquote:before{
	display:none;
}
/* =========================
   Lists
========================= */

.tp-article-content ul,
.tp-article-content ol {
    margin: 0 0 22px;
    padding-right: 26px;
    padding-left: 0;
    color: var(--tp-article-text);
}

.tp-article-content li {
    margin: 0 0 8px;
    padding-right: 3px;
    line-height: 1.95;
}

.tp-article-content ul {
    list-style-type: disc;
}

.tp-article-content ol {
    list-style-type: decimal;
}

.tp-article-content li::marker {
    color: var(--tp-article-blue);
}

.tp-article-content li > ul,
.tp-article-content li > ol {
    margin-top: 8px;
    margin-bottom: 8px;
}

/* =========================
   Images
========================= */

.tp-article-content img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.tp-article-content figure {
    max-width: 100%;
    margin: 24px auto;
}

.tp-article-content figcaption {
    margin-top: 9px;
    color: var(--tp-article-muted);
    font-size: 13px;
    line-height: 1.8;
    text-align: center;
}

/* =========================
   Tables
========================= */

.tp-article-content table , .single-us_portfolio table {
    width: 100% !important;
    max-width: 100%;
    margin: 24px 0;
    border-collapse: collapse;
    border-spacing: 0;
    color: var(--tp-article-text);
    font-size: 14px;
    line-height: 1.9;
    background: #fff;
}

.tp-article-content th , .single-us_portfolio th{
    padding: 12px;
    background: var(--tp-article-navy);
    color: #fff;
    font-weight: 800;
    text-align: right;
    border: 1px solid var(--tp-article-navy);
}

.tp-article-content td , .single-us_portfolio td{
    padding: 11px 12px;
    border: 1px solid var(--tp-article-border);
    text-align: right;
    vertical-align: middle;
}

.tp-article-content tbody tr:nth-child(even) , .single-us_portfolio tbody tr:nth-child(even) {
    background: var(--tp-article-ice);
}

.tp-article-content tbody tr:hover , .single-us_portfolio tbody tr:hover {
    background: #EDF4FB;
}

/* =========================
   Horizontal Rule
========================= */

.tp-article-content hr , .single-us_portfolio hr{
    height: 1px;
    margin: 30px 0;
    border: 0;
    background: var(--tp-article-border);
}

/* =========================
   Inline Code / Code Blocks
========================= */

.tp-article-content code {
    padding: 2px 6px;
    border-radius: 5px;
    background: var(--tp-article-ice);
    color: var(--tp-article-blue);
    font-size: .92em;
    direction: ltr;
    unicode-bidi: plaintext;
}

.tp-article-content pre {
    max-width: 100%;
    margin: 22px 0;
    padding: 16px;
    overflow-x: auto;
    direction: ltr;
    text-align: left;
    background: #F4F8FC;
    border: 1px solid var(--tp-article-border);
    border-radius: 10px;
    line-height: 1.7;
}

.tp-article-content pre code {
    padding: 0;
    background: transparent;
    color: inherit;
}

/* =========================
   Responsive
========================= */
@media (max-width: 1024px){
	.sidebar-fix .g-cols.cols_3-1 {
    grid-template-columns: 1fr;
}
}


@media (max-width: 768px) {
    .tp-article-content {
        font-size: 15px;
        line-height: 1.95;
    }

    .tp-article-content h2 {
        margin-top: 30px;
        margin-bottom: 16px;
        padding-bottom: 10px;
        font-size: 22px;
    }

    .tp-article-content h3 {
        margin-top: 25px;
        margin-bottom: 12px;
        font-size: 19px;
    }

    .tp-article-content h4 {
        margin-top: 20px;
        font-size: 17px;
    }

    .tp-article-content p {
        font-size: 15px;
        line-height: 2;
        text-align: right;
    }

    .tp-article-content blockquote {
        margin: 22px 0;
        padding: 15px;
        font-size: 15px;
    }

    .tp-article-content table {
        font-size: 13px;
    }

    .tp-article-content th,
    .tp-article-content td {
        padding: 9px 8px;
    }
}

@media (max-width: 480px) {
    .tp-article-content h2 {
        font-size: 20px;
    }

    .tp-article-content h3 {
        font-size: 18px;
    }

    .tp-article-content h4 {
        font-size: 16px;
    }

    .tp-article-content blockquote {
        padding: 12px;
        border-radius: 8px;
    }
}
/* ======================================
   TECHNO POSHTIBAN — POST NAVIGATION
   Minimal style
====================================== */






/* عنوان کوچک */
.w-post-elm.post_navigation.layout_simple .post_navigation-item-meta {
    margin: 0 0 7px !important;
    color: #8294A8 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

/* عنوان نوشته */
.w-post-elm.post_navigation.layout_simple .post_navigation-item-title {
    padding: 0 !important;
    color: #073B76 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.9;
    transition: color .2s ease;
}







/* هاور ساده */
.w-post-elm.post_navigation.layout_simple .post_navigation-item:hover {
    background: transparent !important;
}

.w-post-elm.post_navigation.layout_simple .post_navigation-item:hover
.post_navigation-item-title {
    color: #1261A8 !important;
}
/****************form************************/

/* ==========================================
   TECHNO POSHTIBAN — GLOBAL GRAVITY FORMS
   Navy / Blue / Gold
========================================== */

:root {
    --tp-form-navy: #073B76;
    --tp-form-navy-dark: #052A56;
    --tp-form-blue: #1261A8;
    --tp-form-gold: #FEBD3F;
    --tp-form-ice: #F4F8FC;
    --tp-form-border: #D5E3F1;
    --tp-form-text: #263B50;
    --tp-form-muted: #8194A9;
}

/* بدنه فرم */
.gform_wrapper {
    direction: rtl;
    color: var(--tp-form-text);
    font-family: inherit;
}

/* پس‌زمینه فرم */
.gform_wrapper form {
    padding: 22px;
    background: linear-gradient(145deg, #F7FAFE 0%, #EEF5FC 100%);
    border: 1px solid #E1EBF5;
    border-radius: 14px;
    box-shadow: 0 8px 26px rgba(7, 59, 118, .045);
}

/* فاصله فیلدها بدون تغییر چیدمان */
.gform_wrapper .gfield {
    min-width: 0;
}

/* لیبل‌ها */
.gform_wrapper .gfield_label {
    color: var(--tp-form-navy) !important;
    font-size: 13px !important;

}

/* ورودی‌ها، فهرست‌ها و کادر متن */

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="password"],
.gform_wrapper input[type="search"],
.gform_wrapper input[type="date"],
.gform_wrapper input[type="time"],
.gform_wrapper select,
.gform_wrapper textarea {
    width: 100%;
    max-width: 100%;
    min-height: 47px;
    padding:11px 14px !important;

    color: var(--tp-form-navy);
    background: #FFFFFF;
    border: 1px solid var(--tp-form-border);
    border-radius: 9px;


    font-size: 14px !important;
    line-height: 1.8;

    box-shadow: 0 2px 5px rgba(7, 59, 118, .025);
    transition:
        border-color .22s ease,
        background-color .22s ease,
        box-shadow .22s ease;
}

/* کادر متن */
.gform_wrapper textarea {
    min-height: 120px;
    resize: vertical;
}

/* Placeholder */
.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder {
    	    font-size: 14px !important;
    color: var(--tp-form-navy) !important;
    opacity: 1;
}

/* فوکوس روی فیلد */
.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
    outline: none;
    border-color: var(--tp-form-blue);
    background-color: #FFFFFF;
    box-shadow: 0 0 0 3px rgba(18, 97, 168, .09);
}

/* گزینه‌های انتخابی */
.gform_wrapper select {
    cursor: pointer;
}

/* چک‌باکس و رادیو */
.gform_wrapper input[type="checkbox"],
.gform_wrapper input[type="radio"] {
    accent-color: var(--tp-form-blue);
}

/* توضیحات فیلد */
.gform_wrapper .gfield_description {
    color: var(--tp-form-muted);
    font-size: 12px;
    line-height: 1.9;
}

/* ستاره و نشان فیلد ضروری */
.gform_wrapper .gfield_required {
    color: #D99A18;
}

/* دکمه‌های ارسال */
.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"],
.gform_wrapper button[type="submit"] {
    min-height: 47px;
    padding: 11px 25px;

    color: #FFFFFF;
    background: var(--tp-form-navy) !important;
    border: 1px solid var(--tp-form-navy) !important;
    border-radius: 9px !important;

    font-family: inherit;
    font-size: 14px;
    font-weight: 800;

    cursor: pointer;
    box-shadow: none;

    transition:
        background-color .22s ease,
        border-color .22s ease,
        transform .22s ease;
}

/* هاور دکمه */
.gform_wrapper .gform_button:hover,
.gform_wrapper input[type="submit"]:hover,
.gform_wrapper button[type="submit"]:hover {
    color: #FFFFFF;
    background: var(--tp-form-blue) !important;
    border-color: var(--tp-form-blue) !important;
}

/* خطای فیلد */
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea {
    border-color: #D96A6A;
    background-color: #FFFAFA;
}

.gform_wrapper .validation_message,
.gform_wrapper .gfield_validation_message {
    margin-top: 5px;
    color: #B93838;
    font-size: 12px;
    line-height: 1.8;
}

/* پیام موفقیت */
.gform_wrapper .gform_confirmation_message {
    padding: 16px 18px;
    color: var(--tp-form-navy);
    background: #F1F8F2;
    border: 1px solid #CDE6D2;
    border-right: 3px solid #4A9B63;
    border-radius: 9px;
    line-height: 1.9;
}

/* موبایل */
@media (max-width: 600px) {
    .gform_wrapper form {
        padding: 15px;
        border-radius: 11px;
    }

    .gform_wrapper input[type="text"],
    .gform_wrapper input[type="email"],
    .gform_wrapper input[type="tel"],
    .gform_wrapper input[type="number"],
    .gform_wrapper input[type="url"],
    .gform_wrapper input[type="password"],
    .gform_wrapper input[type="search"],
    .gform_wrapper input[type="date"],
    .gform_wrapper input[type="time"],
    .gform_wrapper select,
    .gform_wrapper textarea {
        font-size: 13px;
        border-radius: 8px;
    }

    .gform_wrapper .gform_button,
    .gform_wrapper input[type="submit"],
    .gform_wrapper button[type="submit"] {
        width: 100%;
    }
}
.gform_required_legend{
	display:none;
}

/***********************estekhdam************/
.tp-service-hero__image1 {
     position: relative; 
    display: flex; 
     align-items: flex-end; 
    justify-content: center; 
     z-index: 3; 
}

/********************carousel*******************/
 .owl-carousel.owl-drag .owl-item {
    float: none;

}

.contactus .tp-svc-note{
    margin: 0;
    width: 100%;
    align-items: flex-start;
	max-width: 100%;
}
.contactus .w-iconbox-icon i {
    color: #f6efdf !important;
}
.contactus h4.w-iconbox-title {
    margin: 0;
}

/*****************brands****************/
.single-us_portfolio img{
    border-radius: 10px;
}

/********************888888404***888**********************/

/* =====================================
   Techno Poshtiban - Animated 404
===================================== */

.tp404-page {
    --tp404-navy: #073B76;
    --tp404-blue: #1261A8;
    --tp404-gold: #FEBD3F;
    --tp404-ice: #F4F8FC;

    direction: rtl;
    position: relative;
    isolation: isolate;
    width: 100%;
    padding: 55px 22px;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at 18% 45%,
            rgba(211, 224, 241, .75),
            transparent 48%
        ),
        linear-gradient(135deg, #fff 20%, var(--tp404-ice) 100%);
}

.tp404-page *,
.tp404-page *::before,
.tp404-page *::after {
    box-sizing: border-box;
}

.tp404-page__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    align-items: center;
    gap: 25px;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.tp404-page__visual {
    position: relative;
    min-width: 0;
    animation: tp404-enter .8s ease-out both;
}

.tp404-page__glow {
    position: absolute;
    z-index: -1;
    top: 17%;
    right: 12%;
    width: 72%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(211, 224, 241, .65);
    filter: blur(45px);
    pointer-events: none;
}

.tp404-page__image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    border: 0;
    border-radius: 20px;

    animation: tp404-float 5s ease-in-out infinite;
}

.tp404-page__content {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding: 30px 10px;
    animation: tp404-enter .8s .12s ease-out both;
}

.tp404-page__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    padding: 9px 14px;
    color: var(--tp404-navy);
    background: #fff;
    border: 1px solid #DFE9F4;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 700;
}

.tp404-page__dot {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: var(--tp404-gold);
    box-shadow: 0 0 0 4px rgba(254, 189, 63, .16);
    animation: tp404-pulse 2s ease-in-out infinite;
}

.tp404-page__title {
    margin: 0 0 18px;
    color: var(--tp404-navy);
    font-size: clamp(27px, 3.1vw, 43px);
    font-weight: 850;
    line-height: 1.65;
    letter-spacing: -.7px;
}

.tp404-page__text {
    max-width: 490px;
    margin: 0;
    color: #58708A;
    font-size: 16px;
    line-height: 2.2;
}

.tp404-page__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 29px;
}

.tp404-page__button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
    min-height: 51px;
    padding: 13px 19px;
    border: 1px solid transparent;
    border-radius: 11px;
    font-size: 14px;
    font-weight: 750;
    line-height: 1.6;
    text-decoration: none !important;
    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

.tp404-page__button svg {
    display: block;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

.tp404-page__button--primary {
    color: #fff !important;
    background: var(--tp404-navy);
    box-shadow: 0 8px 22px rgba(7, 59, 118, .17);
}

.tp404-page__button--primary:hover {
    color: #fff !important;
    background: var(--tp404-blue);
    transform: translateY(-3px);
    box-shadow: 0 13px 28px rgba(7, 59, 118, .2);
}

.tp404-page__button--secondary {
    color: var(--tp404-navy) !important;
    background: #fff;
    border-color: #C8D9EB;
}

.tp404-page__button--secondary:hover {
    color: var(--tp404-navy) !important;
    background: #FFF9E9;
    border-color: var(--tp404-gold);
    transform: translateY(-3px);
}

.tp404-page__help {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 34px;
    padding-top: 23px;
    border-top: 1px solid #DCE7F2;
    color: #58708A;
    font-size: 13px;
    line-height: 2;
}

.tp404-page__help-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    flex: 0 0 43px;
    color: var(--tp404-navy);
    background: #fff;
    border: 1px solid #DCE7F2;
    border-radius: 13px;
}

.tp404-page__help-icon svg {
    display: block;
    width: 23px;
    height: 23px;
}

.tp404-page__help a {
    display: inline-block;
    margin-right: 5px;
    color: var(--tp404-blue);
    font-weight: 800;
    text-decoration: none;
}

.tp404-page__help a:hover {
    color: var(--tp404-navy);
    text-decoration: underline;
}

.tp404-page__spark {
    position: absolute;
    z-index: 2;
    display: block;
    width: 12px;
    height: 12px;
    border: 3px solid var(--tp404-gold);
    border-radius: 4px;
    pointer-events: none;
    animation: tp404-spark 3s ease-in-out infinite;
}

.tp404-page__spark--one {
    top: 10%;
    right: 12%;
}

.tp404-page__spark--two {
    bottom: 13%;
    left: 8%;
    width: 9px;
    height: 9px;
    border-color: #79B3F0;
    animation-delay: 1.2s;
}

@keyframes tp404-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-8px);
    }
}

@keyframes tp404-enter {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes tp404-pulse {
    0%, 100% {
        box-shadow: 0 0 0 4px rgba(254, 189, 63, .16);
    }
    50% {
        box-shadow: 0 0 0 7px rgba(254, 189, 63, .07);
    }
}

@keyframes tp404-spark {
    0%, 100% {
        transform: translateY(0) rotate(0);
        opacity: .65;
    }
    50% {
        transform: translateY(-10px) rotate(45deg);
        opacity: 1;
    }
}

/* Tablet */
@media (max-width: 900px) {
    .tp404-page {
        padding: 38px 18px;
    }

    .tp404-page__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
        gap: 12px;
    }

    .tp404-page__content {
        padding: 20px 5px;
    }

    .tp404-page__title {
        font-size: clamp(25px, 3.4vw, 34px);
    }

    .tp404-page__text {
        font-size: 14px;
    }

    .tp404-page__actions {
        gap: 9px;
    }

    .tp404-page__button {
        padding: 11px 13px;
        font-size: 13px;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .tp404-page {
        padding: 26px 14px 35px;
    }

    .tp404-page__inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
        max-width: 500px;
    }

    .tp404-page__visual {
        grid-row: 1;
        width: 100%;
        max-width: 440px;
        margin: 0 auto;
    }

    .tp404-page__image {
        border-radius: 14px;
        animation-duration: 6s;
    }

    .tp404-page__content {
        grid-row: 2;
        padding: 15px 4px 0;
        text-align: center;
    }

    .tp404-page__eyebrow {
        margin-bottom: 12px;
        font-size: 12px;
    }

    .tp404-page__title {
        margin-bottom: 10px;
        font-size: 25px;
        letter-spacing: 0;
    }

    .tp404-page__text {
        margin: 0 auto;
        font-size: 14px;
        line-height: 2;
    }

    .tp404-page__actions {
        flex-direction: column;
        align-items: stretch;
        margin-top: 22px;
    }

    .tp404-page__button {
        width: 100%;
        min-height: 49px;
        font-size: 14px;
    }

    .tp404-page__help {
        justify-content: center;
        margin-top: 23px;
        padding-top: 18px;
        text-align: right;
        font-size: 12px;
    }

    .tp404-page__spark--one {
        top: 8%;
        right: 8%;
    }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .tp404-page__image,
    .tp404-page__dot,
    .tp404-page__spark,
    .tp404-page__visual,
    .tp404-page__content {
        animation: none !important;
    }

    .tp404-page__button {
        transition: none;
    }
}
