:root {
            --apple-bg: #f5f5f7;
            --apple-text: #1d1d1f;
            --apple-link: #0066cc;
        }

        body {
            font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            background-color: #ffffff;
            color: var(--apple-text);
            overflow-x: hidden;
        }

        .glass-nav {
            background: rgba(255, 255, 255, 0.8);
            backdrop-filter: saturate(180%) blur(20px);
            border-bottom: 1px solid rgba(0,0,0,0.1);
        }

        .hero-gradient {
            background: linear-gradient(180deg, #ffffff 0%, var(--apple-bg) 100%);
        }

        .apple-card {
            transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.6s ease;
        }
        
        .apple-card:hover {
            transform: scale(1.01) translateY(-5px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.05);
        }

        .btn-apple {
            background: #1d1d1f;
            color: white;
            padding: 12px 28px;
            border-radius: 980px;
            font-weight: 500;
            transition: all 0.3s ease;
            display: inline-block;
        }

        .btn-apple:hover {
            background: #000;
            transform: scale(1.02);
        }

        .text-gradient {
            background: linear-gradient(to right, #1d1d1f, #86868b);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .reveal {
            opacity: 0;
            transform: translateY(40px);
            transition: opacity 1s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
            will-change: opacity, transform;
        }

        .reveal.active {
            opacity: 1;
            transform: translateY(0);
        }

        .cert-badge {
            background: #fff;
            border: 1px solid rgba(0,0,0,0.05);
            transition: all 0.3s ease;
        }

        .cert-badge:hover {
            border-color: var(--apple-link);
            box-shadow: 0 10px 20px rgba(0,0,0,0.03);
        }

        .ai-shimmer {
            background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
            background-size: 200% 100%;
            animation: shimmer 2s infinite;
        }

        @keyframes shimmer {
            0% { background-position: 200% 0; }
            100% { background-position: -200% 0; }
        }

        .gallery-item {
            aspect-ratio: 1/1;
            overflow: hidden;
            border-radius: 24px;
            background: #f5f5f7;
            position: relative;
        }

        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .gallery-item:hover img {
            transform: scale(1.05);
        }

        .gallery-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, transparent 100%);
            opacity: 0;
            transition: opacity 0.3s ease;
            display: flex;
            align-items: flex-end;
            padding: 24px;
            color: white;
        }

        .gallery-item:hover .gallery-overlay {
            opacity: 1;
        }

        /* Remove unused or redundant CSS below if not referenced in HTML or JS */
        /* Example: If .ai-shimmer or .cert-badge is not used, comment or remove */
        /* .ai-shimmer, .cert-badge, .cert-badge:hover, .shimmer, .reveal, .reveal.active, etc. */
        /* Review and keep only what is used in the visible UI */

        /* Loading Spinner */
        #loader {
            position: fixed;
            inset: 0;
            background-color: #ffffff;
            z-index: 9999;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
        }

        .spinner {
            width: 40px;
            height: 40px;
            border: 3px solid rgba(0, 0, 0, 0.1);
            border-radius: 50%;
            border-top-color: #1d1d1f;
            animation: spin 1s ease-in-out infinite;
        }

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

        /* Mobile Menu Transition */
        #mobile-menu {
            transition: opacity 0.3s ease, transform 0.3s ease;
            transform-origin: top;
        }

        /* AI Animation */
        @keyframes spin-slow {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        .animate-spin-slow {
            animation: spin-slow 3s linear infinite;
        }

        /* AI Pulse Scale Animation */
        @keyframes pulse-scale {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.3); opacity: 0.8; }
        }
        .animate-pulse-scale {
            animation: pulse-scale 2s infinite ease-in-out;
        }

        /* Lightbox Spinner */
        .lightbox-spinner {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            z-index: 50;
        }
        .lightbox-spinner-svg {
            width: 48px;
            height: 48px;
            animation: spin 1s linear infinite;
            color: white;
        }