.hhf-homepage-extra {
				overflow: hidden;
			}

			.hhf-homepage-extra * {
				box-sizing: border-box;
			}

			.hhf-section {
				padding: 64px 24px;
			}

			.hhf-section__inner {
				max-width: 1140px;
				margin: 0 auto;
			}

			.hhf-section__eyebrow {
				display: inline-block;
				font-family: 'Be Vietnam Pro', sans-serif;
				font-weight: 600;
				font-size: 13px;
				letter-spacing: 0.08em;
				text-transform: uppercase;
				color: var( --mai-am-primary );
				background: var( --mai-am-primary-soft );
				padding: 6px 14px;
				border-radius: 999px;
				margin-bottom: 14px;
			}

			.hhf-section__title {
				font-family: 'Lora', Georgia, serif;
				font-weight: 700;
				font-size: clamp( 26px, 3.4vw, 36px );
				color: var( --mai-am-primary-dark );
				margin: 0 0 12px;
			}

			.hhf-section__subtitle {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-size: 16px;
				line-height: 1.6;
				color: var( --mai-am-ink-soft );
				max-width: 620px;
				margin: 0 0 40px;
			}

			.hhf-section__header {
				text-align: center;
				margin: 0 auto 8px;
			}

			.hhf-section__header .hhf-section__subtitle {
				margin-left: auto;
				margin-right: auto;
			}

			/* -----------------------------------------------------
			   Roofline divider — mô-típ "mái nhà" dùng để tách các
			   dải màu, thay cho một đường kẻ thẳng vô hồn.
			----------------------------------------------------- */

			.hhf-roofline {
				display: block;
				width: 100%;
				height: 40px;
				margin-bottom: -1px;
			}

			.hhf-roofline--flip {
				transform: rotate( 180deg );
			}

			/* -----------------------------------------------------
			   1. Trust stats band
			----------------------------------------------------- */

			.hhf-stats-band {
				background: var( --mai-am-primary-dark );
				padding: 8px 24px 40px;
			}

			.hhf-stats-grid {
				max-width: 1140px;
				margin: 0 auto;
				display: grid;
				grid-template-columns: repeat( 4, 1fr );
				gap: 24px;
				text-align: center;
			}

			.hhf-stat__number {
				font-family: 'Lora', Georgia, serif;
				font-weight: 700;
				font-size: clamp( 26px, 3vw, 34px );
				color: #FFFFFF;
				display: block;
			}

			.hhf-stat__label {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-size: 14px;
				color: #CFE3D8;
				margin-top: 4px;
				display: block;
			}

			/* -----------------------------------------------------
			   2. Vì sao chọn Mái Ấm — feature cards
			----------------------------------------------------- */

			.hhf-feature-grid {
				display: grid;
				grid-template-columns: repeat( 4, 1fr );
				gap: 20px;
			}

			.hhf-feature-card {
				background: var( --mai-am-surface );
				border: 1px solid var( --mai-am-border );
				border-radius: 16px;
				padding: 28px 22px;
				transition: transform 0.18s ease, box-shadow 0.18s ease;
			}

			.hhf-feature-card:hover {
				transform: translateY( -4px );
				box-shadow: 0 12px 24px rgba( 30, 111, 83, 0.1 );
			}

			.hhf-feature-icon {
				width: 44px;
				height: 44px;
				border-radius: 12px;
				background: var( --mai-am-primary-soft );
				color: var( --mai-am-primary );
				display: flex;
				align-items: center;
				justify-content: center;
				margin-bottom: 16px;
			}

			.hhf-feature-icon svg {
				width: 22px;
				height: 22px;
			}

			.hhf-feature-card h3 {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-weight: 700;
				font-size: 17px;
				color: var( --mai-am-ink );
				margin: 0 0 8px;
			}

			.hhf-feature-card p {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-size: 14.5px;
				line-height: 1.6;
				color: var( --mai-am-ink-soft );
				margin: 0;
			}

			/* -----------------------------------------------------
			   3. Cách hoạt động — 2 hành trình song song
			----------------------------------------------------- */

			.hhf-how-it-works {
				background: var( --mai-am-primary-soft );
			}

			.hhf-track-grid {
				display: grid;
				grid-template-columns: 1fr 1fr;
				gap: 32px;
			}

			.hhf-track {
				background: var( --mai-am-surface );
				border-radius: 20px;
				padding: 32px 28px;
				border-top: 4px solid var( --mai-am-primary );
			}

			.hhf-track--helper {
				border-top-color: var( --mai-am-cta );
			}

			.hhf-track__title {
				font-family: 'Lora', Georgia, serif;
				font-weight: 700;
				font-size: 20px;
				color: var( --mai-am-primary-dark );
				margin: 0 0 4px;
			}

			.hhf-track--helper .hhf-track__title {
				color: var( --mai-am-cta-dark );
			}

			.hhf-track__desc {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-size: 14px;
				color: var( --mai-am-ink-soft );
				margin: 0 0 24px;
			}

			.hhf-track__steps {
				list-style: none;
				margin: 0;
				padding: 0;
				position: relative;
			}

			.hhf-track__steps li {
				position: relative;
				padding-left: 44px;
				padding-bottom: 24px;
				font-family: 'Be Vietnam Pro', sans-serif;
			}

			.hhf-track__steps li:last-child {
				padding-bottom: 0;
			}

			.hhf-track__steps li::before {
				content: attr( data-step );
				position: absolute;
				left: 0;
				top: 0;
				width: 30px;
				height: 30px;
				border-radius: 50%;
				background: var( --mai-am-primary );
				color: #FFFFFF;
				font-weight: 700;
				font-size: 13px;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.hhf-track--helper .hhf-track__steps li::before {
				background: var( --mai-am-cta );
			}

			.hhf-track__steps li:not( :last-child )::after {
				content: '';
				position: absolute;
				left: 14px;
				top: 30px;
				bottom: 0;
				width: 2px;
				background: repeating-linear-gradient(
					to bottom,
					var( --mai-am-border ) 0,
					var( --mai-am-border ) 4px,
					transparent 4px,
					transparent 9px
				);
			}

			.hhf-track__steps strong {
				display: block;
				font-size: 15.5px;
				color: var( --mai-am-ink );
				margin-bottom: 3px;
			}

			.hhf-track__steps span {
				font-size: 14px;
				line-height: 1.55;
				color: var( --mai-am-ink-soft );
			}

			.hhf-track__cta {
				margin-top: 24px;
			}

			/* -----------------------------------------------------
			   4. Dịch vụ nổi bật — chip / shortcut cards
			----------------------------------------------------- */

			.hhf-chip-grid {
				display: grid;
				grid-template-columns: repeat( 5, 1fr );
				gap: 16px;
			}

			.hhf-chip-card {
				display: flex;
				flex-direction: column;
				align-items: center;
				gap: 10px;
				text-align: center;
				text-decoration: none;
				background: var( --mai-am-surface );
				border: 1px solid var( --mai-am-border );
				border-radius: 16px;
				padding: 22px 12px;
				transition: border-color 0.18s ease, transform 0.18s ease;
			}

			.hhf-chip-card:hover {
				border-color: var( --mai-am-primary );
				transform: translateY( -3px );
			}

			.hhf-chip-card .hhf-feature-icon {
				margin-bottom: 0;
			}

			.hhf-chip-card span {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-weight: 600;
				font-size: 13.5px;
				color: var( --mai-am-ink );
			}

			/* -----------------------------------------------------
			   5. Đánh giá
			----------------------------------------------------- */

			.hhf-testimonial-grid {
				display: grid;
				grid-template-columns: repeat( 3, 1fr );
				gap: 20px;
			}

			.hhf-testimonial-card {
				background: var( --mai-am-surface );
				border: 1px solid var( --mai-am-border );
				border-radius: 16px;
				padding: 26px 24px;
			}

			.hhf-testimonial-stars {
				color: var( --mai-am-accent );
				font-size: 15px;
				letter-spacing: 2px;
				margin-bottom: 12px;
			}

			.hhf-testimonial-quote {
				font-family: 'Lora', Georgia, serif;
				font-style: italic;
				font-size: 15.5px;
				line-height: 1.65;
				color: var( --mai-am-ink );
				margin: 0 0 18px;
			}

			.hhf-testimonial-author {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-weight: 600;
				font-size: 14px;
				color: var( --mai-am-primary-dark );
			}

			.hhf-testimonial-role {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-size: 13px;
				color: var( --mai-am-ink-soft );
			}

			/* -----------------------------------------------------
			   6. CTA tuyển người giúp việc
			----------------------------------------------------- */

			.hhf-recruit-band {
				background: var( --mai-am-cta );
				text-align: center;
			}

			.hhf-recruit-band .hhf-section__title,
			.hhf-recruit-band .hhf-section__subtitle {
				color: #FFFFFF;
			}

			.hhf-recruit-band .hhf-section__subtitle {
				color: #FBEAD2;
				margin-left: auto;
				margin-right: auto;
			}

			.hhf-recruit-band .hhf-section__eyebrow {
				background: rgba( 255, 255, 255, 0.16 );
				color: #FFFFFF;
			}

			.hhf-recruit-band .hhf-helper-call-button {
				background-color: #FFFFFF !important;
				border-color: #FFFFFF !important;
				color: var( --mai-am-cta-dark ) !important;
			}

			/* -----------------------------------------------------
			   7. FAQ
			----------------------------------------------------- */

			.hhf-faq-list {
				max-width: 780px;
				margin: 0 auto;
			}

			.hhf-faq-item {
				background: var( --mai-am-surface );
				border: 1px solid var( --mai-am-border );
				border-radius: 12px;
				padding: 4px 22px;
				margin-bottom: 14px;
			}

			.hhf-faq-item summary {
				cursor: pointer;
				list-style: none;
				padding: 18px 0;
				font-family: 'Be Vietnam Pro', sans-serif;
				font-weight: 600;
				font-size: 15.5px;
				color: var( --mai-am-ink );
				display: flex;
				align-items: center;
				justify-content: space-between;
				gap: 12px;
			}

			.hhf-faq-item summary::-webkit-details-marker {
				display: none;
			}

			.hhf-faq-item summary::after {
				content: '+';
				font-size: 22px;
				color: var( --mai-am-primary );
				flex-shrink: 0;
				transition: transform 0.18s ease;
			}

			.hhf-faq-item[open] summary::after {
				transform: rotate( 45deg );
			}

			.hhf-faq-item p {
				font-family: 'Be Vietnam Pro', sans-serif;
				font-size: 14.5px;
				line-height: 1.65;
				color: var( --mai-am-ink-soft );
				margin: 0 0 18px;
			}

			/* -----------------------------------------------------
			   8. Final CTA
			----------------------------------------------------- */

			.hhf-final-cta {
				background: var( --mai-am-primary );
				text-align: center;
			}

			.hhf-final-cta .hhf-section__title {
				color: #FFFFFF;
			}

			.hhf-final-cta .hhf-section__subtitle {
				color: #E4F0EA;
				margin-left: auto;
				margin-right: auto;
			}

			.hhf-final-cta .hhf-helper-call-button {
				background-color: var( --mai-am-cta ) !important;
				border-color: var( --mai-am-cta ) !important;
			}

			/* -----------------------------------------------------
			   Responsive
			----------------------------------------------------- */

			@media ( max-width: 900px ) {

				.hhf-stats-grid,
				.hhf-feature-grid,
				.hhf-testimonial-grid {
					grid-template-columns: repeat( 2, 1fr );
				}

				.hhf-track-grid {
					grid-template-columns: 1fr;
				}

				.hhf-chip-grid {
					grid-template-columns: repeat( 3, 1fr );
				}
			}

			@media ( max-width: 560px ) {

				.hhf-section {
					padding: 44px 18px;
				}

				.hhf-stats-grid,
				.hhf-feature-grid,
				.hhf-testimonial-grid,
				.hhf-chip-grid {
					grid-template-columns: 1fr;
				}
			}

			@media ( prefers-reduced-motion: reduce ) {

				.hhf-feature-card,
				.hhf-chip-card {
					transition: none;
				}
			}
