/* 1. 跳過主內容連結 */
.skip-link {
	position: absolute; top: -100px; left: 0; background: #000; color: #fff;
	padding: 10px 20px; z-index: 5000; text-decoration: none; transition: top 0.3s;
}
.skip-link:focus { top: 0; }

.accesskey-marker {
    text-decoration: none;
    color: inherit;
    font-size: 0.875rem;
    margin-right: 8px; /* 稍微增加右邊距 */
    display: inline-block;
    min-width: 35px;    /* 增加最小寬度以容納字母 */
    min-height: 24px;
    text-align: center; /* 讓文字置中 */
}
/* 確保 Accesskey 在獲得焦點時也清晰可見 */
.accesskey-marker:focus {
    outline: 3px solid #ffbf47;
    background-color: #000;
    color: #fff !important;
}
.visually-hidden-text {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;
}

.navbar .accesskey-marker { color: #ffffff !important; }

body { padding-top: 56px; line-height: 1.6; background-color: #f8f9fa; }

/* Banner 樣式 */
/*
.hero-banner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('../images/banner-bg.png');
	background-size: cover; background-position: center; background-repeat: no-repeat;
	min-height: 400px; display: flex; align-items: flex-end;
}
.hero-banner .container {
	background-image: url('../images/school-title.png');
	background-size: min(100%, 600px) auto; background-position: left bottom 50px; 
	background-repeat: no-repeat; min-height: 250px; width: 100%;
}*/

/* 修改後的 Banner 樣式 */
.hero-banner {
    /* 這裡保留純裝飾性的背景底圖 (校景) */
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('../images/banner-bg.png');
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat;
    min-height: 400px; 
    display: flex; 
    align-items: flex-end;
    padding-bottom: 50px; /* 增加底部間距，維持原有的視覺位置 */
}

.hero-banner .container {
    /* 移除原本的背景圖相關屬性，因為已改用 HTML 標籤 */
    background-image: none; 
    min-height: auto; /* 不再需要固定高度撐開背景 */
    width: 100%;
}

/* 新增圖片樣式控制 */
.banner-title-img {
    /* 參考原 CSS 中的 min(100%, 600px) 設定 */
    /*max-width: 600px;*/
    max-width: min(100%, 600px);
    width: 100%;
    height: auto;
    display: block;
}

/* 輪播區塊樣式 */
.carousel-container { margin-top: 10px; margin-bottom: 10px;}
.carousel-item img { width: 100%; height: auto; display: block; border-radius: 4px; }

.carousel-controls-extra { position: absolute; bottom: 20px; right: 20px; z-index: 15; }
.btn-pause {
	background: rgba(0,0,0,0.7); color: white; border: 2px solid #fff;
	padding: 8px 16px; border-radius: 4px; font-weight: bold;
}

/* 內容區塊樣式 */
.content-section { 
	padding: 50px 0; background-color: #ffffff; border-radius: 8px;
	box-shadow: 0 2px 15px rgba(0,0,0,0.05);
}

/* 焦點強化：符合 AA 級可視化焦點要求 */
/*a:focus, button:focus, .btn:focus, [tabindex="0"]:focus {
	outline: 3px solid #ffbf47 !important; outline-offset: 2px; box-shadow: none !important;
}*/
/* 深藍色對比度較佳 */
/*a:focus, button:focus, .btn:focus, [tabindex="0"]:focus {
	outline: 3px solid #0056b3 !important;
    outline-offset: 2px;
}*/
/* 建議改用對比更鮮明的顏色，或使用黑白雙色輪廓線 */
a:focus, button:focus, .btn:focus, [tabindex="0"]:focus {
    outline: 2px solid #ffffff !important;
    box-shadow: 0 0 0 4px #000000 !important;
    outline-offset: 0;
}

footer { background-color: #212529; color: white; }
.footer-link { color: #adb5bd; text-decoration: none; }
.footer-link:hover, .footer-link:focus { color: #fff; text-decoration: underline; }
.footer-policy-list { list-style: none; padding: 0; margin: 0; }
.footer-policy-list li { display: inline-block; }
.footer-policy-list li:not(:last-child)::after { content: "|"; color: #495057; margin: 0 10px; }


.card-header.bg-primary { background-color: #546680 !important; }