/* Timeline Container */
        .hiw-timeline {
            position: relative;
            padding: 2rem 0;
        }

        /* Timeline Line */
        .hiw-timeline-line {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            width: 3px;
            background: linear-gradient(180deg, var(--color-primary-500), var(--color-secondary-500));
            transform: translateX(-50%);
        }

        /* Timeline Item */
        .hiw-timeline-item {
            position: relative;
            display: flex;
            align-items: center;
            margin-bottom: 3rem;
            width: 100%;
        }

        .hiw-timeline-item:last-child {
            margin-bottom: 0;
        }

        /* Left/Right Positioning */
        .hiw-timeline-left {
            justify-content: flex-start;
            padding-right: calc(50% + 2rem);
        }

        .hiw-timeline-right {
            justify-content: flex-end;
            padding-left: calc(50% + 2rem);
        }

        /* RTL Support */
        [dir="rtl"] .hiw-timeline-left {
            justify-content: flex-end;
            padding-right: 0;
            padding-left: calc(50% + 2rem);
        }

        [dir="rtl"] .hiw-timeline-right {
            justify-content: flex-start;
            padding-left: 0;
            padding-right: calc(50% + 2rem);
        }

        /* Timeline Content Box */
        .hiw-timeline-content {
            background: var(--color-card-bg, #fff);
            border-radius: 1rem;
            padding: 1.5rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            position: relative;
            transition: all 0.3s ease;
            max-width: 100%;
        }

        .dark .hiw-timeline-content {
            background: var(--color-bg-secondary);
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
        }

        .hiw-timeline-content:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
        }

        .dark .hiw-timeline-content:hover {
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
        }

        /* Timeline Node */
        .hiw-timeline-node {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            width: 1.5rem;
            height: 1.5rem;
            background: var(--color-primary-600);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1;
        }

        .hiw-timeline-node-inner {
            width: 0.75rem;
            height: 0.75rem;
            background: #fff;
            border-radius: 50%;
        }

        /* Step Number */
        .hiw-timeline-step {
            position: absolute;
            top: -0.75rem;
            left: 1rem;
            background: linear-gradient(135deg, var(--color-primary-600), var(--color-primary-700));
            color: #fff;
            font-size: 0.75rem;
            font-weight: 700;
            padding: 0.25rem 0.75rem;
            border-radius: 9999px;
        }

        [dir="rtl"] .hiw-timeline-step {
            left: auto;
            right: 1rem;
        }

        /* Icon Container */
        .hiw-timeline-icon {
            width: 4rem;
            height: 4rem;
            background: linear-gradient(135deg, var(--color-primary-100), var(--color-secondary-100));
            border-radius: 1rem;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 1rem;
            transition: all 0.3s ease;
        }

        .dark .hiw-timeline-icon {
            background: linear-gradient(135deg, var(--color-primary-900), var(--color-secondary-900));
        }

        .hiw-timeline-content:hover .hiw-timeline-icon {
            background: linear-gradient(135deg, var(--color-primary-600), var(--color-secondary-500));
        }

        /* Icon SVG colors */
        .hiw-timeline-icon-svg,
        .hiw-timeline-icon-svg svg {
            color: var(--color-primary-600);
            fill: var(--color-primary-600);
            transition: color 0.3s ease, fill 0.3s ease;
        }

        .dark .hiw-timeline-icon-svg,
        .dark .hiw-timeline-icon-svg svg {
            color: var(--color-primary-400);
            fill: var(--color-primary-400);
        }

        .hiw-timeline-content:hover .hiw-timeline-icon-svg,
        .hiw-timeline-content:hover .hiw-timeline-icon-svg svg,
        .hiw-timeline-content:hover .hiw-timeline-icon svg {
            color: #fff !important;
            fill: #fff !important;
        }

        /* Mobile Responsive */
        @media (max-width: 768px) {
            .hiw-timeline-line {
                left: 1rem;
            }

            .hiw-timeline-left,
            .hiw-timeline-right {
                justify-content: flex-start;
                padding-left: 3rem;
                padding-right: 0;
            }

            [dir="rtl"] .hiw-timeline-left,
            [dir="rtl"] .hiw-timeline-right {
                justify-content: flex-start;
                padding-right: 3rem;
                padding-left: 0;
            }

            [dir="rtl"] .hiw-timeline-line {
                left: auto;
                right: 1rem;
            }

            .hiw-timeline-node {
                left: 1rem;
            }

            [dir="rtl"] .hiw-timeline-node {
                left: auto;
                right: 1rem;
            }
        }