body {
            -webkit-font-smoothing: antialiased;
        }

        /* Tùy chỉnh Scrollbar */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #f8fafc; }
        ::-webkit-scrollbar-thumb { background: #fbbf24; border-radius: 4px; }

        /* Hiệu ứng Accordion */
        .accordion-content {
            max-height: 0;
            opacity: 0;
            overflow: hidden;
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .accordion-item.active .accordion-content {
            max-height: 800px;
            opacity: 1;
            padding-bottom: 1.5rem;
        }
        .accordion-item.active .accordion-chevron {
            transform: rotate(180deg);
            color: #d97706; /* amber-600 */
        }
        .accordion-item.active .accordion-icon-box {
            background-color: #f59e0b; /* amber-500 */
            color: white;
            transform: scale(1.1);
            box-shadow: 0 4px 14px rgba(245, 158, 11, 0.4);
        }
        .accordion-item.active .accordion-title {
            color: #b45309; /* amber-700 */
        }

        /* Hiệu ứng Timeline */
        .timeline-pane {
            display: none;
            opacity: 0;
        }
        .timeline-pane.active {
            display: grid;
            opacity: 1;
            animation: paneFadeIn 0.5s ease forwards;
        }
        @keyframes paneFadeIn {
            from { opacity: 0; transform: translateY(15px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* Hiệu ứng Click Cards (Thay cho Hover) */
        .click-card-front, .click-card-back {
            transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .click-card-back {
            transform: translateY(100%);
            opacity: 0;
            pointer-events: none;
        }
        .click-card.active .click-card-front {
            transform: translateY(-100%);
            opacity: 0;
            pointer-events: none;
        }
        .click-card.active .click-card-back {
            transform: translateY(0);
            opacity: 1;
            pointer-events: auto;
        }
        .bg-icon-transition {
            transition: all 0.8s ease;
        }
        .click-card.active .bg-icon-transition {
            transform: scale(1.4) rotate(15deg);
            opacity: 0.1;
        }