/* =========================================
       Page Specific CSS (Home Hero)
       ========================================= */
    .home-hero {
    	position: relative;
    	min-height: 100vh;
    	display: flex;
    	align-items: center;
    	justify-content: center;
    	background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../image/index/top/fv.jpeg");
    	background-size: cover;
    	background-position: center;
    	color: var(--white);
    	margin-top: -70px;
    	padding-top: 70px;
    }

    .home-hero__content {
    	width: 100%;
    	text-align: center;
    }

    .home-hero__title {
    	font-size: clamp(32px, 5vw, 60px);
    	/* text-4xl md:text-6xl */
    	font-weight: 700;
    	margin-bottom: 24px;
    	/* mb-6 */
    	line-height: 1.2;
    	/* leading-tight */
    }

    .home-hero__title-highlight {
    	color: var(--white);
    	/* If special styling needed for span */
    }

    .home-hero__desc {
    	font-size: clamp(16px, 2.5vw, 24px);
    	/* text-xl md:text-2xl */
    	margin-bottom: 32px;
    	/* mb-8 */
    	max-width: 768px;
    	/* max-w-3xl */
    	margin-left: auto;
    	margin-right: auto;
    	line-height: 1.6;
    }

    .home-hero__actions {
    	display: flex;
    	flex-direction: column;
    	gap: 16px;
    	/* gap-4 */
    	justify-content: center;
    	align-items: center;
    }

    @media (min-width: 640px) {
    	.home-hero__actions {
    		flex-direction: row;
    	}
    }

    .home-hero__btn {
    	white-space: nowrap;
    	padding: 16px 32px;
    	/* px-8 py-4 */
    	font-size: 18px;
    	/* text-lg */
    	font-weight: 500;
    	border-radius: 8px;
    	/* rounded-lg */
    	display: inline-flex;
    	align-items: center;
    	justify-content: center;
    	transition: all 0.3s ease;
    	cursor: pointer;
    	border: none;
    }

    .home-hero__btn--primary {
    	background-color: var(--primary-color);
    	/* bg-emerald-500 */
    	color: var(--white);
    	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    	/* shadow-lg */
    }

    .home-hero__btn--primary:hover {
    	background-color: #059669;
    	/* hover:bg-emerald-600 */
    	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    	/* hover:shadow-xl */
    }

    .home-hero__btn--secondary {
    	background-color: transparent;
    	border: 2px solid var(--white);
    	/* border-white */
    	color: var(--white);
    	/* text-white */
			padding: 12px 28px;
    }

    .home-hero__btn--secondary:hover {
    	background-color: var(--white);
    	/* hover:bg-white */
    	color: #111827;
    	/* hover:text-gray-900 */
    }

    @media (max-width: 600px) {
    	.home-hero__btn {
    		font-size: 16px;
    	}
    }

    /* =========================================
			       NEW: Services Section (BEM: home-services)
			       ========================================= */
    .home-services {
    	padding: 80px 0;
    	/* py-20 */
    	background-color: rgb(235, 245, 240);
    }

    @media (max-width: 600px) {

			.home-services {
				padding: 50px 0;
			}
		}

    .home-services__header {
    	text-align: center;
    	margin-bottom: 64px;
    	/* mb-16 */
    }

		@media (max-width: 600px) {
			.home-services__header {
				margin-bottom: 44px;
			}
		}

    .home-services__title {
    	font-size: clamp(30px, 4vw, 38px);
    	/* text-3xl md:text-4xl */
    	font-weight: 700;
    	color: var(--text-main);
    	margin-bottom: 16px;
    	/* mb-4 */
    }

    .home-services__desc {
    	font-size: 20px;
    	/* text-xl */
    	color: var(--text-light);
    	/* text-gray-600 */
    	/* max-width: 768px; */
    	/* max-w-3xl */
    	/* margin: 0 auto; */
    }

    @media (max-width: 600px) {
    	.home-services__desc {
    		font-size: 16px;
    	}
    }

    .home-services__grid {
    	display: grid;
    	grid-template-columns: 1fr;
    	gap: 32px;
    	/* gap-8 */
    }

    @media (min-width: 1024px) {
    	.home-services__grid {
    		grid-template-columns: repeat(3, 1fr);
    		/* lg:grid-cols-3 */
    	}
    }

    /* Card Component */
    .home-services__card {
    	background-color: var(--white);
    	border-radius: 12px;
    	/* rounded-xl */
    	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    	/* shadow-lg */
    	overflow: hidden;
    	transition: box-shadow 0.3s ease;
    	display: flex;
    	flex-direction: column;
    }


    /* Highlight Card (First item) */
    .home-services__card--highlight {
    	box-shadow: 0 0 0 2px var(--primary-color), 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    }

    .home-services__badge {
    	background-color: var(--primary-color);
    	/* bg-emerald-500 */
    	color: var(--white);
    	text-align: center;
    	padding: 8px 0;
    	/* py-2 */
    	font-size: 14px;
    	/* text-sm */
    	font-weight: 600;
    }

    .home-services__image-wrapper {
    	position: relative;
    	height: 192px;
    	/* h-48 */
    }

    .home-services__image {
    	width: 100%;
    	height: 100%;
    	object-fit: cover;
    	object-position: top;
    }

    .home-services__content {
    	padding: 24px;
    	/* p-6 */
    	display: flex;
    	flex-direction: column;
    	flex-grow: 1;
    }

    .home-services__card-title {
    	font-size: 20px;
    	/* text-xl */
    	font-weight: 700;
    	color: var(--text-main);
    	margin-bottom: 12px;
    	/* mb-3 */
    }

    .home-services__card-desc {
    	color: var(--text-light);
    	/* text-gray-600 */
    	margin-bottom: 16px;
    	/* mb-4 */
    	font-size: 14px;
    	line-height: 1.6;
    }

    .home-services__list {
    	display: flex;
    	flex-direction: column;
    	gap: 8px;
    	/* space-y-2 */
    	margin-bottom: 24px;
    	/* mb-6 */
    	margin-top: auto;
    	/* Push to bottom if content is short */
    }

    .home-services__list-item {
    	display: flex;
    	align-items: center;
    	font-size: 14px;
    	/* text-sm */
    	color: #374151;
    	/* text-gray-700 */
    }

    .home-services__icon {
    	color: var(--primary-color);
    	/* text-emerald-600 */
    	margin-right: 8px;
    	/* mr-2 */
    }

    .home-services__btn-wrapper {
    	margin-top: auto;
    }

    .home-services__btn {
    	width: 100%;
    	display: inline-flex;
    	align-items: center;
    	justify-content: center;
    	padding: 12px 24px;
    	/* px-6 py-3 */
    	font-size: 16px;
    	/* text-base */
    	font-weight: 500;
    	border-radius: 8px;
    	/* rounded-lg */
    	transition: all 0.3s ease;
    	cursor: pointer;
    	border: none;
    	background-color: var(--primary-color);
    	/* bg-emerald-500 */
    	color: var(--white);
    	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    }

    .home-services__btn:hover {
    	background-color: #059669;
    	/* hover:bg-emerald-600 */
    	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    }

    .home-services__btn i {
    	margin-left: 8px;
    }

    /* =========================================
			       NEW: About Section (BEM: home-about)
			       ========================================= */
    .home-about {
    	padding: 80px 0;
    	/* py-20 */
    	background-color: var(--white);
    }

		@media (max-width: 600px) {
			.home-about {
				padding: 60px 0;
			}
		}

    .home-about__grid {
    	display: grid;
    	grid-template-columns: 1fr;
    	gap: 48px;
    	/* gap-12 */
    	align-items: center;
    }

    @media (min-width: 1024px) {
    	.home-about__grid {
    		grid-template-columns: repeat(2, 1fr);
    		/* lg:grid-cols-2 */
    	}
    }

    /* Image Side */
    .home-about__image-wrapper {
    	position: relative;
    }

    .home-about__image {
    	width: 100%;
    	border-radius: 12px;
    	/* rounded-xl */
    	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    	/* shadow-lg */
    	object-fit: cover;
    	object-position: top;
    }

    .home-about__badge {
    	position: absolute;
    	top: -24px;
    	/* -top-6 */
    	left: -24px;
    	/* -left-6 */
    	background-color: var(--primary-color);
    	/* bg-emerald-500 */
    	color: var(--white);
    	padding: 16px;
    	/* p-4 */
    	border-radius: 12px;
    	/* rounded-xl */
    	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    	/* shadow-lg */
    	text-align: center;
    }

    .home-about__badge-value {
    	font-size: 24px;
    	/* text-2xl */
    	font-weight: 700;
    	line-height: 1;
    	display: block;
    }

    .home-about__badge-label {
    	font-size: 14px;
    	/* text-sm */
    }

    /* Text Side */
    .home-about__title {
    	font-size: clamp(28px, 4vw, 38px);
    	/* text-3xl md:text-4xl */
    	font-weight: 700;
    	color: var(--text-main);
    	margin-bottom: 24px;
    	/* mb-6 */
    }

    .home-about__desc {
    	font-size: 18px;
    	/* text-lg */
    	color: var(--text-light);
    	/* text-gray-600 */
    	margin-bottom: 32px;
    	/* mb-8 */
    	line-height: 1.6;
    }

    .home-about__highlight {
    	font-weight: normal;
    	/* keep as is from request, though styling suggests bold usually */
    }

    .home-about__list {
    	display: flex;
    	flex-direction: column;
    	gap: 24px;
    	/* space-y-6 */
    	margin-bottom: 32px;
    	/* mb-8 */
    }

    .home-about__item {
    	display: flex;
    	align-items: flex-start;
    }

    .home-about__icon-box {
    	width: 48px;
    	/* w-12 */
    	height: 48px;
    	/* h-12 */
    	border-radius: 8px;
    	/* rounded-lg */
    	background-color: #ecfdf5;
    	/* rgb(235, 245, 240) */
    	display: flex;
    	align-items: center;
    	justify-content: center;
    	margin-right: 16px;
    	/* mr-4 */
    	flex-shrink: 0;
    }

    .home-about__icon {
    	font-size: 20px;
    	/* text-xl */
    	color: var(--primary-color);
    	/* text-emerald-600 */
    }

    .home-about__item-title {
    	font-weight: 600;
    	color: var(--text-main);
    	margin-bottom: 8px;
    	/* mb-2 */
    }

    .home-about__item-text {
    	color: var(--text-light);
    	/* text-gray-600 */
    	font-size: 16px;
    }

    .home-about__btn {
    	display: flex;
			max-width: 330px;
			width: 100%;
			margin-inline: auto;
    	align-items: center;
    	justify-content: center;
    	padding: 12px 32px;
    	/* px-8 py-4 */
    	font-size: 18px;
    	/* text-lg */
    	border-radius: 8px;
    	/* rounded-lg */
    	border: 2px solid var(--primary-color);
    	/* border-emerald-600 */
    	color: var(--primary-color);
    	/* text-emerald-600 */
    	background-color: transparent;
    	transition: all 0.3s ease;
    	cursor: pointer;
    	font-weight: 500;
    }

    .home-about__btn:hover {
    	background-color: var(--primary-color);
    	/* hover:bg-emerald-600 */
    	color: var(--white);
    	/* hover:text-white */
    }

    .home-about__btn i {
    	margin-left: 8px;
    	/* ml-2 */
    }

    /* =========================================
       NEW: Achievements Section (BEM: home-achievements)
       ========================================= */
    .home-achievements {
    	padding: 80px 0;
    	/* py-20 */
    	background-color: rgb(235, 245, 240);
    }

		@media (max-width: 600px) {
			.home-achievements {
				padding: 50px 0;
			}
		}

    .home-achievements__header {
    	text-align: center;
    	margin-bottom: 64px;
    	/* mb-16 */
    }

		@media (max-width: 600px) {
			.home-achievements__header {
				margin-bottom: 44px;
			}
		}

    .home-achievements__title {
    	font-size: 30px;
    	/* text-3xl */
    	font-weight: 700;
    	color: var(--text-main);
    	margin-bottom: 16px;
    	/* mb-4 */
    }

    @media (min-width: 768px) {
    	.home-achievements__title {
    		font-size: 38px;
    		/* md:text-4xl */
    	}
    }

    .home-achievements__desc {
    	font-size: 20px;
    	/* text-xl */
    	color: var(--text-light);
    	/* text-gray-600 */
    }

		@media (max-width: 600px) {
			.home-achievements__desc {
				font-size: 16px;
			}
		}

    .home-achievements__grid {
    	display: grid;
    	grid-template-columns: 1fr;
    	gap: 32px;
    	/* gap-8 */
    	margin-bottom: 48px;
    	/* mb-12 is roughly 48px */
    }

    @media (min-width: 768px) {
    	.home-achievements__grid {
    		grid-template-columns: repeat(3, 1fr);
    		/* md:grid-cols-3 */
    	}
    }

    .home-achievements__card {
    	background-color: var(--white);
    	border-radius: 12px;
    	/* rounded-xl */
    	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    	/* shadow-lg */
    	padding: 24px;
    	/* p-6 */
    	transition: box-shadow 0.3s ease;
			display: flex;
			flex-direction: column;
    }

    .home-achievements__logo-wrapper {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	margin-bottom: 24px;
    	/* mb-6 */
    }

    .home-achievements__logo {
    	height: 64px;
    	/* h-16 */
    	object-fit: contain;
    }

    .home-achievements__card-title {
    	font-weight: 700;
    	/* font-bold */
    	color: var(--text-main);
    	/* text-gray-900 */
    	text-align: center;
    	margin-bottom: 16px;
			min-height: 2.7em;
			line-height: 1.5;
			display: flex;
			align-items: center;
			justify-content: center;
    }

	@media (max-width: 600px) {
		.home-achievements__card-title {
			min-height: auto;
		}
	}

    .home-achievements__badge-wrapper {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	margin-bottom: 16px;
    	/* mb-4 */
    }

    .home-achievements__badge {
    	padding: 4px 12px;
    	/* px-3 py-1 */
    	border-radius: 9999px;
    	/* rounded-full */
    	font-size: 14px;
    	/* text-sm */
    	font-weight: 600;
    	/* font-semibold */
    	background-color: rgb(235, 245, 240);
    	color: rgb(46, 149, 104);
    }

    .home-achievements__quote {
    	color: var(--text-light);
    	/* text-gray-600 */
    	margin-bottom: 16px;
    	/* mb-4 */
    	text-align: center;
    	font-style: normal;
    	/* reset italic if blockquote default */
    }

    .home-achievements__cite-wrapper {
    	text-align: center;
			margin-top: auto;
    }

    .home-achievements__cite {
    	font-size: 14px;
    	/* text-sm */
    	color: #6b7280;
    	/* text-gray-500 */
    	font-style: normal;
    	/* not-italic */
    }

    .home-achievements__footer {
    	text-align: center;
    	margin-top: 48px;
    	/* mt-12 */
    }

    .home-achievements__footer-text {
    	font-size: 18px;
    	/* text-lg */
    	color: var(--text-light);
    	/* text-gray-600 */
    	margin-bottom: 24px;
    	/* mb-6 */
    }

    .home-achievements__logo-list {
    	display: flex;
    	flex-wrap: wrap;
    	justify-content: center;
    	align-items: center;
    	gap: 32px;
    	/* gap-8 */
    	opacity: 0.6;
    }

    .home-achievements__logo-item {
    	color: #6b7280;
    	/* text-gray-500 */
    	font-weight: 600;
    	/* font-semibold */
    }