:root {
            --Primary-Dodger: #0C1C44;
            --Primary-dodger-1: #243257;
            --Primary-dodger-2: #55617D;
            --color-primary: var(--Primary-Dodger);
            --bg-page: #FFFFFF;
            --font-primary: 'Almarai', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        *,
        *::before,
        *::after {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            font-family: inherit;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            background-color: var(--bg-page);
            color: var(--color-primary);
            font-family: var(--font-primary);
            line-height: 1.6;
            direction: rtl;
            text-align: right;
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        img,
        picture {
            display: block;
            max-width: 100%;
            height: auto;
        }

        .container {
            width: 100%;
            max-width: 1320px;
            margin-inline: auto;
            padding-inline: clamp(16px, 3vw, 24px);
        }

        .full-banner-section {
            width: 100%;
            margin: 0;
            padding: 0;
            line-height: 0;
            overflow: hidden;
        }

        .full-banner-picture {
            width: 100%;
            display: block;
            line-height: 0;
        }

        .full-banner-img {
            width: 100%;
            height: auto;
            display: block;
            object-fit: cover;
        }

        .stores-heading-section {
            margin-top: 88px;
            margin-bottom: 0;
            text-align: start;
            width: 100%;
        }

        .stores-heading-title {
            color: #0C1C44;
            font-family: 'Almarai', sans-serif;
            font-size: 47px;
            font-weight: 400;
            line-height: 1.5;
            text-align: start;
            margin: 0;
        }

        .stores-heading-title .highlight-cyan {
            color: #15C5FE;
            display: inline;
        }

        .stores-heading-desc {
            color: #0C1C44;
            font-family: 'Almarai', sans-serif;
            font-size: 20px;
            font-weight: 300;
            line-height: 1.4;
            text-align: start;
            margin-top: 16px;
            margin-bottom: 0;
        }

        .desktop-break {
            display: inline;
        }

        @media (min-width: 793px) {
            .desktop-break {
                display: block;
            }
        }

        .cases-cards-section {
            width: 100%;
            margin-top: clamp(36px, 4.5vw, 56px);
            margin-bottom: clamp(60px, 7vw, 88px);
        }

        .cases-cards-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            align-items: stretch;
            gap: 24px;
            width: 100%;
        }

        .case-card {
            display: flex;
            flex-direction: column;
            height: 100%;
            min-height: 200px;
            background: #FFFFFF;
            padding: 24px 25px 23px 25px;
            border-radius: 24px;
            border: 1px solid rgba(36, 50, 87, 0.20);
            box-shadow: 0 4px 10px 0 rgba(242, 242, 242, 0.50);
            text-decoration: none;
            color: inherit;
            transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
            box-sizing: border-box;
            cursor: pointer;
        }

        .case-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 10px 24px 0 rgba(12, 28, 68, 0.08);
            border-color: rgba(21, 197, 254, 0.45);
        }

        .case-card-title {
            color: #111A3C;
            text-align: right;
            font-family: 'Almarai', sans-serif;
            font-size: 20px;
            font-weight: 400;
            line-height: 1.7;
            margin: 0;
            max-width: 100%;
            flex: 1 0 auto;
        }

        .case-card:nth-child(1) .case-card-title {
            max-width: 302px;
        }

        .case-card:nth-child(2) .case-card-title {
            max-width: 368px;
        }

        .case-card:nth-child(3) .case-card-title {
            width: 248px;
            max-width: 100%;
        }

        .case-card-divider {
            height: 1.1px;
            margin-top: auto;
            margin-bottom: 24px;
            align-self: stretch;
            background: #EDF0F4;
            border: none;
            width: 100%;
        }

        .case-card-bottom {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 16px;
            width: 100%;
        }

        .case-card-info {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            text-align: right;
        }

        .case-card-number-wrapper {
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

        .case-card-number {
            color: var(--Primary-dodger-1, #243257);
            text-align: right;
            font-family: 'Anton', sans-serif;
            font-size: 40px;
            font-weight: 400;
            letter-spacing: 1.2px;
            line-height: 1.1;
            margin: 0;
        }

        .down-arrow-metric {
            width: auto;
            height: 43px;
            display: block;
            flex-shrink: 0;
        }

        .case-card-subtext {
            color: var(--Primary-dodger-2, #55617D);
            text-align: right;
            font-family: 'Almarai', sans-serif;
            font-size: 16px;
            font-weight: 400;
            line-height: 1.4;
            margin-top: 8px;
            margin-bottom: 0;
        }

        .case-card-icon-btn {
            width: 42px;
            height: 42px;
            border-radius: 999px;
            border: 1px solid rgba(12, 28, 68, 0.20);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            transition: background 0.2s ease, border-color 0.2s ease;
        }

        .case-card:hover .case-card-icon-btn {
            border-color: #0C1C44;
            background: rgba(12, 28, 68, 0.04);
        }

        .final-cta-section {
            width: 100%;
            margin: 0;
            padding: 0;
            padding-inline: 16px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .final-cta-section .full-banner-picture {
            width: 100%;
            max-width: 1320px;
            margin-inline: auto;
        }

        .final-cta-btn-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            margin-top: 55px;
            padding-bottom: clamp(60px, 8vw, 100px);
        }

        .final-cta-btn {
            display: inline-flex;
            width: 300px;
            min-height: 52px;
            padding: 0 16px;
            justify-content: center;
            align-items: center;
            gap: 10px;
            border-radius: 24px;
            background: linear-gradient(270deg, #DA1C7E 0%, #890E7D 100%);
            box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.10);
            color: #FFF;
            text-align: center;
            font-family: 'Almarai', sans-serif;
            font-size: 22px;
            font-style: normal;
            font-weight: 400;
            line-height: 29px;
            letter-spacing: 0.033px;
            text-decoration: none;
            transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
            cursor: pointer;
        }

        .final-cta-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 14px 0 rgba(218, 28, 126, 0.35);
            color: #FFF;
        }

        .faq-section {
            background: #031427 url('../img/faq_bg.webp') no-repeat center top / cover;
            padding-top: 100px;
            padding-bottom: 90px;
            position: relative;
        }

        .faq-title {
            font-family: 'Almarai', sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 50px;
            line-height: 64px;
            letter-spacing: 0%;
            text-align: right;
            vertical-align: middle;
            color: #FFFFFF;
            margin-bottom: 60px;
        }

        .faq-title .highlight {
            color: #15C5FE;
        }

        .accordion-wrapper {
            width: 100%;
            display: flex;
            flex-direction: column;
        }

        .accordion-item {
            border-bottom: 0.8px solid #DFE2EA;
            width: 100%;
            transition: background-color 0.2s ease;
        }

        .accordion-header {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 26px 0;
            cursor: pointer;
            user-select: none;
            background: none;
            border: none;
            outline: none;
            color: inherit;
            text-align: right;
        }

        .accordion-question {
            font-family: 'Almarai', sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 25px;
            line-height: 100%;
            letter-spacing: 0%;
            text-align: right;
            color: #DFE2EA;
            padding-left: 20px;
            transition: color 0.2s ease;
        }

        .accordion-item:hover .accordion-question,
        .accordion-item.active .accordion-question {
            color: #FFFFFF;
        }

        .accordion-icon {
            flex-shrink: 0;
            width: 15px;
            height: 13px;
            transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            color: #DFE2EA;
        }

        .accordion-item.active .accordion-icon {
            transform: rotate(180deg);
        }

        .accordion-content {
            display: grid;
            grid-template-rows: 0fr;
            transition: grid-template-rows 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .accordion-item.active .accordion-content {
            grid-template-rows: 1fr;
        }

        .accordion-inner {
            overflow: hidden;
        }

        .accordion-answer {
            font-family: 'Almarai', sans-serif;
            font-weight: 300;
            font-size: 18px;
            line-height: 1.6;
            color: #DFE2EA;
            padding-bottom: 26px;
            text-align: right;
        }

        @media (max-width: 991px) and (min-width: 793px) {
            .cases-cards-grid {
                grid-template-columns: 1fr;
                gap: 20px;
            }

            .faq-section {
                padding-top: 75px;
                padding-bottom: 70px;
            }

            .faq-title {
                font-size: 34px;
                line-height: 48px;
                margin-bottom: 36px;
            }

            .accordion-header {
                padding: 20px 0;
            }

            .accordion-question {
                font-size: 18px;
                line-height: 1.45;
                padding-left: 16px;
            }

            .accordion-answer {
                font-size: 15px;
                line-height: 1.7;
                padding-bottom: 20px;
            }
        }

        @media (max-width: 792px) {
            .stores-heading-section {
                margin-top: 44px;
                margin-bottom: 0;
            }

            .stores-heading-title {
                font-size: 28px;
                line-height: 1.5;
            }

            .stores-heading-title .highlight-cyan {
                display: block;
                line-height: 1.5;
            }

            .stores-heading-desc {
                font-size: 13px;
                line-height: 1.4;
                margin-top: 10px;
            }

            .cases-cards-section {
                margin-top: 32px;
                margin-bottom: 44px;
            }

            .cases-cards-grid {
                grid-template-columns: 1fr;
                gap: 16px;
            }

            .case-card {
                padding: 20px;
                border-radius: 20px;
            }

            .case-card-title {
                font-size: 17px;
            }

            .case-card:nth-child(1) .case-card-title {
                max-width: 250px;
            }

            .case-card:nth-child(2) .case-card-title {
                max-width: 300px;
            }

            .case-card:nth-child(3) .case-card-title {
                width: auto;
                max-width: 100%;
            }

            .case-card-divider {
                margin-top: auto;
                margin-bottom: 20px;
            }

            .case-card-number {
                font-size: 34px;
            }

            .down-arrow-metric {
                height: 35px;
            }

            .final-cta-btn-wrapper {
                margin-top: 16px;
                padding-bottom: 50px;
            }

            .final-cta-btn {
                height: 42px;
                min-height: 42px;
                padding: 16px;
                font-size: 12px;
                line-height: normal;
                width: auto;
                min-width: 200px;
            }

            .faq-section {
                padding-top: 60px;
                padding-bottom: 50px;
            }

            .faq-title {
                font-size: 26px;
                line-height: 44px;
                letter-spacing: 0.25px;
                text-align: right;
                vertical-align: middle;
                margin-bottom: 30px;
            }

            .accordion-header {
                padding: 18px 0;
            }

            .accordion-question {
                font-size: 15px;
                line-height: 23px;
                letter-spacing: 0.5%;
                padding-left: 14px;
            }

            .accordion-icon {
                width: 13px;
                height: 11px;
            }

            .accordion-answer {
                font-size: 13px;
                line-height: 1.6;
                padding-bottom: 18px;
            }
        }
