/* --- RWD --- */
@media (max-width: 1400px) {
    #events-section #data-container #data-list li p.data-url {
        margin-top: 0vh;
    }
    .archive-header img {
        width: 30vw;
    }
}

@media (max-width: 1200px) {
    .navbar {
        padding: 5px 0;
    }
    .nav-menu {
        display: none;
    }
    .hamburger {
        display: block;
        font-size: 3rem;
        color: #0f2c56;
    }
    .container {
        max-width: 96%;
    }
    .hero {
        padding: 6vh 4vw;
    }
    .hero h1 {
        font-size: 6rem;
    }
    .hero p.subtitle {
        font-size: 2.45rem;
    }
    .hero p.desc2 {
        font-size: 1.5rem;
    }
    .process-grid {
        width: 100%;
    }
    .video-swiper .swiper-slide {
        width: 36%;
    }
    .consulting-header h1 {
        font-size: 4.5rem;
    }
    .consulting-header {
        padding: 8vh 6vw 12vh;
    }
    .consulting-header .consulting-main {
        width: 30vw;
    }
    .solutions-header .solutions-main {
        width: 30vw;
    }
    .feature-item {
        font-size: 1.25rem;
    }
    .eligibility-header img {
        width: 40vw;
    }
    .archive-header img {
        width: 34vw;
    }
    .fixed-cta-container img {
        width: 12vw;
    }
    .result-content {
        max-width: 45%;
    }
    .dashboard-card {
        padding: 4vh 0;
    }
    .map-total {
        font-size: 2.75rem;
    }
    .map-label {
        font-size: 1.1rem;
    }
    .map-value {
        font-size: 1.5rem;
    }
    .btn-cta img {
        width: 3vw;
    }
    .h3_2024 img {
        width: 4vw;
        height: auto;
    }
    footer.footer .footer_icon img {
        height: 2.25vw;
    }
}

@media (max-width: 1024px) {
    .container {
        max-width: 96%;
    }
    .solutions-header h1 {
        margin-bottom: 2vh;
    }
    .solutions-header p {
        margin-bottom: 4vh;
    }
    .map-content {
        gap: 4vw;
    }
    .map-total {
        font-size: 3.5rem;
    }
    .map-label {
        font-size: 1.25rem;
    }
    .map-value {
        font-size: 2rem;
    }
    .btn-cta img {
        width: 2.75vw;
    }
    .video-wrapper {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .video-list {
        max-height: none;
    }
}

@media (max-width: 960px) {
    .process-grid {
        grid-template-columns: repeat(2, 1fr);
        width: 80%;
        gap: 20px;
    }
    .process-card .icon-box img {
        max-width: 100%;
        height: auto;
    }
    #events-section #data-container #data-list {
        width: 90%;
    }
    #events-section #data-container #data-list > li::before {
        width: 10vw;
        top: -38px;
        left: 16px;
    }
    #events-section #data-container #data-list li {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    #events-section #data-container #data-list li p {
        width: 100%;
        margin-right: 0;
        font-size: 1.25rem;
    }
    #events-section #data-container #data-list li p.data-url, #events-section #data-container #data-list li p.disabled {
        font-size: 1.75rem;
        padding: 0.75rem 1rem;
        margin-top: 2rem;
        text-align: center;
    }
    .video-wrapper {
        grid-template-columns: 1fr;
    }
    .hero-btns img {
        width: 38vw;
    }
    .hero {
        background-position: center bottom;
    }
    .video-swiper {
        padding: 0 0 40px;
    }
    .eligibility-header h1 {
        font-size: 4.5rem;
    }
    .archive-header img {
        width: 38vw;
    }
    .fixed-cta-container img {
        width: 15vw;
    }
    .solutions-header .solutions-main {
        width: 38vw;
    }
    .btn-cta img {
        width: 4vw;
    }
}

@media (max-width: 900px) {
    .nav-menu {
        display: none;
    }
    .hamburger {
        display: block;
    }
    .content-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .report-card {
        flex-direction: column;
        text-align: center;
    }
    .btn-download {
        width: 100%;
        justify-content: center;
    }
    .page-header h1 {
        font-size: 5rem;
    }
    .dashboard-card {
        padding: 30px 20px;
    }
    .archive-header img {
        width: 40vw;
    }
    /* 手機版下拉選單 */
    .dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        background: var(--bg-color-dark);
        width: 100%;
        padding-left: 20px;
        margin-top: 5px;
    }
    .nav-menu.active .dropdown-menu {
        display: none;
    }
    .dropdown:hover .dropdown-menu {
        display: block;
    }
    .result-content {
        max-width: 50%;
    }
    .h3_2024 img {
        width: 5vw;
        height: auto;
    }
    footer.footer .footer_icon img {
        height: 3vw;
    }
    footer.footer .footer_icon img {
        height: 4.5vw;
    }
}

@media (max-width: 768px) {
    .hamburger {
        display: block;
    }
    .hero {
        padding: 8vh 6vw;
    }
    .hero h1 {
        font-size: 4rem;
        margin-bottom: 1vh;
    }
    .hero p.subtitle {
        font-size: 2rem;
    }
    .hero p.desc1 {
        font-size: 1.35rem;
        margin-bottom: 10vh;
    }
    .hero p.desc2 {
        font-size: 1.5rem;
        letter-spacing: normal;
        margin-bottom: 3vh;
    }
    .hero-btns img {
        width: 54%;
    }
    .button-container {
        max-width: 100%;
    }
    .button {
        padding: 18px;
        font-size: 1.5rem;
    }
    .button-right {
        margin-left: -80px;
        padding-left: 80px;
    }
    .button-right img {
        width: 4vw;
    }
    .process-card {
        display: flex;
        align-items: center;
        gap: 20px;
        text-align: left;
    }
    .process-card .icon-box {
        margin: 0;
        width: 100%;
        height: auto;
        flex-shrink: 0;
    }
    .process-card h3 {
        white-space: nowrap;
        text-align: center;
    }
    .process-card p {
        font-size: 1.2rem;
        text-align: center;
    }
    .process-card button.btn-cta {
        margin: auto auto 0;
        align-self: center;
        white-space: nowrap;
    }
    .page-header h1 {
        font-size: 4rem;
    }
    .archive-header img {
        width: 50vw;
    }
    .year-title-block h2 {
        font-size: 2.5rem;
    }
    /* Mobile Activity List */
    .activity-item {
        grid-template-columns: 1fr;
        gap: 15px;
        text-align: left;
    }
    .activity-date {
        flex-direction: row;
        width: auto;
        height: auto;
        padding: 5px 10px;
        gap: 5px;
        align-items: baseline;
        justify-content: flex-start;
        background: transparent;
        padding-left: 0;
        color: var(--text-light);
    }
    .activity-date .day {
        font-size: 1rem;
        color: var(--primary);
    }
    .activity-date .month {
        font-size: 1rem;
        color: var(--text-main);
    }
    .activity-action {
        text-align: left;
    }
    /* Mobile Dropdown */
    .dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        width: 100%;
        padding-left: 20px;
        margin-top: 5px;
    }
    .nav-menu.active .dropdown-menu {
        display: none;
    }
    .dropdown:hover .dropdown-menu {
        display: block;
    }
    #events-section #data-container #data-list {
        width: 100%;
    }
    #events-section #data-container #data-list li.data-title {
        flex-direction: column;
    }
    #events-section #data-container #data-list li.data-title p {
        flex: 0 0 100%;
        min-width: 100%;
    }
    #events-section #data-container #data-list li {
        flex-direction: column;
        align-items: flex-start;
        margin-top: 22px;
    }
    #events-section #data-container #data-list li p {
        margin-right: 0;
    }
    #events-section #data-container #data-list li p.data-url {
        margin-left: 0;
        width: 100%;
    }
    #events-section #data-container #data-list > li::before {
        width: 10vw;
        height: auto;
        top: -16px;
        left: 16px;
    }
    .section-title {
        margin-bottom: 8vh;
    }
    .video-section .video-layout {
        flex-direction: column;
        align-items: flex-start;
      }
    
      .video-section .video-text {
        flex: 0 0 auto;
        width: 100%;
        margin-bottom: 16px;
      }
    
      .video-section .video-wrapper {
        max-width: 100%;
        margin-left: 0;
      }
    .video-swiper {
        width: 100%;
        padding: 12px 0;
        min-height: 44vh;
        position: relative;
    }
    .video-swiper .swiper-slide {
        width: clamp(200px, 80vw, 400px);
    }
    .video-swiper .swiper-slide.swiper-slide-active {
        height: 44vh;
        width: auto;
        aspect-ratio: 16 / 9;
        max-width: min(78.22vh, 100vw);
    }
    .video-swiper .swiper-slide.swiper-slide-active iframe {
        transform: scale(1.5);
        transform-origin: center center;
    }
    .video-swiper .swiper-button-prev,
    .video-swiper .swiper-button-next {
        width: 44px !important;
        height: 100% !important;
        top: 0 !important;
        margin-top: 0 !important;
        color: #fff !important;
        pointer-events: auto !important;
        cursor: pointer !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        transition: background-color 0.3s;
        position: absolute !important;
    }
    
    .video-swiper .swiper-button-prev {
        left: 0;
        right: auto;
    }
    
    .video-swiper .swiper-button-next {
        right: 0;
        left: auto;
    }
    
    .video-swiper .swiper-button-prev::after,
    .video-swiper .swiper-button-next::after {
        font-size: 40px;
        font-weight: bold;
    }
    
    .video-swiper .swiper-button-prev:hover,
    .video-swiper .swiper-button-next:hover {
        background-color: rgba(0, 0, 0, 0.3);
    }
    .main-video {
        aspect-ratio: 16/9;
        max-height: 44vh;
    }
    
    .video-wrapper {
        max-width: 100%;
        padding: 0;
    }
    
    .video-item {
        flex-direction: column;
    }
    
    .video-thumb {
        max-width: 100%;
        width: 100%;
    }
    
    .video-info h3 {
        font-size: 1.25rem;
        white-space: normal;
    }
    
    .video-info span {
        font-size: 1rem;
    }
    
    footer.footer .copyright {
        font-size: 1rem;
    }
    .consulting-header {
        padding: 6vh 6vw 10vh;
    }
    .consulting-header .consulting-main {
        width: 50vw;
    }
    .consulting-header p {
        font-size: 1.75rem;
        margin-bottom: 2vh;
    }
    .intro-title {
        font-size: 2.5rem;
    }
    .intro-text {
        font-size: 1.25rem;
    }
    .feature-list {
        grid-template-columns: 1fr;
    }
    .feature-item {
        padding: 1rem 1.5rem;
        font-size: 1.45rem;
    }
    .feature-item .check-icon {
        font-size: 1.5rem;
        padding-right: 0.1rem;
    }
    /* .category-card .btn-cta{width: 30vw;} */
    .solutions-header .solutions-main {
        width: 50vw;
    }
    .solutions-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .solutions-grid .category-card {
        flex-direction: column;
        gap: 20px;
    }
    .solutions-grid .icon-box {
        width: 65%;
        margin: auto;
        text-align: center;
    }
    .solutions-grid .cat-content {
        width: 100%;
        margin-left: 0;
    }
    .solutions-grid .cat-title,
    .solutions-grid .cat-desc {
        text-align: center;
    }
    .solutions-grid .category-card .btn-cta {
        width: 80%;
    }
    .solutions-grid .cat-tag {
        display: inline-block;
        margin: 0.5rem auto;
    }
    .solutions-grid .category-card > div:not(.icon-box):not(.cat-content):not(.d-flex):not(.tag_block),
    .solutions-grid .category-card .tag_block {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        text-align: center;
    }
    .solutions-header h1 {
        font-size: 4.25rem;
        margin-bottom: 2vh;
    }
    .solutions-header p {
        font-size: 1.75rem;
        margin-bottom: 4vh;
    }
    .solutions-header img {
        width: 60%;
    }
    .notice-content p span {
        font-size: 1.5rem;
    }
    .notice-content p {
        font-size: 1.25rem;
    }
    .apply-cta h3 {
        font-size: 3.5rem;
    }
    .apply-cta p {
        margin-bottom: 6vh;
    }
    .eligibility-header {
        padding: 4vh 4vw 10vh;
    }
    .eligibility-header h1 {
        font-size: 3.5rem;
    }
    .eligibility-header p {
        font-size: 1.45rem;
    }
    .container {
        max-width: 96%;
        margin: -8vh auto 6vh;
    }
    .event-item {
        flex-direction: column;
        align-items: flex-start;
    }
    .event-action {
        margin-top: 20px;
        width: 100%;
    }
    .btn-register {
        display: block;
        text-align: center;
    }
    .event-info {
        flex-direction: column;
        gap: 8px;
    }
    #year2024 > .flex {
        flex-direction: column;
    }
    #year2024 [class="2024_intro"] {
        width: 100%;
        text-align: center;
    }
    #year2024 [class="2024_download"] {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 1.5rem;
        text-align: center;
    }
    .btn-cta img {
        width: 4vw;
    }
    .fixed-cta-container img {
        width: 18vw;
    }
    .result-content {
        max-width: 70%;
    }
    .result-icon {
        width: 15vw;
    }
    #year2025 .rounded-\[2\.5rem\] {
        border-radius: 1.5rem;
    }
    .h3_2024 img {
        width: 6vw;
        height: auto;
    }
}

@media screen and (max-width: 640px) {
    #year2025 .bg_cover {
        background-size: contain;
    }
    .btn-cta img {
        width: 5vw;
    }
    .h3_2024 img {
        display: none;
    }
}

@media screen and (max-width: 560px) {
    .hero h1 {
        font-size: 3.85rem;
        margin-bottom: 1vh;
    }
    .hero p.subtitle {
        font-size: 1.75rem;
        line-height: 2.25rem;
        margin-bottom: 4rem;
    }
    .hero p.subtitle span {

        width: 100%;
        font-size: 1.85rem;
    }
    .hero p.desc1 {
        font-size: 1.25rem;
        margin-bottom: 7vh;
    }
    .hero p.desc2 {
        font-size: 1.35rem;
        letter-spacing: normal;
        margin-bottom: 3.5vh;
    }
    .hero p.desc2 span {
        font-size: 1.5rem;
    }
    .hero-btns img {
        width: 75%;
    }
    .button {
        font-size: 1.5rem;
    }
    .button-right img {
        display: none;
    }
    .section {
        padding: 40px 20px;
    }
    .section-title {
        margin-bottom: 3vh;
    }
    .process-grid {
        width: 100%;
        grid-template-columns: 1fr;
        text-align: left;
    }
    .process-grid::after {
        display: none;
    }
    .process-card .icon-box {
        width: 45%;
    }
    .process-card {
        display: flex;
        align-items: center;
        gap: 12px;
    }
    .process-card button.btn-cta {
        width: 80%;
        font-size: 1.5rem;
    }
    .video-swiper .swiper-slide.swiper-slide-active iframe {
        transform: scale(2.75);
        transform-origin: center center;
    }
    .video-swiper {
        margin: 12vh auto;
    }
    .section-title h2 {
        font-size: 2.5rem;
    }
    .section-title p {
        font-size: 1.25rem;
    }
    .page-header h1 {
        font-size: 3.5rem;
    }
    .fixed-cta-container img {
        width: 22vw;
    }
    .solutions-grid .icon-box {
        width: 70%;
    }
    .solutions-header p {
        font-size: 1.5rem;
        margin-bottom: 8vh;
    }
    .notice-box {
        margin-bottom: -5vh;
    }
    .category-card h3 {
        font-size: 2.25rem;
    }
    .category-card p {
        font-size: 1.1rem;
    }
    .solutions-grid .category-card > div.d-flex.justify-content-center {
        margin-top: 0;
    }
    .cat-tag {
        font-size: 0.9rem;
    }
    .result-content {
        max-width: 80%;
    }
    .result-icon {
        width: 20vw;
    }
    .achievement-section .container {
        max-width: 100%;
        padding: 0;
    }
    .achievement-section .container .dashboard-card {
        padding: 4vh 0;
    }
    .archive-header {
        padding: 8vh 4vw;
    }
    .archive-header p {
        font-size: 1.45rem;
    }
    .toggle-btn.active {
        font-size: 1.5rem;
    }
    .toggle-btn {
        font-size: 1.25rem;
    }
    .achievement-section {
        margin-top: -12vh;
    }
    .map-content {
        gap: 4vw;
    }
    .map-text-en {
        font-size: 1rem;
        line-height: 1.2rem;
    }
    .map-text-zh {
        font-size: 0.8rem;
    }
    .map-dot_first {
        top: 33%;
        left: 67%;
    }
    .map-dot_second {
        top: 27%;
        left: 48%;
    }
    .map-dot_third {
        top: 36%;
        left: 13%;
    }
    .map-dot_fourth {
        top: 56%;
        left: 23%;
    }
    .map-dot_fifth {
        top: 50%;
        left: 47%;
    }
    .map-dot_sixth {
        top: 56%;
        left: 87%;
    }
    .map-dot_7 {
        width: 6rem;
        height: 6rem;
    }
    .map-dot_5 {
        width: 4rem;
        height: 4rem;
    }
    .map-dot_4 {
        width: 3rem;
        height: 3rem;
    }
    .btn-cta img {
        width: 5vw;
    }
}

@media screen and (max-width: 440px) {
    .hero h1 {
        font-size: 3.25rem;
        margin-bottom: 1.4vh;
    }
    #events-section #data-container #data-list li h3.data-title {
        font-size: 2rem;
    }
    .button {
        font-size: 1.2rem;
    }
    .fixed-cta-container img {
        width: 25vw;
    }
    .apply-cta h3 {
        font-size: 3rem;
    }
    .apply-cta p {
        font-size: 1.25rem;
    }
    .apply-cta .btn-cta {
        font-size: 1.35rem;
    }
    .btn-submit {
        width: 100%;
    }
    .result-content {
        max-width: 96%;
        padding: 4vh 2vh;
    }
    .result-icon {
        width: 25vw;
    }
    .consulting-header .consulting-main {
        width: 60vw;
    }
    .page-header h1 {
        font-size: 3rem;
    }
    .page-header p {
        font-size: 1.5rem;
        margin-bottom: 8vh;
    }
    .solutions-header .solutions-main {
        width: 60vw;
    }
    .archive-header img {
        width: 70vw;
    }
    .toggle-btn {
        font-size: 1.2rem;
    }
    .toggle-btn.active {
        font-size: 1.5rem;
    }
    .toggle-container {
        margin-bottom: 0;
    }
    .year-title-block h2 {
        font-size: 2rem;
    }
    .from-transparent {
        display: none;
    }
    .map-title {
        font-size: 1.5rem;
        margin-bottom: 0;
    }
    .map-total {
        font-size: 2.75rem;
        margin-bottom: 1vh;
    }
    #year2025 .space-y-4 {
        margin: 2vh auto 1vh;
    }
    #year2025 .map-label {
        font-size: 1.1rem;
    }
    #year2025 .map-value {
        font-size: 1.5rem;
    }
    #year2025 .p-6 {
        padding: 0.75rem 1.5rem;
    }
    #year2025 .rounded-\[2\.5rem\] {
        border-radius: 1.5rem;
    }
    #year2025 .h-\[500px\] {
        height: 300px;
    }
    .map-text-en {
        font-size: 0.9rem;
        line-height: 1rem;
    }
    .map-text-zh {
        font-size: 0.75rem;
        line-height: 1rem;
    }
    .map-dot_7 {
        width: 5rem;
        height: 5rem;
    }
    .map-dot_5 {
        width: 3rem;
        height: 3rem;
    }
    .map-dot_4 {
        width: 2rem;
        height: 2rem;
    }
    .btn-cta img {
        width: 6vw;
    }
    .main-video {
        border-radius: 8px;
    }
    
    .video-item {
        padding: 0.5rem;
        border-radius: 8px;
    }
    .video-swiper .swiper-button-prev,
    .video-swiper .swiper-button-next {
        width: 36px;
    }
    
    .video-swiper .swiper-button-prev::after,
    .video-swiper .swiper-button-next::after {
        font-size: 16px;
    }
}