

#about {
    /* background: #192231 !important; */
    background: linear-gradient(to bottom, rgb(25 34 49) 5%, rgb(41 41 41 / 0%) 95%);
    position: relative;
    overflow: hidden;
}

@media (max-width: 551px) {
    #about {
      background: none !important;
    }
  }
  

.about-blend-top::before,
.about-blend-top::after {
    display: none !important;
}

/* 3D Background Container Styles - Global */
#bg-3d-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: -1 !important;
    pointer-events: none !important;
    overflow: hidden !important;
}

#bg-3d-container canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
}
   
   html[dir="rtl"] .list-disc {
            list-style-position: inside;
            padding-right: 1.5rem; 
            padding-left: 0;
        }

        html[dir="rtl"] .list-disc li i.mr-2 {
            margin-right: 0;
            margin-left: 0.5rem; 
        }
        html[dir="rtl"] .border-l-4 {
            border-left: none; 
            border-right: 4px solid var(--tw-border-opacity); 
            padding-left: 0;
            padding-right: 1rem; 
        }
        .ltr-content {
            direction: ltr;
            unicode-bidi: isolate;
        }

        /* Updated unique class names for styling */
        .cgl-about-tab-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(59, 130, 246, 0.2));
            border: 1px solid rgba(59, 130, 246, 0.3);
            border-radius: 25px;
            cursor: pointer;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            backdrop-filter: blur(10px);
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
            color: #3B82F6;
            font-weight: 600;
            font-size: 1rem;
            padding: 0.75rem 1.5rem;
            min-width: 120px;
            position: relative;
            overflow: hidden;
        }

        .cgl-about-tab-button:hover {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(59, 130, 246, 0.3));
            border-color: rgba(59, 130, 246, 0.5);
            transform: translateY(-3px) scale(1.05);
            box-shadow: 0 8px 25px rgba(59, 130, 246, 0.2);
            color: #60A5FA;
        }

        .cgl-about-tab-button:active {
            transform: translateY(-1px) scale(1.02);
        }

        .cgl-about-tab-button.cgl-about-active {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(59, 130, 246, 0.4));
            border-color: rgba(59, 130, 246, 0.6);
            color: #60A5FA;
            box-shadow: 0 8px 25px rgba(59, 130, 246, 0.3);
        }

        .cgl-about-tab-button:focus {
            outline: 2px solid rgba(59, 130, 246, 0.5);
            outline-offset: 2px;
        }

        /* High contrast mode support */
        @media (prefers-contrast: high) {
            .cgl-about-tab-button {
                border: 2px solid #3B82F6;
                background: rgba(59, 130, 246, 0.3);
            }
            
            .cgl-about-tab-button:hover {
                background: rgba(59, 130, 246, 0.5);
            }
        }

        /* Reduced motion support */
        @media (prefers-reduced-motion: reduce) {
            .cgl-about-tab-button {
                transition: none;
            }
            
            .cgl-about-tab-button:hover {
                transform: none;
            }
        }

        /* Responsive adjustments */
        @media (max-width: 768px) {
            .cgl-about-tab-button {
                min-width: 100px;
                padding: 0.6rem 1.2rem;
                font-size: 0.9rem;
            }
        }

        @media (max-width: 480px) {
            .cgl-about-tab-button {
                min-width: 90px;
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

        .cgl-about-tab-content {
            display: none; 
        }
        .cgl-about-tab-content.cgl-about-active {
            display: block; 
        }