.archive-timeline{background:#f9f9f9;min-height:100vh}.timeline-hero{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));padding:60px 0;text-align:center;color:#fff;margin-bottom:40px}@media (max-width:768px){.timeline-hero{padding:40px 0;margin-bottom:30px}}.timeline-title{font-size:32px;font-weight:700;margin:0 0 12px;color:#fff;letter-spacing:-.5px;text-transform:uppercase}@media (max-width:768px){.timeline-title{font-size:30px}}@media (max-width:480px){.timeline-title{font-size:28px}}.timeline-description{font-size:18px;color:hsla(0,0%,100%,.9);max-width:600px;margin:0 auto}@media (max-width:768px){.timeline-description{font-size:16px}}.timeline-section{padding:0 0 60px}@media (max-width:768px){.timeline-section{padding:0 0 40px}}.timeline-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-bottom:40px}@media (max-width:992px){.timeline-grid{grid-template-columns:repeat(2,1fr);gap:24px}}@media (max-width:576px){.timeline-grid{grid-template-columns:1fr;gap:20px}}.timeline-card{background:#fff;border-radius:16px;overflow:visible;box-shadow:0 2px 12px rgba(0,0,0,.08);transition:all .2s ease-in-out;position:relative}.timeline-card:hover{transform:translateY(-8px);box-shadow:0 16px 32px rgba(0,0,0,.16)}.timeline-card:hover .timeline-card-cover img{transform:scale(1.05)}.timeline-card:hover .timeline-card-title{color:var(--color-primary)}.timeline-card-link{display:block;color:inherit}.timeline-card-link,.timeline-card-link:hover{text-decoration:none}.timeline-card-cover{position:relative;width:100%;height:180px;overflow:hidden;border-radius:16px 16px 0 0;background:#ebebeb}.timeline-card-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .5s ease}@media (max-width:768px){.timeline-card-cover{height:160px}}@media (max-width:480px){.timeline-card-cover{height:140px}}.timeline-card-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.1) 50%,rgba(0,0,0,.3))}.timeline-card-avatar{position:absolute;top:180px;left:50%;transform:translateX(-50%) translateY(-50%);width:120px;height:120px;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.15);border:4px solid #fff;transition:all .2s ease-in-out;z-index:2}.timeline-card-avatar img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}@media (max-width:768px){.timeline-card-avatar{top:160px;width:100px;height:100px}}@media (max-width:480px){.timeline-card-avatar{top:140px;width:90px;height:90px;border-width:3px}}.timeline-card-content{padding:70px 20px 24px;text-align:center}@media (max-width:768px){.timeline-card-content{padding:60px 16px 20px}}@media (max-width:480px){.timeline-card-content{padding:55px 12px 16px}}.timeline-card-count{display:inline-block;background:var(--color-primary);color:#fff;padding:6px 16px;border-radius:20px;font-size:13px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;margin-bottom:12px}@media (max-width:768px){.timeline-card-count{font-size:12px;padding:5px 12px;margin-bottom:10px}}.timeline-card-title{font-size:18px;font-weight:600;color:#333;margin:0;line-height:1.4;transition:color .2s ease-in-out}@media (max-width:768px){.timeline-card-title{font-size:16px}}@media (max-width:480px){.timeline-card-title{font-size:15px}}.timeline-pagination{display:flex;justify-content:center;margin-top:40px}.timeline-pagination .pagination{display:flex;gap:8px;list-style:none;padding:0;margin:0}.timeline-pagination .page-item .page-link{padding:10px 16px;border-radius:8px;background:#fff;color:var(--color-primary);border:1px solid #e5e5e5;font-weight:500;transition:all .2s ease-in-out;text-decoration:none}.timeline-pagination .page-item .page-link:hover{transform:translateY(-2px)}.timeline-pagination .page-item.active .page-link,.timeline-pagination .page-item .page-link:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.timeline-pagination .page-item.disabled .page-link{opacity:.5;cursor:not-allowed}.timeline-pagination .page-item.disabled .page-link:hover{background:#fff;color:var(--color-primary);transform:none}@media (max-width:768px){.timeline-pagination{margin-top:30px}.timeline-pagination .page-link{padding:8px 12px;font-size:14px}}.timeline-card.loading .timeline-card-image{background:linear-gradient(90deg,#e9ecef 25%,#f8f9fa 50%,#e9ecef 75%);background-size:200% 100%;-webkit-animation:loading 1.5s infinite;animation:loading 1.5s infinite}@-webkit-keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.timeline-empty{text-align:center;padding:80px 20px;color:#718096}.timeline-empty h3{font-size:24px;margin-bottom:12px;color:#2d3748}.timeline-empty p{font-size:16px;margin:0}.page-timeline-detail{background:#fff}.timeline-detail-wrapper{padding:0}.timeline-detail-header{margin-bottom:30px}.timeline-banner{width:100%;height:300px;overflow:hidden;margin-bottom:20px;border-radius:10px}.timeline-banner img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}@media (max-width:768px){.timeline-banner{height:200px}}.timeline-header-content{padding:0 15px}@media (max-width:768px){.timeline-header-content{padding:0 15px}}.timeline-breadcrumb{font-size:14px;margin-bottom:10px;color:#6e6e6e}.timeline-breadcrumb a{color:#191919;text-decoration:none;font-weight:600}.timeline-breadcrumb a:hover{color:var(--color-primary)}.timeline-breadcrumb .separator{margin:0 8px;color:#a6a6a6}.timeline-breadcrumb .current{color:#a6a6a6}@media (max-width:576px){.timeline-breadcrumb{font-size:13px;margin-bottom:8px}}.timeline-main-title{font-size:32px;font-weight:700;color:#191919;margin:0;line-height:1.3}@media (max-width:768px){.timeline-main-title{font-size:24px}}@media (max-width:576px){.timeline-main-title{font-size:20px;line-height:1.4}}.timeline-detail-content{padding:0 15px 40px}@media (max-width:768px){.timeline-detail-content{padding:0 0 30px}}.timeline-articles{display:flex;flex-direction:column;gap:0}.timeline-article-item{display:flex;gap:20px;padding:24px 0;border-bottom:1px solid #e5e5e5}.timeline-article-item:last-child{border-bottom:none}@media (max-width:768px){.timeline-article-item{padding:20px 15px}}@media (max-width:576px){.timeline-article-item{flex-direction:column;gap:0;padding:16px 12px}}.article-date{flex-shrink:0;width:100px;padding-top:4px;display:flex;flex-direction:column;gap:6px}@media (max-width:768px){.article-date{width:90px}}@media (max-width:576px){.article-date{width:auto;padding-top:0;margin-bottom:12px;flex-direction:row;align-items:center;gap:8px}}.date-day{font-size:16px;color:#191919;font-weight:500;text-transform:capitalize}@media (max-width:576px){.date-day{font-size:14px;color:#6e6e6e}}.date-label{font-size:13px;color:#6e6e6e;font-weight:500;border-radius:4px;display:inline-block}.article-content-wrapper{flex:1;display:flex;gap:20px}@media (max-width:768px){.article-content-wrapper{gap:16px}}@media (max-width:576px){.article-content-wrapper{flex-direction:column;gap:12px}}.article-thumbnail{flex-shrink:0;width:220px;height:140px;overflow:hidden;border-radius:4px}.article-thumbnail a{display:block;width:100%;height:100%}.article-thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .2s ease-in-out}.article-thumbnail img:hover{transform:scale(1.05)}@media (max-width:768px){.article-thumbnail{width:160px;height:100px}}@media (max-width:576px){.article-thumbnail{width:100%;height:180px;border-radius:6px}}.article-info{flex:1;min-width:0}.article-title{font-size:18px;font-weight:600;margin:0 0 8px;line-height:1.4}.article-title a{color:#191919;text-decoration:none;transition:color .2s ease-in-out}.article-title a:hover{color:var(--color-primary)}@media (max-width:768px){.article-title{font-size:16px;margin:0 0 6px}}@media (max-width:576px){.article-title{font-size:15px;line-height:1.5}}.article-excerpt{font-size:14px;color:#6e6e6e;line-height:1.6;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}@media (max-width:768px){.article-excerpt{font-size:13px;-webkit-line-clamp:2;line-height:1.5}}@media (max-width:576px){.article-excerpt{font-size:13px;-webkit-line-clamp:3}}.timeline-sidebar{position:sticky;top:80px}@media (max-width:991px){.timeline-sidebar{position:static;margin-top:30px}}@media (max-width:768px){.timeline-sidebar{margin-top:20px}}.sidebar-widget{background:#fff;border:1px solid #e5e5e5;border-radius:8px;padding:20px;margin-bottom:20px}.sidebar-widget:last-child{margin-bottom:0}@media (max-width:768px){.sidebar-widget{padding:16px;margin-bottom:16px}}@media (max-width:576px){.sidebar-widget{border-radius:0;border-left:none;border-right:none}}.hot-topics-widget .widget-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #e5e5e5}.hot-topics-widget .badge-hot{background:var(--color-primary);color:#fff;font-size:12px;font-weight:700;padding:4px 12px;border-radius:4px;letter-spacing:.5px}.hot-topics-widget .view-all{font-size:13px;color:#6e6e6e;text-decoration:none;transition:color .2s ease-in-out}.hot-topics-widget .view-all:hover{color:#191919}.ads-widget{border:none;padding:0;background:transparent}.ads-widget img{width:100%;height:auto;border-radius:8px}.timeline-loading{text-align:center;padding:40px 20px}.timeline-loading p{margin:12px 0 0;color:#6e6e6e;font-size:14px}.loading-spinner{display:inline-block;width:40px;height:40px;border:3px solid #ebebeb;border-top:3px solid var(--color-primary);border-radius:50%;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.timeline-load-more{text-align:center;padding:40px 20px}@media (max-width:768px){.timeline-load-more{padding:30px 15px}}.btn-load-more{background:var(--color-primary);color:#fff;border:none;padding:12px 40px;border-radius:25px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 4px 12px rgba(0,0,0,.15)}.btn-load-more:hover{background:rgba(221,0,38,.8);transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.2)}.btn-load-more:active{transform:translateY(0)}@media (max-width:576px){.btn-load-more{width:100%;max-width:280px;padding:14px 30px}}