@charset "utf-8";
/* CSS Document */
:root {
 --primary-green: #b9d228;
 --mid-green: #73913c; /*748f3c*/
 --dark-green: #526b1c;/*1f4909*/
 --light-bg: #f4f7f2;
}
.f-smail {
	font-family: Arial, Helvetica;
	font-size:4.2rem;
	font-weight:900;
	display: inline-block; /* 必須加上這行，位移才會生效 */
    transform: translateY(2px); /* 正數往下，負數往上。請依視覺需求調整 2px 或 3px */	
	}
.f-smailsub {
	font-size:1.25rem;
	font-weight:300;
	}
@media (max-width: 991.98px) {
.f-smail {
	font-family: Arial, Helvetica;
	font-size:2.5rem;
	font-weight:900;
	display: inline-block; /* 必須加上這行，位移才會生效 */
    transform: translateY(2px); /* 正數往下，負數往上。請依視覺需求調整 2px 或 3px */	
	}	
.f-smailsub {
	font-size:1.1rem;
	font-weight:300;
	}
#case .border-end {
        border-right: none !important;
    }
}
.bg-gray {
	 background-color:#F4F4F4;
	 }
.bg-core {
	 background-color:#f9fbf8;
	 }
.bignum {
	font-size:1.8rem;
	font-weight:600;
	color:#a2cc0d;
	}
@media (max-width: 991.98px) {
	
    /* 手機版選單展開時的背景微調或間距 */
    .navbar-collapse {
        padding-top: 0.8rem;
        padding-bottom: 0.8rem;
		background-color: #73913c; /* 子選單底色*/
		margin-top: 10px; /* 與上方 LOGO 區塊拉開一點距離 */
        margin-left: -12px;  /* 數值通常對應 container 的 padding-left */
        margin-right: -12px; /* 數值通常對應 container 的 padding-right */
        padding-left: 10px;  /* 重新補回文字內距，讓字不要貼邊 */
        padding-right: 10px;
    }
    
    .navbar-nav .nav-link {
        padding: 0.8rem 0; /* 增加點擊區域 */
        border-bottom: 1px solid rgba(255,255,255,0.1); /* 增加輕微的分隔線 */
    }
    .navbar-nav .nav-link::after {
        display: none !important;
        content: none !important;
    }

	
    .navbar-nav .nav-item:last-child .nav-link {
        border-bottom: none;
    }
	.navbar-nav .active {
	color: #ffc000 !important; /* 文字同步變色 [cite: 8] */
}
.navbar-toggler {
    border: none !important;        /* 移除外框線 */
    background: transparent !important; /* 確保背景透明 */
    padding: 0 5px 0 0;                     /* 移除內距，讓三條線更俐落 */
}
	/* 移除漢堡選單按鈕點擊時的藍色外框 */
.navbar-toggler:focus {
    text-decoration: none;
    outline: none;
	box-shadow: none !important; /* 徹底移除外框 */
}
}	 

@media (min-width: 992px) {
/* 導覽列連結基礎設定 */
.navbar-nav .nav-link {
	position: relative;
	padding-bottom: 5px;
	margin: 0 10px;
	transition: color 0.3s ease;
	color: #f4f7f2 !important;
}
/* 製作滑過時的底線動態 */
.navbar-nav .nav-link::after {
	content: '';
	position: absolute;
	width: 0;
	height: 1px;
	bottom: 0;
	left: 50%;
	background-color: #ffc000; /* 使用您指定的企業色綠色 [cite: 8] */
	transition: all 0.3s ease;
	transform: translateX(-50%); /* 讓底線從中間向兩旁擴散 */
}
/* 滑過時狀態 */
.navbar-nav .nav-link:hover::after {
	width: 100%; /* 長度補滿 */
}
.navbar-nav .nav-link:hover {
	color: #ffc000 !important; /* 文字同步變色 [cite: 8] */
}
.navbar-nav .active {
	color: #ffc000 !important; /* 文字同步變色 [cite: 8] */
}
}
/* 視差滾動效果 */
.parallax-section {
	position: relative;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 40vh;
	display: flex;
	align-items: center;
	color: white;
}
.hero-banner {
	background-image: linear-gradient(rgba(82, 107, 28, 0.8), rgba(31, 73, 9, 0.8)),  url('../images/bg04.jpg');
	height: 55vh;
}
.gateway-banner {
	background-image: linear-gradient(rgba(82, 107, 28, 0.8), rgba(31, 73, 9, 0.8)),  url('../images/bg14.jpg');
	height: 55vh;
}
.stats-divider {
	background-image: linear-gradient(rgba(84, 134, 61, 0.7), rgba(82, 107, 28, 0.7)),  url('../images/bg18.jpg');
	min-height: 550px;/*550px*/
}
@media (max-width: 991.98px) {
.hero-banner {
	background-image: linear-gradient(rgba(82, 107, 28, 0.8), rgba(31, 73, 9, 0.8)),  url('../images/bg04.jpg');
	height: 70vh;
}
.gateway-banner {
	background-image: linear-gradient(rgba(82, 107, 28, 0.8), rgba(31, 73, 9, 0.8)),  url('../images/bg14.jpg');
	height: 90vh;
}
.stats-divider {
	height: auto; 
        min-height: auto;
}
}
#core {
	background-image: url('../images/bg19b.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	}
#core .border-end {
	opacity:0.1;}
/* 內容樣式 */
.section-title {
	color: #305918;
	font-weight: 700;
	margin-bottom: 3rem;
	 position: relative;
    padding-bottom: 12px; /* 為底線留出空間 */
    margin-bottom: 30px; /* 與下方內容的間距 */
    text-align: center;
}
.section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%); /* 確保底線居中 */
    width: 126px; /* 底線寬度，可依喜好調整 */
    height: 2px; /* 底線粗細 */
    background-color: #b9d228; /* 使用您的企業綠色 */
    border-radius: 2px; /* 讓底線兩端稍微圓潤，增加質感 */
}
.bg-light-green {
	background-color: var(--light-bg);
}
.case-box {
	background: rgba(255,255,2255,0.3); /*linear-gradient(to bottom, #f2f2f2 0%,#eeeeee 100%)*/
	box-shadow: 0 4px 12px rgba(0,0,0,0.06);
	border-radius: 8px;
	padding: 1rem;
	}
.feature-box {
	background: #fff; /*linear-gradient(to bottom, #f2f2f2 0%,#eeeeee 100%)*/
	border-radius: 8px;
	padding: 2rem;
	border-bottom: 0px solid var(--primary-green);
	box-shadow: 0 5px 10px rgba(0,0,0,0.1);
	transition: 0.3s;
	height: 100%;
}
.feature-box:hover {
    transform: translateY(-10px);
	background: #fafff0; /*linear-gradient(to bottom, #fafff0 0%,#f9fbf8 100%)*/
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}


/* 標題與內文層次 */
.feature-box h4 {
    color: #236d21; /* 深綠色標題，增加重量感  */
    line-height: 1.4;
}

.feature-box p {
    line-height: 1.7;
   text-align: justify;  /* 文字兩端對齊，更規整 */
}
.btn-main {
	font-size: 1.2rem;
	font-weight: 600;
	background: #f4ba19;;
	color: white;
	padding: 10px 24px;
	margin-right: 1rem;
	border-radius: 4px;
	text-decoration: none;
	transition: 0.3s;
	text-shadow: 0px 1px 2px rgba(0,0,0,0.08);
}
.btn-main:hover {
	background-color: #FC3;
	color: white;
}

.faq-card {
	border: none;
	background: #fff;
	margin-bottom: 1rem;
	border-left: 4px solid var(--mid-green);
}
.case-table {
	background: white;
	border-radius: 15px;
	overflow: hidden;
}
.case-table th {
	background: var(--dark-green);
	color: white;
	border: none;
}
.metric-box {
	background: #fff;
	padding: 30px;
	border-radius: 15px;
	position: relative;
	overflow: hidden;
}
.metric-number {
	font-size: 2.5rem;
	font-weight: 800;
	color: #1f4909; /* 您指定的企業深綠 */
}
