.elementor-3582 .elementor-element.elementor-element-40f2116{--display:flex;--min-height:400px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3582 .elementor-element.elementor-element-40f2116:not(.elementor-motion-effects-element-type-background), .elementor-3582 .elementor-element.elementor-element-40f2116 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://vilacogroup.vn/wp-content/uploads/2026/08/vilaco-banner-scaled.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3582 .elementor-element.elementor-element-ddf2b17 .elementor-heading-title{font-family:var( --e-global-typography-346b81a-font-family ), Sans-serif;font-size:var( --e-global-typography-346b81a-font-size );font-weight:var( --e-global-typography-346b81a-font-weight );line-height:var( --e-global-typography-346b81a-line-height );color:var( --e-global-color-b2d82aa );}.elementor-3582 .elementor-element.elementor-element-8cb1f7c{--display:flex;--padding-top:48px;--padding-bottom:48px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3582 .elementor-element.elementor-element-8cb1f7c{--content-width:1200px;}}@media(min-width:1025px){.elementor-3582 .elementor-element.elementor-element-40f2116:not(.elementor-motion-effects-element-type-background), .elementor-3582 .elementor-element.elementor-element-40f2116 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}}@media(max-width:1024px){.elementor-3582 .elementor-element.elementor-element-ddf2b17 .elementor-heading-title{font-size:var( --e-global-typography-346b81a-font-size );line-height:var( --e-global-typography-346b81a-line-height );}.elementor-3582 .elementor-element.elementor-element-8cb1f7c{--padding-top:24px;--padding-bottom:24px;--padding-left:24px;--padding-right:24px;}}@media(max-width:767px){.elementor-3582 .elementor-element.elementor-element-40f2116{--min-height:150px;}.elementor-3582 .elementor-element.elementor-element-ddf2b17 .elementor-heading-title{font-size:var( --e-global-typography-346b81a-font-size );line-height:var( --e-global-typography-346b81a-line-height );}}/* Start custom CSS for html, class: .elementor-element-e99f18d *//* Timeline "Quá trình phát triển" — dán vào Elementor → Site Settings → Custom CSS
   (hoặc Custom CSS của trang). Breakpoint theo Elementor: tablet ≤1024px, mobile ≤767px. */

.hd-timeline {
	--hd-tl-primary: #8a1538;                  /* màu chính: năm, chấm */
	--hd-tl-year-faded: rgba(138, 21, 56, 0.48); /* năm dọc bên trái */
	--hd-tl-first-dot: #ff1f1f;                /* chấm mốc đầu tiên */
	--hd-tl-first-dot-ring: #ffb3b3;
	--hd-tl-line: #e5e5e5;                     /* đường kẻ dọc */
	--hd-tl-divider: #dddddd;                  /* đường kẻ ngang giữa các mốc */
	--hd-tl-text: #000000;
	--hd-tl-font: "Manrope", sans-serif;

	--hd-tl-item-padding: 32px;                /* khoảng cách trên/dưới mỗi mốc */
	--hd-tl-year-col: 70px;                    /* cột năm dọc */
	--hd-tl-image-size: 170px;                 /* ảnh vuông */
	--hd-tl-gap: 32px;
	--hd-tl-year-vertical-size: 40px;
	--hd-tl-year-size: 30px;
	--hd-tl-desc-size: 15px;
	--hd-tl-dot-size: 10px;
	--hd-tl-first-dot-size: 14px;
	--hd-tl-image-radius: 8px;

	margin: 0;
	padding: 0;
	font-family: var(--hd-tl-font);
	list-style: none;
}

.hd-timeline :is(time, span, p) {
	font-family: inherit;
}

.hd-timeline__item {
	display: grid;
	grid-template-columns: 2fr 1fr;
	align-items: center;
	margin: 0;
	padding: var(--hd-tl-item-padding) 0;
	border-top: 1px solid var(--hd-tl-divider);
}

.hd-timeline__item:last-child {
	border-bottom: 1px solid var(--hd-tl-divider);
}

/* Cột trái: năm dọc | ảnh | mô tả */
.hd-timeline__main {
	display: grid;
	grid-template-columns: var(--hd-tl-year-col) var(--hd-tl-image-size) 1fr;
	align-items: center;
	gap: var(--hd-tl-gap);
	padding-right: var(--hd-tl-gap);
}

.hd-timeline__year-vertical {
	justify-self: center;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	color: var(--hd-tl-year-faded);
	font-size: var(--hd-tl-year-vertical-size);
	font-weight: 700;
	line-height: 1;
}

.hd-timeline__image {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--hd-tl-image-radius);
}

.hd-timeline__desc {
	margin: 0;
	color: var(--hd-tl-text);
	font-size: var(--hd-tl-desc-size);
	line-height: 1.5;
}

/* Cột phải: đường kẻ dọc + chấm + năm */
.hd-timeline__side {
	position: relative;
	display: flex;
	align-items: center;
	align-self: stretch;
	min-height: var(--hd-tl-image-size);
	padding-left: var(--hd-tl-gap);
}

.hd-timeline__side::before {
	content: "";
	position: absolute;
	top: calc(-1 * var(--hd-tl-item-padding));
	bottom: calc(-1 * var(--hd-tl-item-padding));
	left: 0;
	width: 1px;
	background: var(--hd-tl-line);
}

.hd-timeline__side::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: var(--hd-tl-dot-size);
	height: var(--hd-tl-dot-size);
	background: var(--hd-tl-primary);
	border-radius: 50%;
	transform: translate(-50%, -50%);
}

.hd-timeline__item:first-child .hd-timeline__side::after {
	width: var(--hd-tl-first-dot-size);
	height: var(--hd-tl-first-dot-size);
	background: var(--hd-tl-first-dot);
	border: 3px solid var(--hd-tl-first-dot-ring);
	box-sizing: content-box;
}

.hd-timeline__year {
	color: var(--hd-tl-primary);
	font-size: var(--hd-tl-year-size);
	font-weight: 700;
	line-height: 1;
	text-shadow: 0 8px 10px rgba(0, 0, 0, 0.16);
}

/* Tablet ≤1024px */
@media (max-width: 1024px) {
	.hd-timeline {
		--hd-tl-item-padding: 28px;
		--hd-tl-year-col: 56px;
		--hd-tl-image-size: 140px;
		--hd-tl-gap: 24px;
		--hd-tl-year-vertical-size: 34px;
		--hd-tl-year-size: 26px;
	}
}

/* Mobile ≤767px: ẩn cột phải, năm dọc là mốc chính */
@media (max-width: 767px) {
	.hd-timeline {
		--hd-tl-item-padding: 24px;
		--hd-tl-year-col: 48px;
		--hd-tl-image-size: 100px;
		--hd-tl-gap: 14px;
		--hd-tl-year-vertical-size: 28px;
		--hd-tl-desc-size: 14px;
	}

	.hd-timeline__item {
		grid-template-columns: 1fr;
	}

	.hd-timeline__main {
		padding-right: 0;
	}

	.hd-timeline__side {
		display: none;
	}
}

/* Mobile nhỏ ≤400px */
@media (max-width: 400px) {
	.hd-timeline {
		--hd-tl-year-col: 36px;
		--hd-tl-image-size: 80px;
		--hd-tl-gap: 12px;
		--hd-tl-year-vertical-size: 24px;
		--hd-tl-desc-size: 13px;
	}
}/* End custom CSS */