﻿

/* ============================================================
   EXTRACTED FROM: Default.aspx
   ============================================================ */

/* ================================
       فونت Parastoo
    ================================= */

    @font-face {
        font-family: 'Parastoo';

        src: url('Font/Parastoo.eot');

        src: url('Font/Parastoo.eot?#iefix') format('embedded-opentype'),
             url('Font/Parastoo.woff') format('woff'),
             url('Font/Parastoo.ttf') format('truetype');

        font-weight: normal;
        font-style: normal;
        font-display: swap;
    }


    /* ================================
       اعمال فونت به کل سایت
    ================================= */

    html,
    body,
    body *,
    input,
    textarea,
    select,
    button {
        font-family: 'Parastoo', Tahoma, sans-serif !important;
    }


    * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

                    * {
                        box-sizing: border-box;
                        margin: 0;
                        padding: 0;
                    }

                    :root {
                        --blue: #1769ff;
                        --blue-dark: #0d4fc7;
                        --blue-light: #edf4ff;

                        --text: #111827;
                        --muted: #6b7280;

                        --border: #e6eaf0;

                        --bg: #f7f9fc;

                        --green: #18b66a;
                        --danger: #ef4444;

                        --white: #ffffff;
                    }

                    html {
                        scroll-behavior: smooth;
                    }

                    body {
                       
                        background: var(--bg);
                        color: var(--text);
                        line-height: 1.9;
                        overflow-x: hidden;
                    }

                    a {
                        text-decoration: none;
                        color: inherit;
                    }


                    /* ===================================
                       NAVBAR
                    =================================== */

                    .navbar {
                        position: fixed;
                        top: 0;
                        right: 0;
                        left: 0;

                        height: 76px;

                        z-index: 1000;

                        transition: .3s;
                    }

                    .navbar.scrolled {
                        background: rgba(255,255,255,.88);

                        backdrop-filter: blur(18px);

                        box-shadow: 0 8px 35px rgba(0,0,0,.06);
                    }

                    .nav-inner {
                        max-width: 1180px;

                        height: 100%;

                        margin: auto;

                        padding: 0 25px;

                        display: flex;

                        align-items: center;

                        justify-content: space-between;
                    }


                    /* LOGO */

                    .logo {
                        display: flex;

                        align-items: center;

                        gap: 10px;

                        font-size: 19px;

                        font-weight: 800;
                    }

                    .logo-icon {
                        width: 42px;
                        height: 42px;

                        border-radius: 13px;

                        background: var(--blue);

                        color: white;

                        display: flex;

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

                        font-size: 22px;

                        box-shadow:
                            0 10px 25px rgba(23,105,255,.25);
                    }


                    /* MENU */

                    .nav-links {
                        display: flex;

                        align-items: center;

                        gap: 30px;

                        color: #687386;

                        font-size: 13px;
                    }

                    .nav-links a {
                        transition: .2s;
                    }

                    .nav-links a:hover {
                        color: var(--blue);
                    }


                    .nav-button {
                        background: #111827;

                        color: white;

                        padding: 10px 19px;

                        border-radius: 12px;

                        font-size: 12px;

                        transition: .25s;
                    }

                    .nav-button:hover {
                        transform: translateY(-2px);
                    }


                    /* ===================================
                       HERO
                    =================================== */

                    .hero {

                        min-height: 720px;

                        padding:
                            160px 25px
                            90px;

                        position: relative;

                        overflow: hidden;

                        background:

                            radial-gradient(
                                circle at 80% 20%,
                                rgba(23,105,255,.13),
                                transparent 32%
                            ),

                            radial-gradient(
                                circle at 10% 80%,
                                rgba(23,105,255,.08),
                                transparent 30%
                            ),

                            #ffffff;
                    }


                    .hero:before {

                        content: "";

                        position: absolute;

                        width: 600px;
                        height: 600px;

                        border-radius: 50%;

                        border: 1px solid
                            rgba(23,105,255,.07);

                        right: -250px;

                        top: 80px;
                    }


                    .hero-inner {

                        max-width: 1180px;

                        margin: auto;

                        display: grid;

                        grid-template-columns:
                            1.1fr .9fr;

                        align-items: center;

                        gap: 80px;
                    }


                    .hero-badge {

                        display: inline-flex;

                        align-items: center;

                        gap: 9px;

                        padding: 7px 14px;

                        border-radius: 50px;

                        background:
                            var(--blue-light);

                        color: var(--blue);

                        font-size: 12px;

                        font-weight: 600;

                        margin-bottom: 20px;
                    }


                    .pulse {

                        width: 7px;
                        height: 7px;

                        border-radius: 50%;

                        background:
                            var(--green);

                        box-shadow:
                            0 0 0 5px
                            rgba(24,182,106,.12);
                    }


                    .hero h1 {

                        font-size:
                            clamp(40px,5vw,68px);

                        line-height: 1.25;

                        letter-spacing: -2px;

                        font-weight: 800;

                        margin-bottom: 20px;
                    }


                    .hero h1 span {

                        color:
                            var(--blue);
                    }


                    .hero-description {

                        max-width: 620px;

                        color:
                            var(--muted);

                        font-size: 16px;

                        margin-bottom: 30px;
                    }


                    .hero-buttons {

                        display: flex;

                        gap: 12px;

                        flex-wrap: wrap;
                    }


                    /* BUTTONS */

                    .btn-primary {

                        border: 0;

                        background:
                            var(--blue);

                        color: white;

                        padding:
                            14px 28px;

                        border-radius: 14px;

                        cursor: pointer;

                        font-family: inherit;

                        font-size: 13px;

                        font-weight: 600;

                        box-shadow:
                            0 14px 30px
                            rgba(23,105,255,.22);

                        transition: .25s;
                    }


                    .btn-primary:hover {

                        background:
                            var(--blue-dark);

                        transform:
                            translateY(-3px);
                    }


                    .btn-secondary {

                        background: white;

                        border:
                            1px solid
                            var(--border);

                        padding:
                            14px 25px;

                        border-radius: 14px;

                        font-family: inherit;

                        font-size: 13px;

                        cursor: pointer;

                        transition: .25s;
                    }


                    .btn-secondary:hover {

                        border-color:
                            #c9d7ee;

                        transform:
                            translateY(-2px);
                    }


                    /* ===================================
                       PRICE CARD
                    =================================== */

                    .hero-card {
                        position: relative;
                    }


                    .price-card {

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

                        border:
                            1px solid
                            rgba(255,255,255,.95);

                        border-radius: 30px;

                        padding: 35px;

                        box-shadow:

                            0 30px 80px
                            rgba(20,40,80,.12),

                            inset 0 1px 0 white;

                        backdrop-filter:
                            blur(20px);

                        position: relative;
                    }


                    .price-card:before {

                        content: "";

                        position: absolute;

                        inset: -1px;

                        border-radius: 30px;

                        background:
                            linear-gradient(
                                135deg,
                                rgba(23,105,255,.18),
                                transparent 45%
                            );

                        pointer-events: none;
                    }


                    .mini-label {

                        color:
                            var(--muted);

                        font-size: 12px;
                    }


                    .price {

                        font-size: 62px;

                        font-weight: 800;

                        direction: ltr;

                        text-align: right;

                        line-height: 1.2;

                        margin: 5px 0;
                        color: #1769ff;
                    }


                    .price small {

                        font-size: 17px;

                        color:
                            var(--muted);

                        font-weight: 500;
                    }


                    .price-line {

                        height: 1px;

                        background:
                            var(--border);

                        margin: 25px 0;
                    }


                    .country-preview {

                        display: flex;

                        flex-wrap: wrap;

                        gap: 8px;

                        margin-top: 15px;
                    }


                    .country-tag {

                        padding:
                            7px 12px;

                        background:
                            #f3f6fb;

                        border-radius: 9px;

                        font-size: 11px;
                    }


                    /* ===================================
                       GENERAL SECTIONS
                    =================================== */

                    section {
                        padding:
                            100px 25px;
                    }


                    .container {

                        max-width: 1180px;

                        margin: auto;
                    }


                    .section-title {

                        text-align: center;

                        max-width: 680px;

                        margin:
                            0 auto 55px;
                    }


                    .eyebrow {

                        color:
                            var(--blue);

                        font-size: 12px;

                        font-weight: 700;

                        margin-bottom: 8px;
                    }


                    .section-title h2 {

                        font-size: 35px;

                        line-height: 1.4;

                        margin-bottom: 12px;
                    }


                    .section-title p {

                        color:
                            var(--muted);

                        font-size: 13px;
                    }


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

                    .features {
                        background:
                            white;
                    }


                    .feature-grid {

                        display: grid;

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

                        gap: 18px;
                    }


                    .feature {

                        padding:
                            30px 24px;

                        border:
                            1px solid
                            var(--border);

                        border-radius: 20px;

                        background:
                            white;

                        transition: .3s;
                    }


                    .feature:hover {

                        transform:
                            translateY(-8px);

                        border-color:
                            #cfdcff;

                        box-shadow:
                            0 20px 45px
                            rgba(20,50,100,.08);
                    }


                    .feature-icon {

                        width: 48px;
                        height: 48px;

                        border-radius: 14px;

                        background:
                            var(--blue-light);

                        color:
                            var(--blue);

                        display: flex;

                        align-items: center;

                        justify-content: center;

                        font-size: 20px;

                        margin-bottom: 18px;
                    }


                    .feature h3 {

                        font-size: 15px;

                        margin-bottom: 8px;
                    }


                    .feature p {

                        color:
                            var(--muted);

                        font-size: 11px;
                    }


                    /* ===================================
                       HOW IT WORKS
                    =================================== */

                    .steps {

                        background:
                            var(--bg);
                    }


                    .steps-grid {

                        display: grid;

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

                        gap: 20px;
                    }


                    .step {

                        background:
                            white;

                        border-radius: 20px;

                        padding: 25px;

                        border:
                            1px solid
                            var(--border);
                    }


                    .step-number {

                        font-size: 40px;

                        font-weight: 800;

                        color:
                            #e8eef9;

                        direction: ltr;
                    }


                    .step h3 {

                        font-size: 14px;

                        margin-top: 10px;
                    }


                    .step p {

                        color:
                            var(--muted);

                        font-size: 11px;

                        margin-top: 5px;
                    }


                    /* ===================================
                       COUNTRIES
                    =================================== */

                    .countries {

                        background:
                            white;
                    }


                    .country-grid {

                        display: grid;

                        grid-template-columns:
                            repeat(5,1fr);

                        gap: 15px;
                    }


                    .country {

                        padding:
                            25px 15px;

                        text-align: center;

                        border:
                            1px solid
                            var(--border);

                        border-radius: 18px;

                        transition: .25s;
                    }


                    .country:hover {

                        border-color:
                            var(--blue);

                        transform:
                            translateY(-4px);
                    }


                   .flag {
    width: 48px;
    height: 48px;

    margin: 0 auto 8px;

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

.flag {
    width: 48px;
    height: 48px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.flag img {
    display: block !important;
    width: 42px !important;
    height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
    object-fit: contain !important;
    visibility: visible !important;
    opacity: 1 !important;
}


                    .country strong {

                        font-size: 13px;
                    }


                    .country small {

                        display: block;

                        color:
                            var(--muted);

                        font-size: 10px;

                        margin-top: 3px;
                    }


                    /* ===================================
                       SHOP
                    =================================== */

                    .shop {
                        background:
                            radial-gradient(circle at 15% 35%, rgba(23,105,255,.12), transparent 28%),
                            radial-gradient(circle at 88% 70%, rgba(23,105,255,.07), transparent 25%),
                            #f7faff;
                        position: relative;
                        overflow: hidden;
                    }

                    .shop:before {
                        content: "";
                        position: absolute;
                        width: 420px;
                        height: 420px;
                        border-radius: 50%;
                        right: -220px;
                        top: 100px;
                        background: rgba(23,105,255,.045);
                        pointer-events: none;
                    }

                    .shop:after {
                        content: "";
                        position: absolute;
                        width: 110px;
                        height: 110px;
                        left: 25px;
                        bottom: 90px;
                        opacity: .45;
                        background-image: radial-gradient(#a9bfe8 1.5px, transparent 1.5px);
                        background-size: 20px 20px;
                        pointer-events: none;
                    }

                    .shop-box {
                        position: relative;
                        z-index: 2;
                        max-width: 620px;
                        margin: auto;
                        background: rgba(255,255,255,.97);
                        border-radius: 28px;
                        padding: 30px 34px 32px;
                        border: 1px solid rgba(222,229,240,.9);
                        box-shadow:
                            0 30px 75px rgba(35,70,120,.10),
                            0 5px 18px rgba(35,70,120,.035);
                    }

                    .shop-header {
                        text-align: center;
                        margin-bottom: 22px;
                    }

                    .shop-cart-icon {
                        width: 48px;
                        height: 48px;
                        margin: 0 auto 12px;
                        border-radius: 14px;
                        background: var(--blue);
                        color: #fff;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        box-shadow: 0 10px 24px rgba(23,105,255,.23);
                    }

                    .shop-cart-icon svg {
                        width: 24px;
                        height: 24px;
                        fill: none;
                        stroke: currentColor;
                        stroke-width: 1.8;
                        stroke-linecap: round;
                        stroke-linejoin: round;
                    }

                    .shop-header h2 {
                        font-size: 26px;
                        line-height: 1.4;
                        margin-bottom: 3px;
                    }

                    .shop-header p {
                        color: #8993a3;
                        font-size: 10px;
                    }

                    .shop-divider {
                        width: 72px;
                        height: 2px;
                        background: #e5ebf4;
                        margin: 0 auto 22px;
                        position: relative;
                    }

                    .shop-divider span {
                        position: absolute;
                        width: 7px;
                        height: 7px;
                        border-radius: 50%;
                        background: var(--blue);
                        left: calc(50% - 3px);
                        top: -2px;
                    }

                    .shop-form-group {
                        margin-bottom: 14px;
                    }

                    .shop-form-label {
                        display: flex;
                        align-items: center;
                        gap: 6px;
                        font-size: 11px;
                        font-weight: 600;
                        color: #1d2735;
                        margin-bottom: 6px;
                    }

                    .shop-label-icon {
                        width: 17px;
                        height: 17px;
                        color: var(--blue);
                        display: flex;
                        align-items: center;
                        justify-content: center;
                    }

                    .shop-label-icon svg {
                        width: 15px;
                        height: 15px;
                        fill: none;
                        stroke: currentColor;
                        stroke-width: 1.8;
                        stroke-linecap: round;
                        stroke-linejoin: round;
                    }

                    .shop-input,
                    .shop-select {
                        width: 100%;
                        height: 46px;
                        border: 1px solid #e1e7ef;
                        border-radius: 11px;
                        background: #fbfcfe;
                        outline: none;
                        color: #172033;
                        font-family: inherit;
                        font-size: 11px;
                        transition: .2s ease;
                    }

                    .shop-input {
                        padding: 0 14px;
                    }

                    .shop-input::placeholder {
                        color: #b2bac7;
                    }

                    .shop-input:focus,
                    .shop-select:focus {
                        background: #fff;
                        border-color: var(--blue);
                        box-shadow: 0 0 0 4px rgba(23,105,255,.07);
                    }

                    .shop-input.valid {
                        border-color: var(--green);
                        background: #fbfffd;
                    }

                    .shop-input.error {
                        border-color: var(--danger);
                        background: #fffafa;
                    }

                    #shopMobile {
                        direction: ltr;
                        text-align: left;
                        letter-spacing: .3px;
                    }

                    .shop-input-hint {
                        font-size: 9px;
                        color: #8993a3;
                        margin-top: 5px;
                        min-height: 18px;
                    }

                    .shop-input-hint.valid {
                        color: var(--green);
                    }

                    .shop-input-hint.error {
                        color: var(--danger);
                    }

                    .shop-select-wrap {
                        position: relative;
                    }

                    .shop-select-wrap:after {
                        content: "⌄";
                        position: absolute;
                        left: 13px;
                        top: 50%;
                        transform: translateY(-55%);
                        color: #687386;
                        font-size: 15px;
                        pointer-events: none;
                    }

                    .shop-select {
                        appearance: none;
                        padding: 0 14px 0 38px;
                        cursor: pointer;
                    }

                    .checkout-price {
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        padding: 15px 0 0;
                        border-top: 1px solid var(--border);
                        margin-top: 4px;
                    }

                    .checkout-price span {
                        color: var(--muted);
                        font-size: 10px;
                    }

                    .checkout-price strong {
                        font-size: 30px;
                        direction: ltr;
                        line-height: 1;
                    }


                    .checkout-toman {
                        text-align: center;
                        margin-top: 18px;
                        padding-top: 16px;
                        border-top: 1px solid var(--border);
                    }

                    .checkout-toman-price {
                        font-size: 22px;
                        font-weight: 700;
                        color: var(--blue);
                        direction: rtl;
                    }

                    .checkout-rate-info {
                        margin-top: 7px;
                        font-size: 10px;
                        color: var(--muted);
                    }

                    .checkout-rate-update {
                        margin-top: 4px;
                        font-size: 9px;
                        color: #9aa3b1;
                    }

                    .full-btn {
                        width: 100%;
                        height: 46px;
                        margin-top: 16px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        gap: 8px;
                    }

                    .full-btn svg {
                        width: 16px;
                        height: 16px;
                        fill: none;
                        stroke: currentColor;
                        stroke-width: 2;
                        stroke-linecap: round;
                        stroke-linejoin: round;
                    }

                    .shop-note {
                        margin-top: 10px;
                        text-align: center;
                        color: #9aa3b1;
                        font-size: 8px;
                    }


                    /* ===================================
                       DISCLAIMER
                    =================================== */

                    .disclaimer {

                        background:
                            white;
                    }


                    .warning-box {

                        max-width: 950px;

                        margin: auto;

                        padding: 30px;

                        border-radius: 22px;

                        background:
                            #fffaf0;

                        border:
                            1px solid
                            #f6e4b7;
                        font-size:14px;
                    }


                    .warning-title {

                        display: flex;

                        align-items: center;

                        gap: 10px;

                        margin-bottom: 18px;
                    }


                    .warning-icon {

                        width: 40px;
                        height: 40px;

                        border-radius: 12px;

                        background:
                            #fff0c9;

                        display: flex;

                        align-items: center;

                        justify-content: center;
                    }


                    .warning-title h3 {

                        font-size: 16px;
                    }


                    .warning-box ul {

                        padding-right: 20px;
                    }


                    .warning-box li {

                        color:
                            #665d4b;

                        font-size: 11px;

                        margin-bottom: 7px;
                    }


                    /* ===================================
                       FOOTER
                    =================================== */

                    footer {

                        background:
                            #0b3d91;

                        color:
                            white;

                        padding:
                            65px 25px 25px;
                    }


                    .footer-grid {

                        max-width: 1180px;

                        margin: auto;

                        display: grid;

                        grid-template-columns:
                            1.5fr 1fr 1fr;

                        gap: 60px;
                    }


                    .footer-logo {

                        font-size: 21px;

                        font-weight: 800;

                        margin-bottom: 15px;
                    }


                    .footer-about {

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

                        font-size: 11px;

                        max-width: 400px;
                    }


                    .footer h4 {

                        font-size: 13px;

                        margin-bottom: 15px;
                    }


                    .footer-links a {

                        display: block;

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

                        font-size: 11px;

                        margin-bottom: 8px;

                        transition: .2s;
                    }


                    .footer-links a:hover {

                        color:
                            white;

                        transform:
                            translateX(-3px);
                    }


                    .copyright {

                        max-width: 1180px;

                        margin:
                            45px auto 0;

                        padding-top: 20px;

                        border-top:
                            1px solid
                            rgba(255,255,255,.12);

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

                        font-size: 10px;

                        text-align: center;
                    }


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

                    @media(max-width:900px) {

                        .hero-inner {

                            grid-template-columns:
                                1fr;

                            gap: 50px;
                        }


                        .hero-card {

                            max-width: 600px;

                            margin: auto;

                            width: 100%;
                        }


                        .feature-grid,
                        .steps-grid {

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


                        .country-grid {

                            grid-template-columns:
                                repeat(3,1fr);
                        }


                        .nav-links {

                            display: none;
                        }


                        .footer-grid {

                            grid-template-columns:
                                1fr 1fr;
                        }

                    }


                    @media(max-width:600px) {

                        .hero {

                            padding:
                                125px 18px
                                70px;
                        }


                        section {

                            padding:
                                70px 18px;
                        }


                        .hero h1 {

                            font-size: 38px;

                            letter-spacing:
                                -1px;
                        }


                        .hero-description {

                            font-size: 13px;
                        }


                        .price-card {

                            padding: 25px;

                            border-radius:
                                23px;
                        }


                        .price {

                            font-size: 50px;
                        }


                        .feature-grid,
                        .steps-grid {

                            grid-template-columns:
                                1fr;
                        }


                        .country-grid {

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


                        .shop-box {
                            padding:
                                24px 20px 25px;
                        }

                        .shop-header h2 {
                            font-size:
                                24px;
                        }

                        .shop-cart-icon {
                            width:
                                46px;
                            height:
                                46px;
                        }

                        .other-services {
    max-width: 1100px;
    margin: 0 auto;
}

.other-services h1 {
    text-align: center;
}

                        .shop-input,
                        .shop-select {
                            height:
                                44px;
                        }


                        .footer-grid {

                            grid-template-columns:
                                1fr;

                            gap: 35px;
                        }


                        .nav-button {

                            display: none;
                        }


                        .section-title h2 {

                            font-size: 28px;
                        }

                    }





                    /* =========================
           ORDER MODAL
        ========================= */

        .order-modal {
            position: fixed;
            inset: 0;
            z-index: 99999;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }

        .order-modal.show {
            display: flex;
        }

        .order-modal-overlay {
            position: absolute;
            inset: 0;
            background: rgba(15, 23, 42, 0.58);
            backdrop-filter: blur(7px);
            -webkit-backdrop-filter: blur(7px);
        }

        .order-modal-box {
            position: relative;
            z-index: 2;
            width: 100%;
            max-width: 470px;
            background: #ffffff;
            border-radius: 28px;
            padding: 30px;
            box-shadow:
                0 25px 80px rgba(0, 0, 0, 0.22),
                0 8px 30px rgba(0, 0, 0, 0.08);
            animation: orderModalIn .25s ease;
            direction: rtl;
            font-family: Tahoma, Arial, sans-serif;
        }

        @keyframes orderModalIn {

            from {
                opacity: 0;
                transform: translateY(20px) scale(.96);
            }

            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }


        /* Icon */

        .order-modal-icon {
            width: 58px;
            height: 58px;
            margin: 0 auto 15px;
            border-radius: 18px;
            background: #f1f5f9;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .order-modal-icon svg {
            width: 27px;
            height: 27px;
            fill: none;
            stroke: #334155;
            stroke-width: 1.8;
            stroke-linecap: round;
        }


        /* Title */

        .order-modal-box h2 {
            margin: 0;
            text-align: center;
            color: #0f172a;
            font-size: 21px;
            font-weight: 700;
        }

        .order-modal-subtitle {
            margin: 9px 0 25px;
            text-align: center;
            color: #64748b;
            font-size: 13px;
            line-height: 1.8;
        }


        /* Information */

        .order-info-list {
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            border-radius: 18px;
            overflow: hidden;
        }

        .order-info-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 14px 16px;
            border-bottom: 1px solid #e2e8f0;
            gap: 15px;
        }

        .order-info-item:last-child {
            border-bottom: 0;
        }

        .order-info-label {
            color: #64748b;
            font-size: 12px;
        }

        .order-info-item strong {
            color: #0f172a;
            font-size: 13px;
            font-weight: 700;
        }


        /* Price */

        .order-price-box {
            margin-top: 15px;
            padding: 18px;
            border-radius: 18px;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
        }

        .order-price-box > div:not(.order-price-divider) {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .order-price-box span {
            color: #64748b;
            font-size: 12px;
        }

        .order-price-box strong {
            color: #0f172a;
            font-size: 16px;
        }

        .order-price-box small {
            font-size: 11px;
            color: #64748b;
            font-weight: normal;
        }

        .order-price-divider {
            height: 1px;
            background: #e2e8f0;
            margin: 14px 0;
        }


        /* Buttons */

        .order-modal-actions {
            display: flex;
            gap: 10px;
            margin-top: 22px;
        }

        .order-btn {
            border: 0;
            height: 50px;
            border-radius: 15px;
            padding: 0 20px;
            font-family: inherit;
            font-size: 13px;
            font-weight: 700;
            cursor: pointer;
            transition: .2s ease;
        }

        .order-btn-primary {
            flex: 1;
            color: #ffffff;
            background: #111827;
        }

        .order-btn-primary:hover {
            background: #000000;
            transform: translateY(-1px);
        }

        .order-btn-secondary {
            background: #f1f5f9;
            color: #475569;
        }

        .order-btn-secondary:hover {
            background: #e2e8f0;
        }

        .order-btn-full {
            width: 100%;
            margin-top: 22px;
        }


        /* Loading */

        .order-btn.loading {
            pointer-events: none;
            opacity: .7;
        }

        .order-btn.loading::after {
            content: "";
            display: inline-block;
            width: 14px;
            height: 14px;
            margin-right: 8px;
            vertical-align: -2px;
            border: 2px solid rgba(255,255,255,.45);
            border-top-color: #fff;
            border-radius: 50%;
            animation: orderSpin .7s linear infinite;
        }

        @keyframes orderSpin {
            to {
                transform: rotate(360deg);
            }
        }


        /* Success */

        .order-success-icon {
            width: 76px;
            height: 76px;
            margin: 0 auto 20px;
            border-radius: 50%;
            background: #ecfdf5;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .order-success-icon svg {
            width: 39px;
            height: 39px;
            fill: none;
            stroke: #10b981;
            stroke-width: 2.2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .success-order-number {
            margin-top: 22px;
            padding: 17px;
            border-radius: 17px;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            text-align: center;
        }

        .success-order-number span,
        .success-total span {
            display: block;
            color: #64748b;
            font-size: 11px;
            margin-bottom: 8px;
        }

        .success-order-number strong {
            color: #111827;
            font-size: 18px;
            letter-spacing: .5px;
            direction: ltr;
            display: block;
        }

        .success-total {
            margin-top: 10px;
            padding: 17px;
            border-radius: 17px;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            text-align: center;
        }

        .success-total strong {
            color: #111827;
            font-size: 20px;
        }

        .success-total small {
            font-size: 11px;
            color: #64748b;
            font-weight: normal;
        }


        /* Mobile */

        @media (max-width: 520px) {

            .order-modal {
                padding: 12px;
            }

            .order-modal-box {
                padding: 23px 18px;
                border-radius: 23px;
            }

            .order-modal-actions {
                flex-direction: column-reverse;
            }

            .order-btn {
                width: 100%;
            }

        }

        /* حالت انتظار دکمه ادامه خرید */
#buyButton.aivn-processing {
    display: none !important;
}

#buyWaitingMessage {
    display: none;
    text-align: center;
    color: #1769ff;
    font-size: 15px;
    font-weight: 700;
    padding: 15px 0;
}

#buyWaitingMessage.show {
    display: block;
}

        /* ==========================================
   APPLE ID SERVICE
========================================== */

.apple-id-section {
    padding: 45px 25px;
    background: #f7f9fc;
}

.apple-id-card {
    max-width: 1180px;
    margin: auto;

    display: grid;
    grid-template-columns: 80px 1fr 170px;

    align-items: center;
    gap: 25px;

    padding: 28px 32px;

    background: #ffffff;

    border: 1px solid var(--border);

    border-radius: 24px;

    box-shadow:
        0 18px 50px rgba(20,50,100,.07);

    transition: .25s ease;
}

.apple-id-card:hover {
    transform: translateY(-3px);

    box-shadow:
        0 24px 60px rgba(20,50,100,.10);

    border-color: #d5e1f5;
}


/* ICON */

.apple-id-icon {
    width: 70px;
    height: 70px;

    border-radius: 20px;

    background: #111827;

    color: #ffffff;

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

    font-family: Arial, sans-serif;

    box-shadow:
        0 12px 25px rgba(17,24,39,.16);
}

.apple-id-icon span {
    font-size: 39px;

    line-height: 1;

    transform: translateY(-1px);
}


/* CONTENT */

.apple-id-badge {
    display: inline-flex;

    align-items: center;

    padding: 5px 10px;

    border-radius: 50px;

    background: var(--blue-light);

    color: var(--blue);

    font-size: 9px;

    font-weight: 700;

    margin-bottom: 7px;
}

.apple-id-content h2 {
    font-size: 21px;

    line-height: 1.5;

    margin-bottom: 5px;
}

.apple-id-description {
    color: var(--muted);

    font-size: 11px;

    line-height: 1.9;

    max-width: 650px;
}

.apple-id-description strong {
    color: #1d2735;

    font-weight: 700;
}


/* FEATURES */

.apple-id-features {
    display: flex;

    flex-wrap: wrap;

    gap: 7px 18px;

    margin-top: 13px;
}

.apple-id-features div {
    color: #566174;

    font-size: 10px;

    white-space: nowrap;
}

.apple-id-features span {
    color: var(--green);

    font-weight: 800;

    margin-left: 4px;
}


/* =========================
   CONTACT SECTION
========================= */

.contact-section {
    background: #f7f9fc;
    padding: 60px 20px;
    direction: rtl;
}

.contact-container {
    max-width: 1200px;
    margin: auto;

    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 40px;

    align-items: stretch;
}

.contact-info {
    background: #ffffff;
    border-radius: 24px;
    padding: 35px;

    box-shadow: 0 10px 35px rgba(0,0,0,0.06);
}

.contact-title {
    margin-bottom: 30px;
}

.contact-title span {
    color: #1976d2;
    font-size: 14px;
    font-weight: bold;
}

.contact-title h2 {
    margin: 8px 0 12px;
    font-size: 28px;
    color: #172033;
}

.contact-title p {
    margin: 0;
    line-height: 2;
    color: #687386;
    font-size: 14px;
}


.contact-item {
    display: flex;
    align-items: center;
    gap: 15px;

    padding: 18px 0;
    border-bottom: 1px solid #edf0f5;
}

.contact-item:last-child {
    border-bottom: none;
}


.contact-icon {
    width: 48px;
    height: 48px;

    flex-shrink: 0;

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

    background: #eef6ff;
    border-radius: 14px;

    font-size: 21px;
}


.contact-item small {
    display: block;
    color: #8993a5;
    font-size: 12px;
    margin-bottom: 5px;
}

.contact-item a {
    color: #1976d2;
    text-decoration: none;
    font-weight: bold;
    direction: ltr;
    display: inline-block;
}

.contact-item p {
    margin: 0;
    color: #333d4d;
    line-height: 1.8;
    font-size: 14px;
}


/* MAP */

.contact-map {
    min-height: 430px;

    overflow: hidden;
    border-radius: 24px;

    box-shadow: 0 10px 35px rgba(0,0,0,0.08);

    background: #e9eef5;
}

.contact-map iframe {
    width: 100%;
    height: 100%;
    min-height: 430px;

    border: 0;
    display: block;
}


/* MOBILE */

@media (max-width: 768px) {

    .contact-section {
        padding: 40px 15px;
    }

    .contact-container {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .contact-info {
        padding: 25px;
    }

    .contact-title h2 {
        font-size: 23px;
    }

    .contact-map,
    .contact-map iframe {
        min-height: 300px;
    }

}


/* PRICE */

.apple-id-price {
    text-align: center;

    padding-right: 20px;

    border-right: 1px solid var(--border);
}

.apple-id-price > span {
    display: block;

    color: var(--muted);

    font-size: 9px;

    margin-bottom: 2px;
}

.apple-id-price strong {
    display: block;

    font-size: 30px;

    line-height: 1.2;

    direction: ltr;
}

.apple-id-price small {
    display: block;

    color: #9aa3b1;

    font-size: 8px;

    margin-top: 2px;
}


/* BUTTON */

.apple-id-button {
    width: 100%;

    height: 42px;

    margin-top: 12px;

    border: 0;

    border-radius: 11px;

    background: var(--blue);

    color: #ffffff;

    font-family: inherit;

    font-size: 10px;

    font-weight: 700;

    cursor: pointer;

    transition: .2s ease;
}


.other-services {
    width: 100%;
    text-align: center !important;
    margin: 0 auto 40px auto !important;
}

.apple-id-button span {
    margin-right: 5px;

    font-size: 13px;
}

.apple-id-button:hover {
    background: var(--blue-dark);

    transform: translateY(-2px);

    box-shadow:
        0 10px 22px rgba(23,105,255,.20);
}


/* MOBILE */

@media(max-width:900px) {

    .apple-id-card {
        grid-template-columns: 65px 1fr;

        padding: 24px;

    }

    .apple-id-icon {
        width: 60px;
        height: 60px;
    }

    .apple-id-icon span {
        font-size: 34px;
    }

    .apple-id-price {
        grid-column: 1 / -1;

        border-right: 0;

        border-top: 1px solid var(--border);

        padding-right: 0;

        padding-top: 20px;

        display: grid;

        grid-template-columns: auto auto;

        align-items: center;

        gap: 5px 15px;
    }

    .apple-id-price > span,
    .apple-id-price small {
        display: none;
    }

    .apple-id-price strong {
        text-align: right;
    }

    .apple-id-button {
        margin-top: 0;
    }
}


@media(max-width:600px) {

    .apple-id-section {
        padding: 30px 18px;
    }

    .apple-id-card {
        grid-template-columns: 1fr;

        text-align: center;

        padding: 24px 20px;

        border-radius: 21px;
    }

    .apple-id-icon {
        margin: 0 auto;
    }

    .apple-id-features {
        justify-content: center;

        flex-direction: column;

        align-items: center;

        gap: 7px;
    }

    .apple-id-price {
        display: block;

        width: 100%;

        text-align: center;
    }

    .apple-id-price strong {
        text-align: center;

        margin-bottom: 8px;
    }

    .apple-id-button {
        width: 100%;

        margin-top: 10px;
    }
}

                    /* ==========================================
   CUSTOM COUNTRY DROPDOWN
========================================== */

.country-hidden-select {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    opacity: 0 !important;

    pointer-events: none !important;
}


.country-dropdown {
    position: relative;

    width: 100%;
}


.country-dropdown-button {
    width: 100%;
    height: 52px;

    border: 1px solid var(--border);

    border-radius: 13px;

    background: #fff;

    padding: 0 15px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    direction: rtl;

    font-family: inherit;

    font-size: 12px;

    color: var(--text);

    cursor: pointer;

    transition: .2s ease;
}


.country-dropdown-button:hover,
.country-dropdown.open .country-dropdown-button {
    border-color: var(--blue);

    box-shadow:
        0 0 0 3px rgba(23,105,255,.08);
}


.selected-country {
    display: flex;

    align-items: center;

    gap: 10px;
}


.selected-country img {
    width: 28px;

    height: 20px;

    object-fit: cover;

    border-radius: 4px;

    display: block;

    box-shadow:
        0 1px 4px rgba(0,0,0,.12);
}


.country-arrow {
    display: flex;

    align-items: center;

    justify-content: center;

    transition: .2s ease;
}


.country-arrow svg {
    width: 17px;

    height: 17px;

    fill: none;

    stroke: #7a8494;

    stroke-width: 2;

    stroke-linecap: round;

    stroke-linejoin: round;
}


.country-dropdown.open .country-arrow {
    transform: rotate(180deg);
}


/* MENU */

.country-dropdown-menu {
    position: absolute;

    top: calc(100% + 7px);

    right: 0;

    left: 0;

    z-index: 9999;

    background: #ffffff;

    border: 1px solid var(--border);

    border-radius: 14px;

    padding: 6px;

    box-shadow:
        0 18px 45px rgba(20,35,60,.14);

    opacity: 0;

    visibility: hidden;

    transform: translateY(-6px);

    transition: .18s ease;
}


.country-dropdown.open .country-dropdown-menu {
    opacity: 1;

    visibility: visible;

    transform: translateY(0);
}


/* OPTIONS */

.country-option {
    min-height: 46px;

    padding: 7px 10px;

    border-radius: 9px;

    display: flex;

    align-items: center;

    gap: 10px;

    direction: rtl;

    cursor: pointer;

    transition: .15s ease;
}


.country-option:hover {
    background: var(--blue-light);
}


.country-option.active {
    background: var(--blue-light);

    color: var(--blue);

    font-weight: 700;
}


.country-option img {
    width: 30px;

    height: 21px;

    object-fit: cover;

    border-radius: 4px;

    display: block;

    flex-shrink: 0;

    box-shadow:
        0 1px 4px rgba(0,0,0,.12);
}


.country-option span {
    flex: 1;

    text-align: right;

    font-size: 12px;
}



#contact-map {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
}




.country-option small {
    font-size: 9px;

    color: #9aa3b1;

    direction: ltr;
}


.country-option.active small {
    color: var(--blue);
}

                

/* ==========================================================
   AIVN SHOWCASE SLIDESHOW - ADDED ONLY
   ========================================================== */
.aivn-showcase-wrap{
    width:100%;
    max-width:1450px;
    margin:35px auto 65px;
    padding:0 22px;
    box-sizing:border-box;
    direction:rtl;
}
.aivn-showcase-slider{
    position:relative;
    width:100%;
    border-radius:28px;
    overflow:hidden;
    background:#eef5ff;
    box-shadow:0 18px 50px rgba(20,70,130,.10);
}
.aivn-showcase-slide{
    display:none;
    width:100%;
    line-height:0;
}
.aivn-showcase-slide.active{
    display:block;
    animation:aivnShowcaseFade .45s ease;
}
.aivn-showcase-slide img{
    display:block;
    width:100%;
    height:auto;
    max-height:720px;
    object-fit:contain;
    margin:0 auto;
    user-select:none;
    -webkit-user-drag:none;
}
@keyframes aivnShowcaseFade{
    from{opacity:.45}to{opacity:1}
}
.aivn-showcase-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:20;
    width:58px;
    height:58px;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.96);
    color:#1769ff;
    box-shadow:0 7px 25px rgba(0,0,0,.10);
    font-size:38px;
    line-height:54px;
    cursor:pointer;
    padding:0;
    transition:.2s ease;
}
.aivn-showcase-arrow:hover{transform:translateY(-50%) scale(1.06)}
.aivn-showcase-prev{left:22px}
.aivn-showcase-next{right:22px}
.aivn-showcase-dots{
    position:absolute;
    left:50%;
    bottom:18px;
    transform:translateX(-50%);
    z-index:25;
    display:flex;
    align-items:center;
    gap:8px;
    direction:ltr;
}
.aivn-showcase-dot{
    width:14px;
    height:14px;
    padding:0;
    border:0;
    border-radius:4px;
    background:#bfd2ec;
    cursor:pointer;
    transition:.25s ease;
}
.aivn-showcase-dot.active{
    width:30px;
    background:#1769ff;
    box-shadow:0 3px 10px rgba(23,105,255,.28);
}
.aivn-showcase-features{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    direction:rtl;
    margin-top:35px;
}
.aivn-showcase-feature{
    min-height:185px;
    padding:8px 30px 18px;
    box-sizing:border-box;
    text-align:center;
    border-left:1px solid #e4eaf2;
}
.aivn-showcase-feature:last-child{border-left:none}
.aivn-showcase-feature-icon{
    width:70px;
    height:70px;
    margin:0 auto 13px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.aivn-showcase-feature-icon svg{width:39px;height:39px;display:block}
.aivn-showcase-feature:nth-child(1) .aivn-showcase-feature-icon{background:#fff2df}
.aivn-showcase-feature:nth-child(2) .aivn-showcase-feature-icon{background:#eee7ff}
.aivn-showcase-feature:nth-child(3) .aivn-showcase-feature-icon{background:#e6f0ff}
.aivn-showcase-feature:nth-child(4) .aivn-showcase-feature-icon{background:#e2f8f1}
.aivn-showcase-feature h3{
    margin:0 0 8px;
    color:#101a35;
    font-size:18px;
    line-height:1.8;
    font-weight:800;
}
.aivn-showcase-feature p{
    margin:0;
    color:#68758b;
    font-size:13px;
    line-height:2;
}
.aivn-showcase-cta{
    display:flex;
    justify-content:center;
    margin-top:12px;
}
.aivn-showcase-cta a{
    min-width:300px;
    height:58px;
    padding:0 32px;
    box-sizing:border-box;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    border-radius:30px;
    background:#1769ff;
    color:#fff;
    text-decoration:none;
    font-size:17px;
    font-weight:700;
    box-shadow:0 12px 30px rgba(23,105,255,.20);
}
@media(max-width:900px){
    .aivn-showcase-features{grid-template-columns:repeat(2,1fr);row-gap:18px}
    .aivn-showcase-feature{border-left:none}
}
@media(max-width:600px){
    .aivn-showcase-wrap{padding:0 10px;margin:22px auto 45px}
    .aivn-showcase-slider{border-radius:18px}
    .aivn-showcase-arrow{width:42px;height:42px;font-size:28px;line-height:39px}
    .aivn-showcase-prev{left:9px}.aivn-showcase-next{right:9px}
    .aivn-showcase-dots{bottom:10px;gap:6px}
    .aivn-showcase-dot{width:9px;height:9px;border-radius:3px}
    .aivn-showcase-dot.active{width:20px}
    .aivn-showcase-features{grid-template-columns:1fr}
    .aivn-showcase-feature{min-height:auto;padding:8px 22px 25px}
    .aivn-showcase-cta a{width:100%;min-width:0}
}

                    /* ==========================================
   عنوان بالای اسلایدشو
========================================== */

.aivn-showcase-title {
    width: 100%;
    text-align: center;
    direction: rtl;
    margin: 0 auto 25px;
    padding: 0 15px;
    box-sizing: border-box;
}

.aivn-showcase-title-badge {
    display: inline-block;
    margin-bottom: 8px;
    padding: 6px 16px;
    border-radius: 20px;

    background: #eef5ff;
    color: #1769ff;

    font-size: 13px;
    font-weight: 700;
}

.aivn-showcase-title h2 {
    margin: 0 0 8px;

    color: #101a35;

    font-size: 27px;
    line-height: 1.7;
    font-weight: 800;
}

.aivn-showcase-title p {
    margin: 0 auto;

    max-width: 700px;

    color: #718096;

    font-size: 14px;
    line-height: 2;

    font-weight: 400;
}

@media (max-width: 768px) {

    .aivn-showcase-title {
        margin-bottom: 18px;
    }

    .aivn-showcase-title h2 {
        font-size: 21px;
    }

    .aivn-showcase-title p {
        font-size: 13px;
    }

}


.feature-icon svg {
    width: 36px;
    height: 36px;
    display: block;
}

.feature-icon {
    color: #1769ff;
}

/* =========================================================
   ACCOUNT TYPE - MODERN CARDS
   ========================================================= */

.account-type-section {
    width: 100%;
    margin-top: 8px;
    margin-bottom: 22px;
    direction: rtl;
}

.account-type-title {
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: 700;
    color: #172033;
}

.account-type-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    width: 100%;
}


/* ---------------------------------------------------------
   CARD
   --------------------------------------------------------- */

.account-type-card {
    position: relative;

    min-height: 150px;

    padding: 22px 20px 20px;

    box-sizing: border-box;

    border: 1.5px solid #e1e8f2;
    border-radius: 16px;

    background: #ffffff;

    cursor: pointer;

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

    text-align: center;

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


/* ---------------------------------------------------------
   مخفی کردن Radio اصلی
   --------------------------------------------------------- */

.account-type-card input[type="radio"] {
    position: absolute;

    opacity: 0;

    width: 1px;
    height: 1px;

    pointer-events: none;
}


/* ---------------------------------------------------------
   Radio سفارشی
   --------------------------------------------------------- */

.account-radio {
    position: absolute;

    top: 16px;
    right: 16px;

    width: 19px;
    height: 19px;

    border: 2px solid #cbd5e1;

    border-radius: 50%;

    box-sizing: border-box;

    background: #fff;

    transition: .2s ease;
}


/* نقطه داخل Radio */

.account-radio::after {
    content: "";

    position: absolute;

    top: 50%;
    left: 50%;

    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #fff;

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

    transition: .2s ease;
}


/* ---------------------------------------------------------
   کارت انتخاب‌شده
   --------------------------------------------------------- */

.account-type-card:has(input[type="radio"]:checked) {

    border-color: #1769ff;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f3f7ff 100%
    );

    box-shadow:
        0 8px 25px rgba(23, 105, 255, .10);
}


/* Radio انتخاب‌شده */

.account-type-card:has(input[type="radio"]:checked)
.account-radio {

    border-color: #1769ff;

    background: #1769ff;

}


/* نقطه وسط */

.account-type-card:has(input[type="radio"]:checked)
.account-radio::after {

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

}


/* ---------------------------------------------------------
   آیکون
   --------------------------------------------------------- */

.account-card-icon {

    width: 58px;
    height: 58px;

    margin-bottom: 13px;

    border-radius: 50%;

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

    color: #1769ff;

    background: #eef4ff;

    transition: .22s ease;
}


.account-card-icon svg {

    width: 32px;
    height: 32px;

    display: block;
}


/* وقتی کارت انتخاب شد */

.account-type-card:has(input[type="radio"]:checked)
.account-card-icon {

    color: #1769ff;

    background: #e5efff;

    box-shadow:
        0 5px 15px rgba(23, 105, 255, .08);
}


/* ---------------------------------------------------------
   عنوان
   --------------------------------------------------------- */

.account-card-content {

    display: flex;

    flex-direction: column;

    align-items: center;

    width: 100%;
}


.account-card-content strong {

    display: block;

    margin-bottom: 7px;

    color: #111827;

    font-size: 16px;

    line-height: 1.8;

    font-weight: 800;
}


/* ---------------------------------------------------------
   توضیحات
   --------------------------------------------------------- */

.account-card-content small {

    display: block;

    max-width: 260px;

    color: #7b8799;

    font-size: 12px;

    line-height: 1.9;

    font-weight: 400;
}


/* ---------------------------------------------------------
   Hover
   --------------------------------------------------------- */

.account-type-card:hover {

    border-color: #a9c6ff;

    transform: translateY(-2px);

    box-shadow:
        0 8px 24px rgba(30, 70, 130, .08);
}


/* ---------------------------------------------------------
   موبایل
   --------------------------------------------------------- */

@media (max-width: 650px) {

    .account-type-cards {

        grid-template-columns: 1fr;

        gap: 12px;

    }

    .account-type-card {

        min-height: 135px;

    }

}


/* =========================================================
   SERVICE TYPE - 3 RADIO OPTIONS
   فقط برای طراحی انتخاب نوع خدمت
   ========================================================= */
.service-type-section {
    margin: 0 0 22px 0;
    direction: rtl;
}

.service-type-title {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 700;
    color: #172033;
}

.service-type-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.service-type-option {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 7px 12px;
    box-sizing: border-box;
    border: 1px solid #e5ebf4;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}

.service-type-option:hover {
    border-color: #b9d0ff;
    background: #fbfdff;
    transform: translateY(-1px);
}

.service-type-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.service-type-radio {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    border: 2px solid #cbd5e1;
    border-radius: 50%;
    box-sizing: border-box;
    background: #fff;
    position: relative;
    transition: .2s ease;
}

.service-type-radio::after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: .2s ease;
}

.service-type-option:has(input[type="radio"]:checked) {
    border-color: #1769ff;
    background: linear-gradient(90deg, #ffffff 0%, #f5f8ff 100%);
    box-shadow: 0 5px 16px rgba(23,105,255,.08);
}

.service-type-option:has(input[type="radio"]:checked) .service-type-radio {
    border-color: #1769ff;
    background: #1769ff;
}

.service-type-option:has(input[type="radio"]:checked) .service-type-radio::after {
    transform: translate(-50%, -50%) scale(1);
}

.service-type-icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1769ff;
    background: #eef4ff;
}

.service-type-icon svg {
    width: 17px;
    height: 17px;
    display: block;
}

.service-type-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.5;
}

.service-type-text strong {
    font-size: 13px;
    font-weight: 800;
    color: #172033;
}

.service-type-text small {
    margin-top: 1px;
    font-size: 10px;
    color: #8792a5;
}

/* ============================================================
       AIVN - Navigation مشترک
       ============================================================ */

    .navbar {
                        position: fixed;
                        top: 0;
                        right: 0;
                        left: 0;

                        height: 76px;

                        z-index: 1000;

                        transition: .3s;
                    }

                    .navbar.scrolled {
                        background: rgba(255,255,255,.88);

                        backdrop-filter: blur(18px);

                        box-shadow: 0 8px 35px rgba(0,0,0,.06);
                    }

                    .nav-inner {
                        max-width: 1180px;

                        height: 100%;

                        margin: auto;

                        padding: 0 25px;

                        display: flex;

                        align-items: center;

                        justify-content: space-between;
                    }


                    /* LOGO */

                    .logo {
                        display: flex;

                        align-items: center;

                        gap: 10px;

                        font-size: 19px;

                        font-weight: 800;
                    }

                    .logo-icon {
                        width: 42px;
                        height: 42px;

                        border-radius: 13px;

                        background: var(--blue);

                        color: white;

                        display: flex;

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

                        font-size: 22px;

                        box-shadow:
                            0 10px 25px rgba(23,105,255,.25);
                    }


                    /* MENU */

                    .nav-links {
                        display: flex;

                        align-items: center;

                        gap: 30px;

                        color: #687386;

                        font-size: 13px;
                    }

                    .nav-links a {
                        transition: .2s;
                    }

                    .nav-links a:hover {
                        color: var(--blue);
                    }


                    .nav-button {
                        background: #111827;

                        color: white;

                        padding: 10px 19px;

                        border-radius: 12px;

                        font-size: 12px;

                        transition: .25s;
                    }

                    .nav-button:hover {
                        transform: translateY(-2px);
                    }

    /* ==========================================
   NAVBAR - MENU / HAMBURGER
========================================== */

.nav-inner {
    direction: rtl;
}

.navbar .logo {
    flex: 0 0 auto;
}

.navbar .nav-links {
    flex: 1 1 auto;
    justify-content: flex-start;
    margin-right: 28px;
}

.aivn-header-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    direction: ltr;
    flex: 0 0 auto;
}

.aivn-menu-button {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 13px;
    background: #111827;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 10px 25px rgba(17,24,39,.14);
    transition: .2s ease;
    font-family: inherit;
}

.aivn-menu-button:hover {
    transform: translateY(-1px);
}

.aivn-menu-button span,
.aivn-menu-button span::before,
.aivn-menu-button span::after {
    display: block;
    width: 19px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
}

.aivn-menu-button span {
    position: relative;
}

.aivn-menu-button span::before,
.aivn-menu-button span::after {
    content: "";
    position: absolute;
    right: 0;
}

.aivn-menu-button span::before {
    top: -6px;
}

.aivn-menu-button span::after {
    top: 6px;
}

.aivn-menu-overlay {
    position: fixed;
    inset: 0;
    z-index: 1998;
    background: rgba(15,23,42,.34);
    opacity: 0;
    visibility: hidden;
    transition: .22s ease;
}

.aivn-menu-drawer {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1999;
    width: min(340px, 88vw);
    padding: 24px 20px;
    background: #fff;
    box-shadow: 15px 0 45px rgba(15,23,42,.15);
    transform: translateX(-105%);
    transition: transform .28s ease;
    overflow-y: auto;
    direction: rtl;
}

.aivn-menu-open .aivn-menu-overlay {
    opacity: 1;
    visibility: visible;
}

.aivn-menu-open .aivn-menu-drawer {
    transform: translateX(0);
}

.aivn-menu-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 18px;
    margin-bottom: 8px;
    border-bottom: 1px solid #edf0f5;
}

.aivn-menu-title {
    font-size: 17px;
    font-weight: 800;
    color: #111827;
}

.aivn-menu-close {
    width: 38px;
    height: 38px;
    border: 1px solid #e6eaf0;
    border-radius: 11px;
    background: #f8fafc;
    color: #334155;
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
}

.aivn-menu-list {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-top: 12px;
}

.aivn-menu-link,
.aivn-menu-logout {
    width: 100%;
    min-height: 48px;
    padding: 10px 13px;
    border: 1px solid #e7ebf2;
    border-radius: 12px;
    background: #fff;
    color: #263244;
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-align: right;
    transition: .18s ease;
}

.aivn-menu-link:hover,
.aivn-menu-logout:hover {
    border-color: #cbdcff;
    background: #f7faff;
    color: #1769ff;
}

.aivn-menu-icon {
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef4ff;
    color: #1769ff;
    font-size: 15px;
}

.aivn-menu-separator {
    height: 1px;
    background: #edf0f5;
    margin: 12px 0 5px;
}

.aivn-menu-logout {
    display: flex;
    color: #d52f2f;
    background: #fff8f8;
    border-color: #f1d2d2;
}

.aivn-menu-logout:hover {
    color: #bd2020;
    background: #fff1f1;
    border-color: #e9b5b5;
}

.aivn-header-buttons .aivn-logout-button {
    display: none !important;
}

@media (max-width: 768px) {

    .navbar {
        height: 68px;
    }

    .nav-inner {
        padding: 0 14px;
    }

    .navbar .logo {
        font-size: 17px;
        gap: 8px;
    }

    .navbar .logo-icon {
        width: 39px;
        height: 39px;
        border-radius: 12px;
        font-size: 20px;
    }

    .navbar .nav-links {
        display: none;
    }

    .aivn-menu-button {
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }

}

.aivn-register-overlay{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(10,20,40,.55);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.aivn-register-overlay.is-open{display:flex}
.aivn-register-modal{position:relative;width:min(440px,100%);max-height:calc(100vh - 40px);overflow-y:auto;background:#fff;border:1px solid #e7edf7;border-radius:24px;padding:30px;box-shadow:0 25px 70px rgba(18,53,100,.22);direction:rtl;text-align:right;font-family:inherit}
.aivn-register-close{position:absolute;top:12px;left:14px;width:36px;height:36px;border:0;border-radius:50%;background:#f3f6fb;color:#65748b;font-size:25px;cursor:pointer}
.aivn-register-icon{width:58px;height:58px;margin:0 auto 14px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:#1769ff;color:#fff;font-size:34px;box-shadow:0 10px 25px rgba(23,105,255,.25)}
.aivn-register-head{text-align:center;margin-bottom:22px}.aivn-register-head h3{margin:0 0 8px;font-size:25px;color:#142238}.aivn-register-head p{margin:0;color:#7a8798;font-size:13px;line-height:1.9}
.aivn-register-group{margin-bottom:15px}.aivn-register-group label{display:block;margin-bottom:7px;color:#26364c;font-size:13px;font-weight:700}
.aivn-register-input{width:100%;height:48px;box-sizing:border-box;border:1px solid #dce4ef;border-radius:12px;padding:0 14px;outline:none;background:#fbfcfe;color:#17243a;font-family:inherit;font-size:14px}
.aivn-register-input:focus{border-color:#1769ff;background:#fff;box-shadow:0 0 0 4px rgba(23,105,255,.09)}
.aivn-register-group small{display:block;margin-top:6px;color:#8995a6;font-size:11px}
.aivn-register-message{margin:8px 0 14px;padding:11px 13px;border-radius:11px;font-size:13px;line-height:1.8}
.aivn-register-message.success{background:#ecfdf3;color:#087443;border:1px solid #b9efd1}
.aivn-register-message.error{background:#fff1f2;color:#b42318;border:1px solid #ffd0d5}
.aivn-register-submit{width:100%;height:50px;border:0;border-radius:13px;background:#1769ff;color:#fff;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 10px 24px rgba(23,105,255,.22)}
.aivn-register-submit:disabled{opacity:.65;cursor:wait}body.aivn-register-open{overflow:hidden}
@media(max-width:480px){.aivn-register-overlay{padding:12px}.aivn-register-modal{padding:24px 18px;border-radius:20px}.aivn-register-head h3{font-size:22px}}

/* AIVN - Hero secondary action */
.hero-buttons .btn-secondary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    color:#172238;
    box-sizing:border-box;
}
.hero-buttons .btn-secondary:hover{color:#172238}
#aivnShowcase{scroll-margin-top:90px}
