/* ===== VARIABLES ===== */
            :root {
                --primary: #0891B2;
                --primary-dark: #0284C7;
                --primary-light: #38BDF8;
                --secondary: #F59E0B;
                --success: #10B981;
                --danger: #EF4444;
                --gray-50: #F8FAFC;
                --gray-100: #F1F5F9;
                --gray-200: #E2E8F0;
                --gray-300: #CBD5E1;
                --gray-600: #64748B;
                --gray-700: #334155;
                --gray-800: #1E293B;
                --gray-900: #0F172A;
                --white: #FFFFFF;
                --shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
                --shadow-hover: 0 20px 60px rgba(14, 165, 233, 0.15);
                --radius: 20px;
                --radius-sm: 12px;
                --transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            }

            /* ===== RESET & BASE ===== */
            .doktoryar-doctor-page {
                font-family: 'Vazir', 'Segoe UI', system-ui, -apple-system, sans-serif;
                background: var(--gray-50);
                overflow-x: hidden;
                direction: rtl;
                padding-top: -80px;
                margin-top: -80px;
            }

            .doktoryar-doctor-page * {
                box-sizing: border-box;
                margin: 0;
                padding: 0;
            }

            .container {
                max-width: 1200px;
                margin: 0 auto;
                padding: 0 20px;
            }

            /* ===== SECTION HEADER ===== */
            .section-badge {
                display: inline-block;
                background: rgba(14, 165, 233, 0.1);
                color: var(--primary);
                padding: 6px 20px;
                border-radius: 50px;
                font-size: 14px;
                font-weight: 600;
                letter-spacing: 0.5px;
                margin-bottom: 16px;
            }

            .section-badge i {
                margin-left: 8px;
            }

            .section-title {
                font-size: clamp(32px, 4.5vw, 48px);
                font-weight: 800;
                color: var(--gray-900);
                line-height: 1.2;
                margin-bottom: 16px;
            }

            .section-title span {
                color: var(--primary);
                position: relative;
            }

            .section-title span::after {
                content: '';
                position: absolute;
                bottom: 2px;
                left: 0;
                width: 100%;
                height: 8px;
                background: rgba(14, 165, 233, 0.15);
                border-radius: 4px;
                z-index: -1;
            }

            .section-desc {
                font-size: 18px;
                color: var(--gray-600);
                line-height: 1.8;
                max-width: 700px;
                margin: 0 auto 40px;
            }

            /* ===== HERO SECTION ===== */
            .hero-section {
                background: linear-gradient(135deg, #F0F9FF 0%, #E0F2FE 50%, #BAE6FD 100%);
                padding: 80px 0 100px;
                position: relative;
                overflow: hidden;
            }

            .hero-section::before {
                content: '';
                position: absolute;
                top: -50%;
                right: -20%;
                width: 600px;
                height: 600px;
                background: radial-gradient(circle, rgba(14, 165, 233, 0.06) 0%, transparent 70%);
                border-radius: 50%;
            }

            .hero-section::after {
                content: '🏥';
                position: absolute;
                bottom: 10%;
                left: 5%;
                font-size: 120px;
                opacity: 0.06;
                transform: rotate(-15deg);
            }

            .hero-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 60px;
                align-items: center;
                position: relative;
                z-index: 2;
            }

            .hero-content h1 {
                font-size: clamp(36px, 5vw, 56px);
                font-weight: 900;
                color: var(--gray-900);
                line-height: 1.15;
                margin-bottom: 20px;
            }

            .hero-content h1 .highlight {
                background: linear-gradient(135deg, var(--primary), var(--primary-light));
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                background-clip: text;
            }

            .hero-content p {
                font-size: 18px;
                color: var(--gray-700);
                line-height: 1.9;
                margin-bottom: 32px;
                max-width: 540px;
            }

            .hero-content .quote {
                background: rgba(255, 255, 255, 0.6);
                padding: 20px 24px;
                border-radius: var(--radius-sm);
                border-right: 4px solid var(--primary);
                margin-bottom: 32px;
                font-size: 16px;
                color: var(--gray-700);
                line-height: 1.8;
            }

            .hero-content .quote i {
                color: var(--primary);
                font-size: 20px;
                margin-left: 8px;
            }

            .hero-buttons {
                display: flex;
                gap: 16px;
                flex-wrap: wrap;
            }

            .btn-primary {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                padding: 16px 40px;
                background: var(--primary);
                color: var(--white);
                border: none;
                border-radius: 50px;
                font-size: 16px;
                font-weight: 700;
                cursor: pointer;
                transition: var(--transition);
                text-decoration: none;
                box-shadow: 0 8px 30px rgba(14, 165, 233, 0.3);
            }

            .btn-primary:hover {
                background: var(--primary-dark);
                transform: translateY(-3px);
                box-shadow: 0 12px 40px rgba(14, 165, 233, 0.4);
                color: var(--white);
            }

            .btn-primary i {
                margin-left: 8px;
            }

            .btn-secondary {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                padding: 16px 40px;
                background: var(--white);
                color: var(--gray-900);
                border: 2px solid var(--gray-200);
                border-radius: 50px;
                font-size: 16px;
                font-weight: 700;
                cursor: pointer;
                transition: var(--transition);
                text-decoration: none;
            }

            .btn-secondary:hover {
                border-color: var(--primary);
                color: var(--primary);
                transform: translateY(-3px);
                box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
            }

            .btn-secondary i {
                margin-left: 8px;
            }

            .hero-stats {
                display: flex;
                gap: 40px;
                margin-top: 40px;
                padding-top: 32px;
                border-top: 2px solid rgba(14, 165, 233, 0.15);
            }

            .hero-stat {
                text-align: center;
            }

            .hero-stat .number {
                font-size: 28px;
                font-weight: 800;
                color: var(--primary);
                display: block;
            }

            .hero-stat .label {
                font-size: 14px;
                color: var(--gray-600);
                margin-top: 4px;
            }

            .hero-stat .label i {
                margin-left: 4px;
            }

            .hero-visual {
                display: flex;
                justify-content: center;
                align-items: center;
                position: relative;
            }

            .hero-visual .floating-card {
                background: var(--white);
                padding: 30px;
                border-radius: var(--radius);
                box-shadow: var(--shadow);
                width: 100%;
                max-width: 420px;
            }

            .floating-card .card-icon {
                font-size: 48px;
                margin-bottom: 16px;
                display: block;
                color: var(--primary);
            }

            .floating-card .card-icon i {
                font-size: 48px;
            }

            .floating-card h3 {
                font-size: 20px;
                font-weight: 700;
                color: var(--gray-900);
                margin-bottom: 8px;
            }

            .floating-card p {
                color: var(--gray-600);
                font-size: 14px;
                line-height: 1.7;
            }

            .floating-card .step-line {
                display: flex;
                align-items: center;
                gap: 12px;
                margin-top: 16px;
                padding: 12px 16px;
                background: var(--gray-50);
                border-radius: var(--radius-sm);
            }

            .step-line .step-num {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 32px;
                height: 32px;
                background: var(--primary);
                color: var(--white);
                border-radius: 50%;
                font-size: 14px;
                font-weight: 700;
                flex-shrink: 0;
            }

            .step-line .step-num i {
                font-size: 14px;
            }

            .step-line .step-text {
                font-size: 14px;
                color: var(--gray-700);
                font-weight: 500;
            }

            /* ===== FEATURES SECTION ===== */
            .features-section {
                padding: 80px 0;
                background: var(--white);
            }

            .features-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
                gap: 30px;
                margin-top: 20px;
            }

            .feature-card {
                background: var(--gray-50);
                padding: 36px 28px;
                border-radius: var(--radius);
                transition: var(--transition);
                border: 2px solid transparent;
                position: relative;
                overflow: hidden;
            }

            .feature-card::before {
                content: '';
                position: absolute;
                top: 0;
                right: 0;
                width: 4px;
                height: 100%;
                background: var(--primary);
                opacity: 0;
                transition: var(--transition);
            }

            .feature-card:hover {
                transform: translateY(-6px);
                border-color: var(--primary);
                box-shadow: var(--shadow-hover);
                background: var(--white);
            }

            .feature-card:hover::before {
                opacity: 1;
            }

            .feature-card .icon {
                font-size: 40px;
                margin-bottom: 16px;
                display: block;
                color: var(--primary);
            }

            .feature-card .icon i {
                font-size: 40px;
            }

            .feature-card h3 {
                font-size: 18px;
                font-weight: 700;
                color: var(--gray-900);
                margin-bottom: 10px;
            }

            .feature-card p {
                font-size: 15px;
                color: var(--gray-600);
                line-height: 1.8;
            }

            .feature-card .badge {
                display: inline-block;
                background: rgba(16, 185, 129, 0.12);
                color: var(--success);
                padding: 2px 12px;
                border-radius: 50px;
                font-size: 11px;
                font-weight: 700;
                margin-top: 12px;
            }

            .feature-card .badge i {
                margin-left: 4px;
                font-size: 12px;
            }

            /* ===== WHY SECTION ===== */
            .why-section {
                padding: 80px 0;
                background: linear-gradient(135deg, #0C4A6E 0%, #0284C7 50%, #0EA5E9 100%);
                color: var(--white);
            }

            .why-section .section-title {
                color: var(--white);
            }

            .why-section .section-title span {
                color: var(--secondary);
            }

            .why-section .section-title span::after {
                background: rgba(245, 158, 11, 0.25);
            }

            .why-section .section-desc {
                color: rgba(255, 255, 255, 0.75);
            }

            .why-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
                gap: 30px;
            }

            .why-card {
                background: rgba(255, 255, 255, 0.06);
                backdrop-filter: blur(10px);
                padding: 32px 24px;
                border-radius: var(--radius);
                border: 1px solid rgba(255, 255, 255, 0.08);
                transition: var(--transition);
                text-align: center;
            }

            .why-card:hover {
                transform: translateY(-6px);
                background: rgba(255, 255, 255, 0.12);
                border-color: rgba(255, 255, 255, 0.15);
            }

            .why-card .icon {
                font-size: 44px;
                margin-bottom: 16px;
                display: block;
                color: var(--secondary);
            }

            .why-card .icon i {
                font-size: 44px;
            }

            .why-card h3 {
                font-size: 18px;
                font-weight: 700;
                margin-bottom: 8px;
            }

            .why-card p {
                font-size: 14px;
                color: rgba(255, 255, 255, 0.75);
                line-height: 1.8;
            }

            /* ===== BENEFITS SECTION ===== */
            .benefits-section {
                padding: 80px 0;
                background: var(--white);
            }

            .benefits-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
                gap: 30px;
                margin-top: 20px;
            }

            .benefit-card {
                display: flex;
                gap: 20px;
                padding: 24px;
                background: var(--gray-50);
                border-radius: var(--radius);
                transition: var(--transition);
                align-items: flex-start;
            }

            .benefit-card:hover {
                transform: translateY(-4px);
                box-shadow: var(--shadow);
                background: var(--white);
            }

            .benefit-card .benefit-icon {
                flex-shrink: 0;
                width: 56px;
                height: 56px;
                background: rgba(14, 165, 233, 0.1);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 24px;
                color: var(--primary);
            }

            .benefit-card .benefit-content h3 {
                font-size: 17px;
                font-weight: 700;
                color: var(--gray-900);
                margin-bottom: 6px;
            }

            .benefit-card .benefit-content p {
                font-size: 14px;
                color: var(--gray-600);
                line-height: 1.7;
            }

            /* ===== STEPS SECTION ===== */
            .steps-section {
                padding: 80px 0;
                background: var(--gray-50);
            }

            .steps-container {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
                gap: 30px;
                margin-top: 40px;
                position: relative;
            }

            .steps-container::before {
                content: '';
                position: absolute;
                top: 50px;
                left: 15%;
                right: 15%;
                height: 3px;
                background: linear-gradient(to right, var(--primary), var(--primary-light), var(--secondary));
                opacity: 0.2;
                transform: translateY(-50%);
            }

            @media (max-width: 768px) {
                .steps-container::before {
                    display: none;
                }
            }

            .step-item {
                text-align: center;
                position: relative;
                z-index: 2;
            }

            .step-item .step-number {
                width: 64px;
                height: 64px;
                background: linear-gradient(135deg, var(--primary), var(--primary-light));
                color: var(--white);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 24px;
                font-weight: 800;
                margin: 0 auto 16px;
                box-shadow: 0 8px 30px rgba(14, 165, 233, 0.25);
            }

            .step-item .step-number i {
                font-size: 24px;
            }

            .step-item h3 {
                font-size: 18px;
                font-weight: 700;
                color: var(--gray-900);
                margin-bottom: 8px;
            }

            .step-item p {
                font-size: 14px;
                color: var(--gray-600);
                line-height: 1.7;
                max-width: 260px;
                margin: 0 auto;
            }

            /* ===== TESTIMONIAL SECTION ===== */
            .testimonial-section {
                padding: 60px 0;
                background: linear-gradient(135deg, #F0F9FF 0%, #E0F2FE 100%);
            }

            .testimonial-content {
                text-align: center;
                max-width: 800px;
                margin: 0 auto;
            }

            .testimonial-content .quote-icon {
                font-size: 40px;
                color: var(--primary);
                opacity: 0.3;
                display: block;
                margin-bottom: 16px;
            }

            .testimonial-content blockquote {
                font-size: 20px;
                font-weight: 500;
                color: var(--gray-800);
                line-height: 1.9;
                margin-bottom: 16px;
            }

            .testimonial-content .author {
                font-size: 16px;
                color: var(--gray-600);
            }

            .testimonial-content .author strong {
                color: var(--gray-900);
            }

            /* ===== CTA SECTION ===== */
            .cta-section {
                padding: 80px 0;
                background: var(--white);
                text-align: center;
            }

            .cta-box {
                background: linear-gradient(135deg, #F0F9FF 0%, #E0F2FE 100%);
                padding: 60px 40px;
                border-radius: var(--radius);
                max-width: 900px;
                margin: 0 auto;
                position: relative;
                overflow: hidden;
            }

            .cta-box::after {
                content: '🏥';
                position: absolute;
                bottom: -30px;
                right: -30px;
                font-size: 120px;
                opacity: 0.06;
                transform: rotate(-20deg);
            }

            .cta-box h2 {
                font-size: clamp(28px, 3vw, 38px);
                font-weight: 800;
                color: var(--gray-900);
                margin-bottom: 16px;
            }

            .cta-box h2 i {
                color: var(--primary);
            }

            .cta-box p {
                font-size: 18px;
                color: var(--gray-700);
                margin-bottom: 32px;
                max-width: 600px;
                margin-left: auto;
                margin-right: auto;
            }

            .cta-box .btn-primary {
                font-size: 18px;
                padding: 18px 50px;
            }

            .cta-box .btn-primary .arrow {
                display: inline-block;
                transition: var(--transition);
            }

            .cta-box .btn-primary:hover .arrow {
                transform: translateX(-8px);
            }

            /* ===== RESPONSIVE ===== */
            @media (max-width: 992px) {
                .hero-grid {
                    grid-template-columns: 1fr;
                    gap: 40px;
                    text-align: center;
                }

                .hero-content p {
                    margin: 0 auto 32px;
                }

                .hero-content .quote {
                    text-align: right;
                }

                .hero-buttons {
                    justify-content: center;
                }

                .hero-stats {
                    justify-content: center;
                }

                .hero-visual .floating-card {
                    max-width: 100%;
                }

                .benefit-card {
                    flex-direction: column;
                    align-items: center;
                    text-align: center;
                }
            }

            @media (max-width: 576px) {
                .hero-section {
                    padding: 40px 0 60px;
                }

                .hero-content h1 {
                    font-size: 28px;
                }

                .hero-stats {
                    gap: 20px;
                    flex-wrap: wrap;
                }

                .hero-stat .number {
                    font-size: 22px;
                }

                .btn-primary,
                .btn-secondary {
                    padding: 14px 28px;
                    font-size: 14px;
                    width: 100%;
                    justify-content: center;
                }

                .hero-buttons {
                    flex-direction: column;
                    width: 100%;
                }

                .feature-card {
                    padding: 24px 18px;
                }

                .cta-box {
                    padding: 32px 20px;
                }

                .cta-box .btn-primary {
                    width: 100%;
                    justify-content: center;
                }

                .benefit-card {
                    padding: 16px;
                }

                .section-title {
                    font-size: 26px;
                }

                .floating-card .step-line {
                    flex-direction: column;
                    text-align: center;
                }

                .testimonial-content blockquote {
                    font-size: 17px;
                }
            }

            /* ===== ANIMATIONS ===== */
            @keyframes fadeInUp {
                from {
                    opacity: 0;
                    transform: translateY(30px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            .animate-fade-up {
                animation: fadeInUp 0.6s ease forwards;
            }

            .animate-fade-up.delay-1 {
                animation-delay: 0.1s;
            }
            .animate-fade-up.delay-2 {
                animation-delay: 0.2s;
            }
            .animate-fade-up.delay-3 {
                animation-delay: 0.3s;
            }
            .animate-fade-up.delay-4 {
                animation-delay: 0.4s;
            }