/* 通用超連結基底 (排除 .btn 按鈕) */
a:not(.btn):link,
a:not(.btn):visited {
    color: #e11d48; /* 質感玫瑰紅 */
    text-decoration: none;
    position: relative;
    font-weight: 500;
    transition: color 0.2s ease-in-out;
}

/* 懸停時的底線滑出效果 (唯獨 .btn 不會有這條線) */
a:not(.btn)::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -2px;
    left: 0;
    background-color: #be123c;
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

a:not(.btn):hover {
    color: #be123c;
}

a:not(.btn):hover::after {
    width: 100%; /* 底線展開 */
}

a:not(.btn):active {
    color: #9f1239;
}





/* 按鈕通用基底 */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    box-sizing: border-box; /* 確保 padding 不會額外撐大寬度 */
    max-width: 100%; /* 限制最大寬度不得超出父容器 */
    white-space: normal; /* 若文字極長允許自動斷行，或用 nowrap + 配合 RWD */
    text-align: center;
}


/* 主要按鈕 (下載) - 亮色漸層 + 青藍色陰影 */
.btn-primary {
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    color: #000;
    box-shadow: 0 4px 15px rgba(0, 242, 254, 0.3);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 242, 254, 0.5);
    filter: brightness(1.1);
}

/* 次要按鈕 (教學說明) - 半透明白色 + 白灰色陰影 (屬性完全一致) */
.btn-secondary {
    background: rgba(255, 255, 255, 0.12);
    color: var(--text-main);
    box-shadow: 0 4px 15px rgba(255, 255, 255, 0.15);
}

.btn-secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 255, 255, 0.3);
    filter: brightness(1.1);
}




/* 手機與小視窗優化 (螢幕寬度 480px 以下) */
@media (max-width: 480px) {
    .btn {
        width: 100%; /* 小螢幕時直接佔滿容器，視覺更整齊 */
        padding: 10px 16px; /* 縮小內距 */
        font-size: 0.95rem; /* 稍微調小字級 */
    }
}

/* RWD 手機版適應 (螢幕寬度小於 768px) */
@media (max-width: 768px) {
    .hero-section {
        padding: 50px 16px 40px;
    }

    .hero-title {
        font-size: 2.1rem;
    }

    .hero-subtitle {
        font-size: 1rem;
    }

    .cta-buttons {
        flex-direction: column;
        width: 100%;
    }

    .btn {
        width: 100%;
    }
}

.btn-trial {
    display: inline-block;
    padding: 12px 30px;
    font-size: 16px;
    font-weight: 600;
    color: #000000 !important; /* 強制文字黑色 */
    text-decoration: none !important;
    background-color: #34d399 !important; /* 強制背景綠色 */
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(52, 211, 153, 0.3);
    transition: all 0.2s ease;
    text-align: center;
    position: relative;
}

/*  1：強制清除全域 a::after 底線對按鈕的干擾 */
.btn-trial::after,
.btn-trial:hover::after {
    display: none !important;
    content: none !important;
}

/*  2：確保按鈕點擊過後 (:visited) 與 滑鼠懸停 (:hover) 都不會被全域紅字影響 */
.btn-trial:visited {
    color: #000000 !important;
    background-color: #34d399 !important;
}

.btn-trial:hover {
    color: #000000 !important; /* 確保懸停時依然保持黑字 */
    background-color: #10b981 !important; /* 懸停時加深綠色 */
    box-shadow: 0 6px 16px rgba(16, 185, 129, 0.4);
    transform: translateY(-1px);
}

.btn-trial:active {
    color: #000000 !important;
    transform: translateY(0);
}


.powered-by,
.powered-by * {
    background: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.powered-by {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 0.5rem;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* ：針對連結設定防護 */
.powered-by a,
.powered-by a:visited {
    color: #3b82f6 !important; /* 強制藍色，防止點擊後變紅/變紫 */
    font-weight: 600;
    text-decoration: none !important;
    transition: color 0.2s ease-in-out;
}

/* 強制清除全域 a::after 底線對此連結的干擾 */
.powered-by a::after,
.powered-by a:hover::after {
    display: none !important;
    content: none !important;
}

.powered-by a:hover {
    color: #1d4ed8 !important; /* 滑鼠懸停時加深藍色 */
}

.powered-by a:active {
    color: #1e40af !important;
}