/* Import Fonts */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');

@font-face {
    font-family: 'Avant Garde';
    font-style: normal;
    font-weight: 600;
    src: local('Avant Garde'), local('AvantGardeGothic'), local('ITC Avant Garde Gothic Std');
    font-display: swap;
}

/* CSS Variables */
:root {
    --screen-x: 1.25rem;
    --break-line: 1.2em;
    --border-size-large: 1px;
    --viewSizeX: 375px;
    --viewSizeY: 682px;
    --spacing-supper: 10rem;
    --spacing-xl: 10rem;
    --spacing-xlx: 10rem;
    --spacing-lg: 5rem;
    --spacing-md: 5rem;
    --spacing-sm: 3rem;
    --spacing-sx: 1.5rem;
    --screen-left: 3rem;
    --size-btn: 78px;
    --offset-parallax: 0px;

    /* Color Variables */
    --bs-black-rgb: 0, 0, 0;
    --bs-white-rgb: 255, 255, 255;
    --bs-red-rgb: 235, 89, 57;
    --bs-primary-rgb: 183, 171, 152;
    --bs-tundora-rgb: 77, 77, 77;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    :root {
        --screen-x: 2.6666666667vw;
        --spacing-supper: 16.5625rem;
    }
}

@media (min-width: 1200px) {
    :root {
        --screen-x: 4.0509259259vw;
        --border-size-large: 2px;
        --spacing-supper: 29.0625rem;
        --spacing-xl: 18.75rem;
        --spacing-xlx: 12.5rem;
        --spacing-lg: 10rem;
        --spacing-md: 7.5rem;
        --spacing-sm: 5rem;
        --spacing-sx: 2.5rem;
    }
}

/* Reset & Base Styles */
*, *:before, *:after {
    box-sizing: border-box;
}

body, html {
    font-smoothing: antialiased !important;
    -webkit-font-smoothing: antialiased !important;
    background: #000000;
    color: #c7c7c7;
    font-family: 'Avant Garde', sans-serif;
    font-size: calc(7.92453px + 1.88679vw);
    font-weight: 400;
    line-height: 110%;
    margin: 0;
    padding: 0;
    scroll-behavior: unset !important;
    overscroll-behavior-y: none !important;
}

@media (min-width: 768px) {
    body, html {
        font-size: calc(8px + 0.78125vw);
        min-height: 100%;
        overscroll-behavior-y: none !important;
        scroll-behavior: unset !important;
        touch-action: pan-y;
    }
}

@media (min-width: 1200px) {
    body, html {
        font-size: 0.9259259259vw;
    }
}

body *, html * {
    user-select: none;
}

/* Hide scrollbar */
body::-webkit-scrollbar {
    display: none;
}

body {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Grid System */
.row {
    --bs-gutter-x: 1.25rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-left: calc(var(--bs-gutter-x) * -0.5);
    margin-right: calc(var(--bs-gutter-x) * -0.5);
    margin-top: calc(var(--bs-gutter-y) * -1);
}

.row > * {
    flex-shrink: 0;
    margin-top: var(--bs-gutter-y);
    max-width: 100%;
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    width: 100%;
}

.col {
    flex: 1 0 0%;
}

.col-12 {
    width: 100%;
}

.col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
}

.col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
}

.col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
}

.col-sm-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
}

.col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
}

.col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
}

.col-sm-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
}

.offset-lg-2 {
    margin-left: 16.66666667%;
}

.offset-sm-1 {
    margin-left: 8.33333333%;
}

@media (min-width: 1200px) {
    .col-lg-10 {
        width: 83.33333333%;
    }

    .col-lg-9 {
        width: 75%;
    }

    .col-lg-3 {
        width: 25%;
    }

    .offset-lg-2 {
        margin-left: 16.66666667%;
    }
}

@media (min-width: 768px) {
    .col-sm-11 {
        width: 91.66666667%;
    }

    .col-sm-10 {
        width: 83.33333333%;
    }

    .col-sm-6 {
        width: 50%;
    }

    .col-sm-4 {
        width: 33.33333333%;
    }

    .offset-sm-1 {
        margin-left: 8.33333333%;
    }

    .d-sm-block {
        display: block !important;
    }

    .d-sm-none {
        display: none !important;
    }
}

.d-none {
    display: none !important;
}

.d-block {
    display: block !important;
}

@media (max-width: 767px) {
    .d-sm-block {
        display: none !important;
    }

    .d-sm-none {
        display: block !important;
    }
}

/* Typography */
.h1, h1 {
    font-size: 3.5rem;
    letter-spacing: 0;
    line-height: 84%;
    text-transform: uppercase;
    font-family: 'Avant Garde', sans-serif;
    font-weight: 700;
    display: block;
    margin-bottom: 1.875rem;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .h1, h1 {
        font-size: 4.5rem;
    }
}

@media (min-width: 1200px) {
    .h1, h1 {
        font-size: 6rem;
    }
}

.h2, h2 {
    font-size: 2.75rem;
    letter-spacing: -0.04em;
    line-height: 100%;
    font-family: 'Avant Garde', sans-serif;
    font-weight: 700;
    display: block;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .h2, h2 {
        font-size: 3.75rem;
    }
}

@media (min-width: 1200px) {
    .h2, h2 {
        font-size: 5rem;
    }
}

.body-text {
    font-size: 0.875rem;
    line-height: 180%;
    letter-spacing: 0.5em;
    margin-bottom: 1.875rem;
    font-family: 'Avant Garde', sans-serif;
    font-weight: 700;
}

.desc {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    max-width: 95%;
}

@media (min-width: 768px) {
    .desc {
        font-size: 1rem;
        line-height: 145%;
        max-width: 90%;
    }
}

@media (min-width: 1200px) {
    .desc {
        font-size: 1.1rem;
        line-height: 140%;
        max-width: 85%;
    }
}

.text-uppercase {
    text-transform: uppercase;
}

.none-break {
    white-space: nowrap;
}

.overflow-hidden {
    overflow: hidden;
}

.mb-0 {
    margin-bottom: 0;
}

/* Colors */
.text-dark {
    color: #000000 !important;
}

strong {
    color: #eb5939;
}

/* Layout */
.container {
    overflow: hidden;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.container_content {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

@media (min-width: 768px) {
    .container_content {
        padding-left: 0;
        padding-right: 0;
    }
}

.main-layer {
    position: relative;
}

.layer {
    width: 100%;
}

.layer__dark {
    background: #000000;
}

/* Header Styles */
.header {
    --top: 1.25rem;
    --color: #eb5939;
    --fill: #c7c7c7;
    --color-link: rgba(199, 199, 199, 0.5);
    --color-link-active: #c7c7c7;
    left: 0;
    mix-blend-mode: var(--mode);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9;
}

@media (any-hover: hover) {
    .header {
        --mode: difference;
    }
}

@media (min-width: 768px) {
    .header {
        --top: 2.5rem;
    }
}

@media (min-width: 1200px) {
    .header {
        --top: 6.5476190476vh;
    }
}

.header_logo {
    left: var(--screen-x);
    margin-top: 0.3125rem;
    position: fixed;
    top: var(--top);
}

.header_logo:hover svg ellipse,
.header_logo:hover svg path {
    fill: var(--color);
}

.header_logo svg ellipse,
.header_logo svg path {
    fill: var(--fill);
    transition: fill 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.header_logo img,
.header_logo svg {
    height: 2rem;
    width: 2rem;
}

@media (min-width: 1200px) {
    .header_logo img,
    .header_logo svg {
        height: 3rem;
        width: 3rem;
    }
}

.header_menu {
    position: fixed;
    right: var(--screen-x);
    top: var(--top);
}

.header_menu a {
    display: block;
    line-height: 1;
    padding: 0.25rem 0;
    position: relative;
    text-align: right;
    text-decoration: none;
    color: inherit;
}

@media (min-width: 1200px) {
    .header_menu a {
        padding: 0.375rem 0;
    }
}

.header_menu_list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.header_menu_item_inner {
    clip-path: inset(0);
    display: block;
    position: relative;
}

.header_menu_item_link {
    display: block;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), color 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.header_menu_item_link__deep {
    background: transparent;
    color: var(--color-link);
}

.header_menu_item_link__active {
    color: var(--color-link-active);
    position: absolute;
    right: 0;
    top: 0;
    transform: translateY(100%);
}

.header_menu_item.is-active .header_menu_item_link__deep,
.header_menu_item:hover .header_menu_item_link__deep {
    transform: translateY(-100%);
}

.header_menu_item.is-active .header_menu_item_link__active,
.header_menu_item:hover .header_menu_item_link__active {
    transform: translateY(0);
}

/* Client Section Styles */
.client {
    max-width: 100%;
    position: relative;
    z-index: 1;
}

.client_info {
    margin-bottom: 12.5rem;
    padding-top: 12.5rem;
}

@media (min-width: 768px) {
    .client_info {
        margin-bottom: 29.7619047619vh;
        padding-top: 29.7619047619vh;
    }
}

.client_content_desc {
    height: 20rem;
    max-width: 20.375rem;
}

@media (min-width: 768px) {
    .client_content_desc {
        height: 15.3125rem;
        max-width: unset;
    }
}

@media (min-width: 1200px) {
    .client_content_desc {
        height: unset;
    }
}

.client_list {
    margin-bottom: 12.5rem;
    position: relative;
}

@media (min-width: 768px) {
    .client_list {
        margin-bottom: 28.7698412698vh;
    }
}

/* Client Background Earth/Ground Image */
.client_bg {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -2;
}

.client_bg .image__object-fit {
    height: 100%;
    width: 100%;
    font-size: 0;
    line-height: 0;
}

.client_bg img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

/* Image Object Fit Utility */
.image__object-fit {
    font-size: 0;
    height: 100%;
    line-height: 0;
    width: 100%;
}

.image__object-fit:not(.image__object-max) .vc_single_image-wrapper {
    overflow-y: hidden;
    position: relative;
}

.image__object-fit:not(.image__object-max) img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.image__object-contain {
    font-size: 0;
}

.image__object-contain img {
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.image__object-max {
    font-size: 0;
}

.image__object-max img {
    max-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

/* Lazy Loading Images */
.js-image--lazy {
    pointer-events: none;
    position: relative;
}

.js-image--lazy.is-loaded {
    opacity: 0;
    visibility: hidden;
}

.js-image--lazy.is-clone {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2;
}

.js-image--lazy__wrapper {
    font-size: 0;
    line-height: 0;
    position: relative;
}

/* 3D Background Planet */
.client_list_3d {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.client_list_3d_inner {
    height: 150%;
    margin-left: -12.5rem;
    margin-top: -6.25rem;
    position: relative;
    width: 150%;
}

@media (min-width: 768px) {
    .client_list_3d_inner {
        height: 100%;
        margin-left: unset;
        margin-top: unset;
        width: 100%;
    }
}

.client_list_3d_image {
    display: none;
}

.client_list_3d canvas {
    display: block;
    height: 100%;
    width: 100%;
}

/* Touch Device Fallback */
.is-touch .client_list_3d_image {
    display: block !important;
    height: 115%;
    left: 47%;
    position: absolute;
    top: 45%;
    transform: translate(-50%, -50%);
    width: 115%;
}

@media (min-width: 768px) {
    .is-touch .client_list_3d_image {
        height: 130%;
        width: 130%;
    }
}

.is-touch .client_list_3d_image img {
    height: 100%;
    object-fit: contain;
    width: 100%;
}

/* Client List Inner Content */
.client_list_inner {
    position: relative;
    z-index: 1;
}

/* Heading Mask Effects */
.heading-mask {
    border-top: 1px solid rgba(199, 199, 199, 0.15);
    position: relative;
}

.heading-mask:last-child {
    border-bottom: 1px solid rgba(199, 199, 199, 0.15);
}

.heading-mask_el {
    display: block;
    line-height: 100%;
    height: auto;
    padding: 0.5rem 0;
    min-height: 4rem;
}

.heading-mask_el h1,
.heading-mask_el h2,
.heading-mask_el .h1,
.heading-mask_el .h2 {
    margin-top: 0;
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .heading-mask_el {
        align-items: unset;
        display: block;
        height: unset;
        padding: 0.6rem 0;
        min-height: 5rem;
    }
}

@media (min-width: 1200px) {
    .heading-mask_el {
        padding: 0.8rem 0;
        min-height: 6rem;
    }
}

.heading-mask_el__deep {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.heading-mask_el__masking {
    background: #ffffff;
    clip-path: inset(50% 0 50% 0);
    pointer-events: none;
    position: relative;
    transition: clip-path 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 2;
    opacity: 1;
    visibility: visible;
}

/* =============================
   Fix: Help/Services section heading mask - full viewport white mask on hover
   ============================= */
#helpSection .heading-mask_el__masking {
    background: transparent !important;
    z-index: 0;
    clip-path: inset(50% -100vw 50% -100vw) !important;
}

#helpSection .heading-mask_el__masking::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    background: #ffffff;
    z-index: 0;
}

#helpSection .heading-mask_el__masking .simple-masking_el {
    position: relative;
    z-index: 1;
}

#helpSection .client_list_inner .heading-mask:hover .heading-mask_el__masking,
#helpSection .client_list_inner .js-heading-mask:hover .heading-mask_el__masking,
#helpSection .heading-mask.is-hover .heading-mask_el__masking {
    clip-path: inset(0 -100vw 0 -100vw) !important;
}

#helpSection .section2-container .container {
    overflow: visible !important;
}

/* Masking content swap: keep row height with title, reveal paragraph on hover */
.heading-mask_el__masking .simple-masking_el {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
}

.heading-mask_el__masking .h1 {
    opacity: 1;
    transition: opacity .3s ease;
}
.heading-mask_el__masking .desc {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    opacity: 0;
    visibility: hidden;
    margin: 0;
    color: #000000 !important;
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
    max-width: 70ch;
}

@media (min-width: 1200px) {
    .heading-mask_el__masking .desc {
        max-width: 80ch;
    }
}

.heading-mask.is-hover .heading-mask_el__masking .h1,
.js-heading-mask:hover .heading-mask_el__masking .h1 {
    opacity: 0;
}

.heading-mask.is-hover .heading-mask_el__masking .desc,
.js-heading-mask:hover .heading-mask_el__masking .desc {
    opacity: 1;
    visibility: visible;
}

.heading-mask_el__masking .simple-masking_el {
    padding: 0;
}

/* Simple Masking */
.simple-masking {
    position: relative;
}

.simple-masking_el {
    display: inline-block;
}

/* Dots Indicator */
.dots {
    display: flex;
    gap: 0.75rem;
    margin-top: 2.0625rem;
    position: relative;
}

@media (min-width: 768px) {
    .dots {
        padding-left: 0.625rem;
    }
}

.dots span {
    background: #c7c7c7;
    border-radius: 50%;
    display: block;
    height: 0.5rem;
    width: 0.5rem;
}

@media (min-width: 768px) {
    .dots span {
        height: 0.75rem;
        width: 0.75rem;
    }
}

/* Parallax & Scroll Effects */
[data-lenis-parallax],
[data-lenis-speed] {
    display: block;
    transform: translate3d(0, var(--offset-parallax, 0px), 0) rotate(0);
    will-change: transform;
}

/* Scroll Paragraph Mask */
.scroll-paragraph-mask {
    line-height: 82%;
    position: relative;
}

.scroll-paragraph-mask .line {
    padding-bottom: 0.2em;
}

/* Cursor Effects */
.js-cursor-extend,
.js-cursor-contract {
    cursor: pointer;
}

/* Utility Classes */
.ul__reset {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.align-items-center {
    align-items: center !important;
}

/* Responsive Breakpoints */
@media (max-width: 767px) {
    .row {
        --bs-gutter-x: 0.625rem;
    }
}

/* Animation Classes */
.js-anim--scale {
    transform-origin: center;
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.js-heading-mask {
    cursor: pointer;
}

/* Loading States */
.is-animation-loading {
    opacity: 0;
}

.is-loaded .is-animation-loading {
    opacity: 1;
    transition: opacity 0.6s ease;
}

/* =====================================
   Fix: prevent heading clipping in Help/Services section
   Scope: #helpSection (Section Two)
   ============================= */
#helpSection .col-lg-10.offset-lg-2,
#helpSection .col-sm-11.offset-sm-1 {
    margin-left: 0 !important;
    width: 100% !important;
}

/* Let the title container show full text (masking still handled by inner layer) */
#helpSection .simple-masking.overflow-hidden {
    overflow: visible !important;
}

/* On smaller screens allow breaking to next line to avoid cut-off */
@media (max-width: 1199.98px) {
    #helpSection .none-break {
        white-space: normal !important;
    }
}

/* =============================
   Persian/RTL Section Styles
   ============================= */

/* Persian font for FA section */
#sectionTwoFa,
#sectionTwoFa * {
    font-family: 'Dana', 'Vazir', 'Tahoma', Arial, sans-serif !important;
    direction: rtl !important;
    text-align: right !important;
}

/* RTL layout adjustments */
#sectionTwoFa .col-lg-10.offset-lg-2 {
    margin-left: 16.66666667% !important;
    margin-right: 0% !important;
    width: 83.33333333% !important;
}

#sectionTwoFa .col-sm-11.offset-sm-1 {
    margin-left: 8.33333333% !important;
    margin-right: 0% !important;
    width: 91.66666667% !important;
}

/* Adjust Persian text line-height and letter-spacing */
#sectionTwoFa .h1,
#sectionTwoFa h1,
#sectionTwoFa .h2,
#sectionTwoFa h2 {
    letter-spacing: 0 !important;
    line-height: 100% !important;
    text-transform: none !important;
}

/* Reduce Persian heading sizes for better fit */
#sectionTwoFa .h1,
#sectionTwoFa h1 {
    font-size: 2.8rem !important;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    #sectionTwoFa .h1,
    #sectionTwoFa h1 {
        font-size: 3.6rem !important;
    }
}

@media (min-width: 1200px) {
    #sectionTwoFa .h1,
    #sectionTwoFa h1 {
        font-size: 4.8rem !important;
    }
}

#sectionTwoFa .desc {
    letter-spacing: normal !important;
    line-height: 160% !important;
    text-align: right !important;
}

/* Fix Persian text positioning in masking effect */
#sectionTwoFa .heading-mask_el__masking .desc {
    left: auto !important;
    right: 0 !important;
    text-align: right !important;
    max-width: 85% !important;
}

@media (min-width: 768px) {
    #sectionTwoFa .heading-mask_el__masking .desc {
        max-width: 90% !important;
    }
}

@media (min-width: 1200px) {
    #sectionTwoFa .heading-mask_el__masking .desc {
        max-width: 85% !important;
    }
}

/* Make sure Persian content container respects RTL */
#sectionTwoFa .container_content {
    text-align: right !important;
    direction: rtl !important;
    padding-right: 1rem !important;
    padding-left: 0 !important;
}

@media (min-width: 768px) {
    #sectionTwoFa .container_content {
        padding-right: 2rem !important;
        padding-left: 0 !important;
    }
}

@media (min-width: 1200px) {
    #sectionTwoFa .container_content {
        padding-right: 3rem !important;
        padding-left: 0 !important;
    }
}

/* Improve Persian text readability */
#sectionTwoFa .simple-masking_el {
    direction: rtl !important;
}

/* RTL responsive adjustments */
@media (min-width: 1200px) {
    #sectionTwoFa .col-lg-10.offset-lg-2 {
        margin-right: 0% !important;
        margin-left: 16.66666667% !important;
        width: 83.33333333% !important;
    }
}

@media (min-width: 768px) {
    #sectionTwoFa .col-sm-11.offset-sm-1 {
        margin-right: 0% !important;
        margin-left: 8.33333333% !important;
        width: 91.66666667% !important;
    }
}

/* Ensure service titles (deep layer and masking layer) sit on the right edge in FA */
#sectionTwoFa .heading-mask_el__deep .simple-masking,
#sectionTwoFa .heading-mask_el__masking .simple-masking {
    text-align: right !important;
}

/* Ensure FA titles themselves are right-aligned inside each layer */
#sectionTwoFa .heading-mask_el__deep h1,
#sectionTwoFa .heading-mask_el__deep h2,
#sectionTwoFa .heading-mask_el__masking h1,
#sectionTwoFa .heading-mask_el__masking h2 {
    text-align: right !important;
    direction: rtl !important;
    display: block;
    width: 100%;
}

/* Align the inner container to the right for FA so titles hug right edge */
#sectionTwoFa .heading-mask_el .container_content {
    text-align: right !important;
}

/* Keep EN layout left-aligned for service titles */
#sectionTwo .heading-mask_el__deep .simple-masking,
#sectionTwo .heading-mask_el__masking .simple-masking,
#sectionTwo .heading-mask_el .container_content {
    text-align: left !important;
}

/* Nudge the inline-block wrapper itself to the right in FA */
#sectionTwoFa .simple-masking_el {
    float: right !important;
}

/* =====================================
   Inset spacing for services titles (Help section)
   - FA: padding-right
   - EN: padding-left
   ===================================== */
#helpSection #sectionTwoFa .container_content {
    padding-right: 6rem !important; /* +2rem more */
    padding-left: 0 !important;
}

@media (min-width: 768px) {
    #helpSection #sectionTwoFa .container_content {
        padding-right: 7.5rem !important; /* +2.5rem more */
    }
}

@media (min-width: 1200px) {
    #helpSection #sectionTwoFa .container_content {
        padding-right: 12rem !important; /* +4rem more */
    }
}

#helpSection #sectionTwo .container_content {
    padding-left: 6rem !important; /* +2rem more */
    padding-right: 0 !important;
    text-align: left !important;
}

@media (min-width: 768px) {
    #helpSection #sectionTwo .container_content {
        padding-left: 7.5rem !important; /* +2.5rem more */
    }
}

@media (min-width: 1200px) {
    #helpSection #sectionTwo .container_content {
        padding-left: 12rem !important; /* +4rem more */
    }
}

/* Balance vertical centering between separator lines for FA titles */
#helpSection #sectionTwoFa .heading-mask_el {
    padding-top: 0.6rem !important;
    padding-bottom: 0.6rem !important;
}

/* Mobile Responsive for Persian Services Section */
@media (max-width: 767px) {
    /* Full width on mobile */
    #sectionTwoFa .col-lg-10.offset-lg-2,
    #sectionTwoFa .col-sm-11.offset-sm-1 {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    /* Adjust container padding for mobile */
    #sectionTwoFa .container_content {
        padding-right: 1rem !important;
        padding-left: 1rem !important;
        text-align: right !important;
        direction: rtl !important;
    }

    /* Smaller heading sizes for mobile */
    #sectionTwoFa .h1,
    #sectionTwoFa h1 {
        font-size: 2.2rem !important;
        line-height: 100% !important;
    }

    /* Adjust description text for mobile */
    #sectionTwoFa .desc {
        font-size: 0.85rem !important;
        line-height: 170% !important;
        max-width: 100% !important;
        text-align: right !important;
    }

    /* Full width description on hover for mobile */
    #sectionTwoFa .heading-mask_el__masking .desc {
        max-width: 95% !important;
        right: 0 !important;
        left: auto !important;
        font-size: 0.85rem !important;
        line-height: 170% !important;
    }

    /* Adjust heading mask padding for mobile */
    #sectionTwoFa .heading-mask_el {
        padding: 0.5rem 0 !important;
    }

    /* Better spacing for mobile */
    #sectionTwoFa .client_list {
        margin-bottom: 8rem !important;
    }
}

/* Extra small mobile devices */
@media (max-width: 480px) {
    #sectionTwoFa .h1,
    #sectionTwoFa h1 {
        font-size: 1.8rem !important;
        line-height: 95% !important;
    }

    #sectionTwoFa .desc {
        font-size: 0.8rem !important;
        line-height: 175% !important;
    }

    #sectionTwoFa .heading-mask_el__masking .desc {
        font-size: 0.8rem !important;
        line-height: 175% !important;
        max-width: 98% !important;
    }

    #sectionTwoFa .container_content {
        padding-right: 0.75rem !important;
        padding-left: 0.75rem !important;
    }
}
