body.home {
	--bella-blue:      #0F4F9E;
	--bella-blue-dark: #0B3D7C;
	--bella-blue-soft: #E7F0FB;
	--bella-sky:       #2E9FD4;
	--bella-sky-soft:  #E4F3FB;
	--bella-mint:      #2FA9B4;
	--bella-mint-soft: #E2F4F5;

	--bella-ink:    #10263F;
	--bella-muted:  #5C6B7E;
	--bella-line:   #DEE8F2;
	--bella-tint:   #EDF4FC;

	/* Hero ground. A near-white with just enough blue in it to read as a band
	   against the white section under it - the separation the first pass drew
	   with a white arc across the bottom edge, done with one flat colour. */
	--bella-paper:       #F5F9FD;
	--bella-panel:       #E4EFFA;
	--bella-white:       #FFFFFF;
	--bella-line-strong: #CBDCEE;
	
	--bella-chevron: #8794A5;

	--bella-radius:    24px;
	--bella-radius-sm: 16px;
	--bella-radius-btn: 12px;

	--bella-shadow-sm: 0 2px 10px rgba(16, 38, 63, .05);
	--bella-shadow:    0 20px 40px -22px rgba(16, 38, 63, .30);
	--bella-shadow-lg: 0 30px 56px -28px rgba(15, 79, 158, .42);
	/* Was an 18px tinted glow. A button that hovers over the page is a web
	   button; one that sits on it is a control. */
	--bella-shadow-btn: 0 1px 2px rgba(15, 79, 158, .28);

	--bella-dur:  .2s;
	--bella-ease: cubic-bezier(.22, .61, .36, 1);

	--bella-gradient:  linear-gradient(118deg, #0D4589 0%, #12609F 52%, #1E86B4 100%);

	
	--bella-scrim: linear-gradient(140deg,
		rgba(8, 38, 76, .94) 0%,
		rgba(12, 62, 124, .90) 55%,
		rgba(16, 84, 142, .88) 100%);
	--bella-on-dark-soft: #E3EDF8;

	
	--theme-color-text_link:   #0F4F9E;
	--theme-color-text_hover:  #0B3D7C;
	--theme-color-alter_link:  #0F4F9E;
	--theme-color-alter_hover: #0B3D7C;
}

body.home .scheme_default,
body.home .scheme_light {
	--theme-color-text_link:    #0F4F9E;
	--theme-color-text_hover:   #0B3D7C;
	--theme-color-alter_link:   #0F4F9E;
	--theme-color-alter_hover:  #0B3D7C;
}

/* Stuck reveals */
body.home .elementor-invisible,
body.home .trx_addons_invisible {
	visibility: visible !important;
	opacity: 1 !important;
}

/* Buttons */
body.home .elementor-element-7aea6c3 .sc_button,
body.home .elementor-element-02e9f44 .sc_button,
body.home .elementor-element-a528770 a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 17px 32px;
	border: none;
	border-radius: var(--bella-radius-btn);
	background: var(--bella-blue);
	color: var(--bella-white);
	font-size: 15.5px;
	font-weight: 600;
	letter-spacing: -.01em;
	line-height: 1.2;
	text-decoration: none;
	box-shadow: var(--bella-shadow-btn);
	transition: background-color var(--bella-dur) var(--bella-ease),
	            box-shadow var(--bella-dur) var(--bella-ease),
	            transform var(--bella-dur) var(--bella-ease);
}
body.home .elementor-22242 .elementor-element.elementor-element-02e9f44 .sc_button {
	background: var(--bella-blue);
	color: var(--bella-white);
}
body.home .elementor-element-7aea6c3 .sc_button:hover,
body.home .elementor-element-02e9f44 .sc_button:hover,
body.home .elementor-element-a528770 a:hover {
	background: var(--bella-blue-dark);
	color: var(--bella-white);
	transform: translateY(-1px);
	box-shadow: 0 6px 14px -6px rgba(15, 79, 158, .5);
}
body.home .elementor-22242 .elementor-element.elementor-element-02e9f44 .sc_button:hover {
	background: var(--bella-blue-dark);
	color: var(--bella-white);
}
/* The ring has to be visible against both the white paper and the blue fill,
   and it must not animate in. */
body.home .elementor-element-7aea6c3 .sc_button:focus-visible,
body.home .elementor-element-02e9f44 .sc_button:focus-visible,
body.home .elementor-element-a528770 a:focus-visible {
	outline: 2px solid var(--bella-blue-dark);
	outline-offset: 3px;
	transition: none;
}

/* Hero */
body.home .elementor-22242 .elementor-element.elementor-element-51314d5 {
	position: relative;
	overflow: hidden;
	padding: 112px 0 104px;
	background: var(--bella-paper);
	background-image: none;
}

@media (min-width: 1024px) {
	body.home .elementor-22242 .elementor-element.elementor-element-99fade0 {
		width: 55%;
	}
	body.home .elementor-22242 .elementor-element.elementor-element-d4f88da {
		width: 45%;
	}
}

/* Eyebrow. Still a chip, but a hairline one on the paper rather than a white
   pill with an inset ring and a mint dot - the dot was the page's third accent
   spent on decoration. */
body.home .elementor-element-58e9b6a .sc_item_subtitle {
	display: inline-flex;
	align-items: center;
	margin-bottom: 26px;
	padding: 8px 16px;
	border-radius: 999px;
	background: transparent;
	box-shadow: inset 0 0 0 1px var(--bella-line-strong);
	color: var(--bella-blue);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
}

body.home .elementor-element-58e9b6a .sc_item_title {
	max-width: 15ch;
	color: var(--bella-ink);
	font-size: clamp(2.35rem, 3.5vw + .95rem, 3.9rem);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -.035em;
	text-wrap: balance;
	overflow-wrap: anywhere;
	min-width: 0;
}

/* The lede the fold was missing. Held to about 44 characters so it stays two
   lines at most — the headline dominates, the lede supports. */
body.home .bella-hero-lede {
	max-width: 44ch;
	margin: 0;
	color: var(--bella-muted);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: -.005em;
}

/* The call button is the secondary of the pair: same shape, white surface,
   hairline instead of a fill, with the number itself carrying the weight. */
body.home .elementor-22242 .elementor-element.elementor-element-7aea6c3 .sc_button.color_style_link2 {
	background: var(--bella-white);
	color: var(--bella-ink);
	box-shadow: inset 0 0 0 1px var(--bella-line-strong);
}
body.home .elementor-22242 .elementor-element.elementor-element-7aea6c3 .sc_button.color_style_link2:hover {
	background: var(--bella-white);
	color: var(--bella-blue);
	box-shadow: inset 0 0 0 1px rgba(15, 79, 158, .45);
}
body.home .elementor-22242 .elementor-element.elementor-element-7aea6c3 .sc_button.color_style_link2 .sc_button_title::before {
	content: "";
	display: inline-block;
	width: 17px;
	height: 17px;
	margin-right: 9px;
	vertical-align: -3px;
	background: var(--bella-blue);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11.4 11.4 0 0 0 3.6.58 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.4 11.4 0 0 0 .58 3.6 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11.4 11.4 0 0 0 3.6.58 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.4 11.4 0 0 0 .58 3.6 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.home .bella-hero-proof {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 40px;
	margin: 0;
	padding-top: 30px;
	border-top: 1px solid var(--bella-line);
}
body.home .bella-hero-proof__item {
	display: flex;
	flex-direction: column;
	gap: 3px;
}
body.home .bella-hero-proof__n {
	color: var(--bella-ink);
	font-size: 25px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -.03em;
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum" 1;
}
body.home .bella-hero-proof__l {
	color: var(--bella-muted);
	font-size: 14px;
	line-height: 1.35;
}

/* The vertical rhythm of the left column lives in three Elementor spacers.
   Setting them here keeps the steps in one place instead of three panels of
   the builder; they stay editable there if a value needs to change. */
body.home .elementor-22242 .elementor-element.elementor-element-3639d1e .elementor-spacer-inner { height: 22px; }
body.home .elementor-22242 .elementor-element.elementor-element-487a365 .elementor-spacer-inner { height: 32px; }
body.home .elementor-22242 .elementor-element.elementor-element-411a7ae .elementor-spacer-inner { height: 34px; }

body.home .elementor-element-8617d4a .elementor-widget-container {
	position: relative;
}
body.home .elementor-element-8617d4a .elementor-widget-container::before {
	content: "";
	position: absolute;
	left: 3%;
	right: 3%;
	top: 15%;
	bottom: 0;
	border-radius: var(--bella-radius);
	background: linear-gradient(168deg, var(--bella-panel) 0%, var(--bella-blue-soft) 100%);
	box-shadow: inset 0 0 0 1px var(--bella-line-strong);
}
body.home .elementor-element-8617d4a img {
	position: relative;
	z-index: 1;
	display: block;
	margin: 0 auto;
	filter: drop-shadow(0 22px 34px rgba(16, 38, 63, .20));
}

/* Name plate. The photo was already the doctor; it just never said so. A white
   card on the panel's lower edge, with the accent carried by a short bar
   rather than another coloured tile. */
body.home .elementor-22242 .elementor-element.elementor-element-d4f88da > .elementor-widget-wrap {
	position: relative;
}
body.home .bella-hero-doctor-w {
	position: absolute;
	z-index: 2;
	left: -2%;
	bottom: 7%;
	width: max-content;
	max-width: 84%;
}
body.home .bella-hero-doctor {
	position: relative;
	padding: 15px 22px 15px 24px;
	border-radius: var(--bella-radius-sm);
	background: var(--bella-white);
	box-shadow: var(--bella-shadow), inset 0 0 0 1px var(--bella-line);
	text-align: left;
}
body.home .bella-hero-doctor::before {
	content: "";
	position: absolute;
	left: 0;
	top: 18px;
	bottom: 18px;
	width: 3px;
	border-radius: 0 3px 3px 0;
	background: var(--bella-blue);
}
body.home .bella-hero-doctor__name {
	display: block;
	color: var(--bella-ink);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.02em;
}
body.home .bella-hero-doctor__role {
	display: block;
	margin-top: 3px;
	color: var(--bella-muted);
	font-size: 13.5px;
	line-height: 1.35;
}

/* Trust strip (scripts/hero-premium.php) */
body.home .bella-trust {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	margin: -52px auto 0;
	padding: 30px 12px;
	border-radius: var(--bella-radius);
	background: var(--bella-white);
	box-shadow: 0 1px 2px rgba(16, 38, 63, .04),
	            0 20px 44px -32px rgba(16, 38, 63, .40),
	            inset 0 0 0 1px var(--bella-line);
	position: relative;
	z-index: 3;
}
body.home .bella-trust__item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 4px 22px;
	text-align: left;
	min-width: 0;
}
body.home .bella-trust__item + .bella-trust__item {
	border-left: 1px solid var(--bella-line);
}
body.home .bella-trust__icon {
	flex: 0 0 auto;
	margin-top: 1px;
	color: var(--bella-blue);
	font-size: 26px;
	line-height: 1;
}
body.home .bella-trust__title {
	display: block;
	color: var(--bella-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -.015em;
}
body.home .bella-trust__text {
	display: block;
	margin-top: 4px;
	color: var(--bella-muted);
	font-size: 13px;
	line-height: 1.4;
}

/* Section headings */

body.home .elementor-22242 .sc_align_center .sc_item_subtitle,
body.home .elementor-22242 .sc_title .sc_item_subtitle {
	color: var(--bella-blue);
	font-weight: 600;
	letter-spacing: 1.6px;
}
body.home .elementor-element-0d576aa .sc_item_subtitle,
body.home .elementor-element-3d90c56 .sc_item_subtitle {
	display: inline-block;
	position: relative;
	padding: 0 30px;
}
/* Short rules either side, in the two accent colours. */
body.home .elementor-element-0d576aa .sc_item_subtitle::before,
body.home .elementor-element-0d576aa .sc_item_subtitle::after,
body.home .elementor-element-3d90c56 .sc_item_subtitle::before,
body.home .elementor-element-3d90c56 .sc_item_subtitle::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 20px;
	height: 2px;
	border-radius: 2px;
	background: var(--bella-sky);
}
body.home .elementor-element-0d576aa .sc_item_subtitle::before,
body.home .elementor-element-3d90c56 .sc_item_subtitle::before { left: 0; }
body.home .elementor-element-0d576aa .sc_item_subtitle::after,
body.home .elementor-element-3d90c56 .sc_item_subtitle::after { right: 0; }

body.home .elementor-22242 .sc_title .sc_item_title { color: var(--bella-ink); }

body.home .elementor-element-0d576aa .sc_item_title,
body.home .elementor-element-c47e0b1 .sc_item_title,
body.home .elementor-element-3d90c56 .sc_item_title {
	font-size: 42px;
	line-height: 1.16em;
	letter-spacing: -1px;
}

/* Services directory */
body.home .bella-svc-lede-w {
	max-width: 42ch;
	margin: 0 auto;
	color: var(--bella-muted);
	font-size: 0.9375rem;
	line-height: 1.6;
	text-align: center;
}

/* The lists run 2 to 5 items, so the panels have to bottom out level with each
   other or the row looks unfinished. row-gap is for the wrapped layouts below;
   Elementor's own column gap is horizontal only. */

body.home .elementor-element-5b7a3c1 > .elementor-container {
	align-items: flex-start;
	row-gap: 30px;
}
body.home .elementor-element-5b7a3c1 > .elementor-container > .elementor-column {
	width: 25%;
	min-width: 0;
	display: flex;
}
body.home .elementor-element-5b7a3c1 .elementor-widget-wrap {
	align-content: stretch;
}
body.home .bella-svc,
body.home .bella-svc > .elementor-widget-container {
	display: flex;
	flex-direction: column;
	width: 100%;
}

body.home .bella-svc > .elementor-widget-container {
	/* The widget is a column flex box, so its only child has to be told to grow
	   or the stretch coming down from the row stops one level short. */
	padding: 20px 0 0;
	
	text-align: left;
	border-top: 1px solid var(--bella-line-strong);
}

body.home .bella-svc__icon {
	display: block;
	margin-bottom: 14px;
	color: var(--bella-blue);
	font-size: 32px;
	line-height: 1;
}
body.home .bella-svc__name {
	margin: 0 0 4px;
	color: var(--bella-ink);
	font-size: 1.1875rem;
	font-weight: 600;
	letter-spacing: -.4px;
	line-height: 1.3;
}

body.home .bella-svc__list {
	margin: 0;
	padding: 0;
	list-style: none;
	flex: 1 0 auto;
}
body.home .bella-svc__list li {
	margin: 0;
	padding: 0;
	list-style: none;
}
/* A hairline between rows and none under the last, so the group reads as an
   index rather than a paragraph of links. */
body.home .bella-svc__list li + li a {
	border-top: 1px solid var(--bella-line);
}
/* Block, not inline: the whole row is the target. At 15px/1.5 plus the padding
   that is a 46px hit area, which is what makes it usable on a phone. */
body.home .bella-svc__list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 11px 0;
	color: var(--bella-ink);
	font-size: .9375rem;
	font-weight: 500;
	line-height: 1.5;
	text-decoration: none;
	transition: color var(--bella-dur) var(--bella-ease);
}
/* The chevron is drawn on the row rather than typed into the markup, so what
   the editor sees in the builder is plain link text. */
body.home .bella-svc__list a::after {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	border-right: 1.5px solid var(--bella-chevron);
	border-bottom: 1.5px solid var(--bella-chevron);
	transform: translate(0, 0) rotate(-45deg);
	transition: border-color var(--bella-dur) var(--bella-ease),
	            transform var(--bella-dur) var(--bella-ease);
}
body.home .bella-svc__list a:hover,
body.home .bella-svc__list a:focus-visible {
	color: var(--bella-blue);
}
body.home .bella-svc__list a:hover::after,
body.home .bella-svc__list a:focus-visible::after {
	border-color: var(--bella-blue);
	transform: translate(3px, 0) rotate(-45deg);
}
body.home .bella-svc__list a:focus-visible {
	outline: 2px solid var(--bella-blue-dark);
	outline-offset: 2px;
	transition: none;
}

body.home .bella-svc-all-w {
	margin-top: 30px;
	text-align: center;
}
body.home .bella-svc-all a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 2px;
	color: var(--bella-blue);
	font-size: .9375rem;
	font-weight: 600;
	text-decoration: none;
	box-shadow: inset 0 -1px 0 0 var(--bella-line-strong);
	transition: box-shadow var(--bella-dur) var(--bella-ease);
}
body.home .bella-svc-all a::after {
	content: "\2192";
	transition: transform var(--bella-dur) var(--bella-ease);
}
body.home .bella-svc-all a:hover,
body.home .bella-svc-all a:focus-visible {
	box-shadow: inset 0 -1px 0 0 var(--bella-blue);
}
body.home .bella-svc-all a:hover::after,
body.home .bella-svc-all a:focus-visible::after {
	transform: translateX(3px);
}
body.home .bella-svc-all a:focus-visible {
	outline: 2px solid var(--bella-blue-dark);
	outline-offset: 3px;
	transition: none;
}

@media (max-width: 1199px) {
	body.home .elementor-element-5b7a3c1 > .elementor-container > .elementor-column {
		width: 50%;
	}
}
/* Elementor stacks its own columns at 767, but it does that with an inline
   rule less specific than the 25% above, so the stack has to be restated. */
@media (max-width: 767px) {
	body.home .elementor-element-5b7a3c1 > .elementor-container > .elementor-column {
		width: 100%;
	}
	body.home .bella-svc > .elementor-widget-container {
		padding: 18px 0 0;
	}
	body.home .bella-svc-lede-w {
		font-size: 1rem;
	}
}

/* Đội ngũ bác sĩ */
body.home .elementor-element-b3d7f21 {
	padding: 84px 0 88px;
	
	background-color: var(--bella-paper);
}

body.home .bella-team-lede-w {
	max-width: 48ch;
	margin: 0 auto;
	color: var(--bella-muted);
	font-size: 0.9375rem;
	line-height: 1.6;
	text-align: center;
}

body.home .elementor-element-9f2a5c4 {
	margin-top: 44px;
}
/* The section column carries column_align "center" so the heading and the lede
   centre themselves. Everything below them is a record read down a left edge -
   a centred certificate line has no edge to come back to. */
body.home .elementor-element-9f2a5c4 .elementor-widget-wrap {
	text-align: left;
}

/* --- the photograph tile ------------------------------------------------- */
body.home .bella-team__photo .elementor-widget-container,
body.home .bella-team__photo figure,
body.home .bella-team__photo .elementor-image {
	margin: 0;
	line-height: 0;
}
body.home .bella-team__photo img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	/* The figures stand in the lower two thirds of their own frames; anchored
	   to the top the head keeps its headroom whichever photo is swapped in. */
	object-position: 50% 0%;
	border-radius: var(--bella-radius-sm);
	/* White coats on a near-white ground lose their edges. The tile is a step
	   darker than the section so the cut-out reads as a figure. */
	background-color: var(--bella-panel);
}

/* --- names and roles ----------------------------------------------------- */
body.home .bella-team__name {
	margin: 0;
	color: var(--bella-ink);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -.01em;
	/* A two-line name beside the photograph broke as "CKI. Bs. Nguyễn Văn /
	   Cường", leaving the given name alone on its own line. */
	text-wrap: balance;
}
body.home .bella-team__head .bella-team__name {
	font-size: 1.375rem;
	line-height: 1.3;
}
body.home .bella-team__role {
	margin: 6px 0 0;
	color: var(--bella-muted);
	font-size: .9375rem;
	line-height: 1.5;
}

/* --- the record ---------------------------------------------------------- */
/* Three statements of fact, each one taken off BS. Cường's own profile page.
   Ticks would read as a feature list; hairline rules read as a record, which
   is what this is. */
body.home .bella-team__facts {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--bella-line);
}
body.home .bella-team__facts li {
	position: relative;
	margin: 0;
	padding: 9px 0 9px 20px;
	border-bottom: 1px solid var(--bella-line);
	color: var(--bella-ink);
	font-size: .875rem;
	line-height: 1.5;
}
/* Homepage shows only the headline credential — profile page has the full record. */
body.home .bella-team__facts li:nth-child(n+2) {
	display: none;
}
body.home .bella-team__facts li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 1.2em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--bella-blue);
}

/* --- the profile link ---------------------------------------------------- */

body.home .bella-team__more {
	margin: 14px 0 0;
}
body.home .bella-team__more a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 6px 2px;
	color: var(--bella-blue);
	font-size: .9375rem;
	font-weight: 600;
	text-decoration: none;
	box-shadow: inset 0 -1px 0 0 var(--bella-line-strong);
	transition: box-shadow var(--bella-dur) var(--bella-ease);
}
body.home .bella-team__more a::after {
	content: "\2192";
	transition: transform var(--bella-dur) var(--bella-ease);
}
body.home .bella-team__more a:hover,
body.home .bella-team__more a:focus-visible {
	box-shadow: inset 0 -1px 0 0 var(--bella-blue);
}
body.home .bella-team__more a:hover::after,
body.home .bella-team__more a:focus-visible::after {
	transform: translateX(3px);
}
body.home .bella-team__more a:focus-visible {
	outline: 2px solid var(--bella-blue-dark);
	outline-offset: 3px;
	transition: none;
}

/* --- the roster row ------------------------------------------------------ */
/* Photograph left, name right, a hairline under each but the last: a list of
   people, not three more cards. Elementor's inner section is a flat row of
   four columns, so the three roster ones are re-laid as rows here. */
body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:not(:first-child) .elementor-widget-wrap {
	display: grid;
	grid-template-columns: 116px minmax(0, 1fr);
	align-items: center;
	gap: 0 22px;
}

/* --- the lead card ------------------------------------------------------- */
body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child > .elementor-element-populated {
	padding: 26px 26px 28px;
	border-radius: var(--bella-radius);
	background: var(--bella-white);
	box-shadow: inset 0 0 0 1px var(--bella-line), var(--bella-shadow-sm);
}
body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .elementor-widget-wrap {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	/* The name sits on the photograph's bottom edge rather than its top: the
	   head of the figure and the head of the record then read as one line. */
	align-items: end;
	gap: 26px 26px;
}
body.home .bella-team__photo {
	grid-column: 1;
	grid-row: 1;
}

body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .bella-team__photo img {
	aspect-ratio: 1 / 1;
}
body.home .bella-team__head {
	grid-column: 2;
	grid-row: 1;
}
body.home .bella-team__record {
	grid-column: 1 / -1;
	grid-row: 2;
}

/* --- the two-column split ------------------------------------------------ */
/* The lead spans the three roster rows on the right. Below 1024 the whole
   thing is one column and the lead simply comes first. */
@media (min-width: 1024px) {
	body.home .elementor-element-9f2a5c4 > .elementor-container {
		display: grid;
		grid-template-columns: minmax(0, 45fr) minmax(0, 55fr);
		align-items: start;
		gap: 26px 48px;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column {
		/* Elementor prints the 40/20/20/20 split as .elementor-col-* widths.
		   In the grid the tracks carry the proportions instead. */
		width: auto;
		min-width: 0;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child {
		grid-column: 1;
		grid-row: 1 / span 3;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:not(:first-child) {
		grid-column: 2;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:not(:first-child):not(:last-child) .elementor-widget-wrap {
		padding-bottom: 26px;
		border-bottom: 1px solid var(--bella-line);
	}
}

@media (max-width: 1023px) {
	body.home .elementor-element-9f2a5c4 > .elementor-container {
		row-gap: 26px;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column {
		width: 100%;
		min-width: 0;
	}
	/* On one column the roster rows are the full width of the page, so they
	   need the rule to keep reading as a list rather than three loose items. */
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:not(:last-child) .elementor-widget-wrap {
		padding-bottom: 26px;
		border-bottom: 1px solid var(--bella-line);
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child > .elementor-element-populated {
		border-bottom: 0;
	}
}

@media (min-width: 1024px) and (max-width: 1199px) {
	body.home .elementor-element-9f2a5c4 > .elementor-container {
		column-gap: 32px;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .elementor-widget-wrap {
		grid-template-columns: 150px minmax(0, 1fr);
		gap: 22px 22px;
	}
	body.home .bella-team__head .bella-team__name {
		font-size: 1.25rem;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .elementor-widget-wrap {
		grid-template-columns: 168px minmax(0, 1fr);
	}
	body.home .bella-team__head {
		align-self: center;
	}
}

@media (max-width: 767px) {
	body.home .elementor-element-b3d7f21 {
		padding: 62px 0 66px;
	}
	body.home .bella-team-lede-w {
		font-size: 1rem;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .elementor-widget-wrap {
		grid-template-columns: 150px minmax(0, 1fr);
		gap: 22px 20px;
	}
	body.home .bella-team__head .bella-team__name {
		font-size: 1.25rem;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:not(:first-child) .elementor-widget-wrap {
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 0 18px;
	}
}

@media (max-width: 400px) {
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child > .elementor-element-populated {
		padding: 20px 18px 22px;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .elementor-widget-wrap {
		display: block;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:first-child .bella-team__photo {
		max-width: 132px;
		margin-bottom: 16px;
	}
	body.home .bella-team__record {
		margin-top: 18px;
	}
	body.home .elementor-element-9f2a5c4 > .elementor-container > .elementor-column:not(:first-child) .elementor-widget-wrap {
		grid-template-columns: 84px minmax(0, 1fr);
		gap: 0 15px;
	}
	body.home .bella-team__head .bella-team__name {
		font-size: 1.125rem;
	}
}

/* Booking CTA  (section cd48e97 - see scripts/appointment-cta.php) */
body.home .elementor-22242 .elementor-element.elementor-element-cd48e97 {
	position: relative;
	/* Paints before the photo decodes, and shows through wherever cover
	   leaves the photo short. */
	background-color: var(--bella-blue-dark);
	overflow: hidden;
}
body.home .elementor-22242 .elementor-element.elementor-element-cd48e97::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--bella-scrim);
	pointer-events: none;
}
body.home .elementor-22242 .elementor-element.elementor-element-cd48e97 > .elementor-container {
	position: relative;
	z-index: 1;
}
/* The column is the full width so the scrim is; the measure is set here. */
body.home .elementor-element-a3f6b7b > .elementor-element-populated {
	/* Wide enough that the three facts hold one line at desktop widths; the
	   heading and the lede are measured separately below, so the column being
	   this wide does not widen them. */
	max-width: 820px;
	margin: 0 auto;
	padding: 112px 0 116px;
	text-align: center;
}
body.home .elementor-element-e1ecf7a .sc_title {
	max-width: 700px;
	margin: 0 auto;
}

body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_subtitle {
	color: var(--bella-on-dark-soft);
	margin-bottom: 12px;
}
body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title,
body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title_text {
	color: var(--bella-white);
	font-size: 44px;
	line-height: 1.18em;
	letter-spacing: -1px;
	/* Two lines of roughly equal length; left to itself the second line ran
	   to three words. */
	text-wrap: balance;
}

body.home .elementor-element-dd99ed2 {
	margin-top: 18px;
}
body.home .elementor-element-dd99ed2 p {
	max-width: 33em;
	margin: 0 auto;
	color: var(--bella-on-dark-soft);
	font-size: 1.0625rem;
	line-height: 1.65;
}

/* The shared button rule near the top of this file already turns this link
   into the page's filled control; on the scrim the fill inverts. */
body.home .elementor-element-a528770 {
	margin-top: 34px;
}
body.home .elementor-element-a528770 p {
	margin: 0;
}
body.home .elementor-element-a528770 a {
	background: var(--bella-white);
	color: var(--bella-blue-dark);
	border-bottom: none;
	box-shadow: var(--bella-shadow);
}
body.home .elementor-element-a528770 a:hover,
body.home .elementor-element-a528770 a:focus {
	background: var(--bella-blue-soft);
	color: var(--bella-blue-dark);
}
body.home .elementor-element-a528770 a:focus-visible {
	outline: 2px solid var(--bella-white);
	outline-offset: 3px;
}

body.home .elementor-element-f8a1c36 {
	margin-top: 32px;
}
body.home .elementor-element-f8a1c36 ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}
body.home .elementor-element-f8a1c36 li {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	padding: 0;
	color: var(--bella-on-dark-soft);
	font-size: .9375rem;
	line-height: 1.4;
	text-align: left;
}
/* A drawn tick rather than an icon font or a data URI - it takes its colour
   from the row, so there is no second place to keep in step. */
body.home .elementor-element-f8a1c36 li::before {
	content: "";
	flex: none;
	width: 6px;
	height: 11px;
	margin-top: -3px;
	border: solid currentColor;
	border-width: 0 2px 2px 0;
	border-radius: 1px;
	transform: rotate(45deg);
	opacity: .95;
}

@media (max-width: 1199px) {
	body.home .elementor-element-a3f6b7b > .elementor-element-populated {
		padding: 96px 0 100px;
	}
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title,
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title_text {
		font-size: 40px;
	}
}
@media (max-width: 1023px) {
	body.home .elementor-element-a3f6b7b > .elementor-element-populated {
		max-width: 560px;
		padding: 84px 0 88px;
	}
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title,
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title_text {
		font-size: 34px;
		letter-spacing: -.6px;
	}
	/* Below this the row no longer holds one line, and three facts broken
	   two-and-one read as debris under the button. Stacked on a shared left
	   edge they read as a list. */
	body.home .elementor-element-f8a1c36 ul {
		flex-direction: column;
		align-items: flex-start;
		width: fit-content;
		margin: 0 auto;
		gap: 11px;
	}
}
@media (max-width: 767px) {
	body.home .elementor-element-a3f6b7b > .elementor-element-populated {
		padding: 66px 0 70px;
	}
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title,
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title_text {
		font-size: 30px;
	}
	body.home .elementor-element-dd99ed2 p {
		font-size: 1rem;
	}
	body.home .elementor-element-a528770 {
		margin-top: 28px;
	}
}
@media (max-width: 400px) {
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title,
	body.home .elementor-22242 .elementor-element-e1ecf7a .sc_item_title_text {
		font-size: 26px;
		letter-spacing: -.4px;
	}
	body.home .elementor-element-a3f6b7b > .elementor-element-populated {
		padding: 56px 0 60px;
	}
}

body.home .elementor-22242 .elementor-element-e8b6829 .sc_item_title,
body.home .elementor-22242 .elementor-element-e8b6829 .sc_item_title_text {
	color: var(--bella-ink);
	font-size: 40px;
	line-height: 1.16em;
	letter-spacing: -1px;
}
body.home .elementor-element-e8b6829 .sc_title {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}
@media (max-width: 1023px) {
	body.home .elementor-22242 .elementor-element-e8b6829 .sc_item_title,
	body.home .elementor-22242 .elementor-element-e8b6829 .sc_item_title_text {
		font-size: 32px;
		letter-spacing: -.6px;
	}
}
@media (max-width: 767px) {
	body.home .elementor-22242 .elementor-element-e8b6829 .sc_item_title,
	body.home .elementor-22242 .elementor-element-e8b6829 .sc_item_title_text {
		font-size: 28px;
	}
}

/* Counters */
body.home .elementor-element-09a4f79 .sc_skills {
	position: relative;
	padding: 58px 40px;
	border-radius: var(--bella-radius);
	background: var(--bella-gradient);
	box-shadow: var(--bella-shadow-lg);
	overflow: hidden;
}
body.home .elementor-element-09a4f79 .sc_skills::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(40% 80% at 15% 0%,  rgba(255, 255, 255, .22) 0%, rgba(255, 255, 255, 0) 70%),
		radial-gradient(40% 80% at 85% 100%, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 70%);
	pointer-events: none;
}
body.home .elementor-element-09a4f79 .sc_skills_columns {
	position: relative;
	z-index: 1;
}
body.home .elementor-element-09a4f79 .sc_skills_column + .sc_skills_column .sc_skills_item_wrap {
	border-left: 1px solid rgba(255, 255, 255, .22);
}
body.home .elementor-element-09a4f79 .sc_skills_item_wrap {
	padding: 4px 20px;
}
body.home .elementor-element-09a4f79 .sc_skills_icon,
body.home .elementor-element-09a4f79 .sc_skills_icon::before {
	/* The teal the plugin prints inline sits on the ::before, so colouring the
	   element alone leaves the glyph unreadable on the gradient. */
	color: rgba(255, 255, 255, .92);
	font-size: 40px;
	margin-bottom: 6px;
}
body.home .elementor-element-09a4f79 .sc_skills_total {
	color: #fff;
	letter-spacing: -2px;
}
body.home .elementor-element-09a4f79 .sc_skills_item_title {
	color: rgba(255, 255, 255, .82);
	font-size: 15px;
	letter-spacing: .2px;
}

/* ---------------------------------------------------------------------------
 * "Không còn là nỗi sợ" block
 * ------------------------------------------------------------------------ */

body.home .elementor-element-08c9a5c .sc_item_title {
	font-size: 42px;
	line-height: 1.16em;
	letter-spacing: -1px;
}

body.home .elementor-22242 .elementor-element.elementor-element-c0031a6 > .elementor-element-populated.elementor-widget-wrap {
	padding-left: 48px;
}
body.home .elementor-22242 .elementor-element.elementor-element-08c9a5c > .elementor-widget-container {
	padding-right: 0;
}

/* The photo column is full-bleed and fills this section's whole height, so its
   bottom edge sat directly on the video band below with no seam at all. */
body.home .elementor-22242 .elementor-element.elementor-element-20bd554 {
	padding-bottom: 90px;
}
body.home .elementor-22242 .elementor-element.elementor-element-970f066 > .elementor-element-populated {
	border-radius: var(--bella-radius);
	box-shadow: var(--bella-shadow);
}
/* The eyebrow names the block before the heading contradicts the fear in it. */
body.home .elementor-22242 .elementor-element-08c9a5c .sc_item_subtitle {
	margin-bottom: 14px;
}

/* The lede kept the theme's default text-editor grey (#818387), which is
   3.8:1 on white - under AA for 17px copy. Same correction the other body
   paragraphs on this page already carry. */
body.home .elementor-22242 .elementor-element-7c2ddd3 p {
	color: var(--bella-muted);
	margin-bottom: 0;
}

body.home .bella-journey {
	margin-top: 30px;
}
body.home .bella-journey ol {
	counter-reset: bella-step;
	list-style: none;
	margin: 0;
	padding: 0;
}
body.home .bella-journey li {
	counter-increment: bella-step;
	position: relative;
	padding: 0 0 26px 54px;
	list-style: none;
}
body.home .bella-journey li:last-child {
	padding-bottom: 0;
}
body.home .bella-journey li::before {
	content: counter(bella-step, decimal-leading-zero);
	position: absolute;
	top: 0;
	left: 0;
	width: 34px;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .5px;
	color: var(--bella-blue);
	font-variant-numeric: tabular-nums;
}
/* The join. It starts under the marker and runs to the next one, so the last
   step has no tail hanging off it. */
body.home .bella-journey li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 26px;
	bottom: 4px;
	left: 8px;
	width: 1px;
	background: var(--bella-line);
}
body.home .bella-journey li strong {
	display: block;
	margin-bottom: 4px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--bella-ink);
}
body.home .bella-journey li {
	font-size: 16px;
	line-height: 1.65;
	color: var(--bella-muted);
}

body.home .elementor-22242 .elementor-element.elementor-element-0364af1 .sc_button {
	padding: 0;
	background: none;
	border-radius: 0;
	box-shadow: none;
	color: var(--bella-blue);
	font-weight: 600;
	/* Kept as a block-level target so the 44px minimum is met by padding
	   rather than by the text box alone. */
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
}
/* The same drawn chevron the services rows use, so "go on" looks the same
   wherever the page says it. Two borders on a rotated square - no icon font. */
body.home .elementor-22242 .elementor-element.elementor-element-0364af1 .sc_button::after {
	content: "";
	width: 7px;
	height: 7px;
	border: 1.5px solid var(--bella-blue);
	border-left: 0;
	border-bottom: 0;
	transform: rotate(45deg);
	transition: transform var(--bella-dur) var(--bella-ease);
	background: none;
}
body.home .elementor-22242 .elementor-element.elementor-element-0364af1 .sc_button:hover::after {
	transform: rotate(45deg) translate(2px, -2px);
	border-color: var(--bella-blue-dark);
}
body.home .elementor-22242 .elementor-element.elementor-element-0364af1 .sc_button:hover {
	background: none;
	color: var(--bella-blue-dark);
	text-decoration: underline;
	text-underline-offset: 5px;
}
body.home .elementor-22242 .elementor-element.elementor-element-0364af1 .sc_button:focus-visible {
	outline: 2px solid var(--bella-blue);
	outline-offset: 4px;
	border-radius: 4px;
}

/* Results band - "Nhung nu cuoi da thay doi"  (section be11a01) */
body.home .elementor-22242 .elementor-element.elementor-element-be11a01 {
	background-color: var(--bella-paper);
}

body.home .bella-results-head {
	margin-bottom: 14px;
}
body.home .bella-results-head .sc_item_subtitle {
	margin-bottom: 14px;
}

body.home .bella-results-lede {
	margin-bottom: 52px;
}
body.home .bella-results-lede p {
	max-width: 500px;
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--bella-muted);
}

/* The photo carries the whole tile, so it gets the corner radius and the only
   shadow; no border - the composites already have a blue frame burnt in. */
body.home .bella-case-photo .elementor-widget-container,
body.home .bella-case-photo figure,
body.home .bella-case-photo a {
	display: block;
	margin: 0;
}
body.home .bella-case-photo img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--bella-radius-sm);
	box-shadow: var(--bella-shadow-sm);
	transition: transform var(--bella-dur) var(--bella-ease),
	            box-shadow var(--bella-dur) var(--bella-ease);
}
body.home .bella-case-photo a:hover img {
	transform: translateY(-3px);
	box-shadow: var(--bella-shadow);
}
body.home .bella-case-photo a:focus-visible {
	outline: 2px solid var(--bella-blue);
	outline-offset: 4px;
	border-radius: var(--bella-radius-sm);
}

body.home .bella-case-body {
	margin-top: 18px;
}
body.home .bella-case-body .bella-case-kind {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--bella-blue);
}
body.home .bella-case-body h3 {
	position: relative;
	margin: 0 0 6px;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--bella-ink);
}
body.home .bella-case-body h3 a {
	color: inherit;
	text-decoration: none;
}
/* One line of this heading is 26px tall - under the 44px touch floor. The
   overlay extends the hit area vertically without moving anything or
   inflating the focus ring, which still traces the text itself. */
body.home .bella-case-body h3 a::after {
	content: "";
	position: absolute;
	inset: -9px 0;
}
body.home .bella-case-body h3 a:hover {
	color: var(--bella-blue);
	text-decoration: underline;
	text-underline-offset: 4px;
}
body.home .bella-case-body h3 a:focus-visible {
	outline: 2px solid var(--bella-blue);
	outline-offset: 3px;
	border-radius: 4px;
}
body.home .bella-case-body .bella-case-who {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--bella-muted);
}

/* Same chevron link as the patient journey, so "there is more behind this"
   reads the same way in both places. */
body.home .bella-results-more {
	margin-top: 40px;
}
body.home .bella-results-more p {
	margin: 0;
}
body.home .bella-results-more a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	font-weight: 600;
	color: var(--bella-blue);
	text-decoration: none;
}
body.home .bella-results-more a::after {
	content: "";
	width: 7px;
	height: 7px;
	border: 1.5px solid var(--bella-blue);
	border-left: 0;
	border-bottom: 0;
	transform: rotate(45deg);
	transition: transform var(--bella-dur) var(--bella-ease);
}
body.home .bella-results-more a:hover {
	color: var(--bella-blue-dark);
	text-decoration: underline;
	text-underline-offset: 5px;
}
body.home .bella-results-more a:hover::after {
	transform: rotate(45deg) translate(2px, -2px);
}
body.home .bella-results-more a:focus-visible {
	outline: 2px solid var(--bella-blue);
	outline-offset: 4px;
	border-radius: 4px;
}

@media (max-width: 767px) {
	body.home .bella-results-lede {
		margin-bottom: 34px;
	}
	body.home .bella-case-body {
		margin-bottom: 34px;
	}
	body.home .bella-results-more {
		margin-top: 8px;
	}
}

/* Technology & sterilisation ledger  (section 7ec4a01 - scripts/technology.php) */
body.home .elementor-22242 .elementor-element.elementor-element-7ec4a01 {
	background-color: var(--bella-paper);
}

body.home .bella-tech-head {
	margin-bottom: 14px;
}
body.home .bella-tech-head .sc_item_subtitle {
	margin-bottom: 14px;
}

/* Spacing on the widget, not the paragraph: the theme's
   .elementor-widget-text-editor .elementor-widget-container > :last-child
   is (0,3,0) and zeroes any bottom margin written against the <p>. */
body.home .bella-tech-lede {
	margin-bottom: 44px;
}
body.home .bella-tech-lede p {
	max-width: 500px;
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--bella-muted);
}

body.home .bella-tech > .elementor-widget-container {
	display: grid;
	grid-template-columns: minmax(180px, 220px) minmax(0, 1.2fr) minmax(220px, 300px);
	column-gap: 0;
	border-bottom: 1px solid var(--bella-line);
}
body.home .bella-tech h3,
body.home .bella-tech p,
body.home .bella-tech ul {
	margin: 0;
	border-top: 1px solid var(--bella-line);
	padding: 20px 0 22px;
}
body.home .bella-tech h3 {
	grid-column: 1;
	padding-right: 24px;
	font-size: 21px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -.2px;
	color: var(--bella-ink);
}
body.home .bella-tech p {
	grid-column: 2;
	padding-right: 32px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--bella-muted);
}
body.home .bella-tech ul {
	grid-column: 3;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	gap: 8px 10px;
	list-style: none;
	padding-left: 0;
}
body.home .bella-tech li {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 7px 10px 7px 12px;
	border-radius: 999px;
	background: rgba(20, 75, 120, .05);
	border: 1px solid rgba(20, 75, 120, .08);
	font-size: 12px;
	line-height: 1.3;
	letter-spacing: .01em;
	color: var(--bella-muted);
}
body.home .bella-tech li::before {
	content: "";
	position: relative;
	left: 0;
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 8px;
	border-radius: 50%;
	background: var(--bella-blue);
	flex-shrink: 0;
}

/* Tablet: the label takes its own line above the pair, so neither the
   sentence nor the machine list gets squeezed under 200px. */
@media (max-width: 1023px) {
	body.home .bella-tech > .elementor-widget-container {
		grid-template-columns: minmax(0, 1fr) minmax(200px, 260px);
	}
	body.home .bella-tech h3 {
		grid-column: 1 / -1;
		padding: 26px 0 10px;
	}
	body.home .bella-tech p {
		grid-column: 1;
		border-top: 0;
		padding: 0 40px 28px 0;
	}
	body.home .bella-tech ul {
		grid-column: 2;
		border-top: 0;
		padding: 0 0 28px;
	}
}

@media (max-width: 767px) {
	body.home .bella-tech-lede {
		margin-bottom: 30px;
	}
	body.home .bella-tech > .elementor-widget-container {
		grid-template-columns: minmax(0, 1fr);
	}
	body.home .bella-tech h3,
	body.home .bella-tech p,
	body.home .bella-tech ul {
		grid-column: 1;
	}
	body.home .bella-tech h3 {
		padding: 24px 0 8px;
		font-size: 19px;
	}
	body.home .bella-tech p {
		padding: 0 0 14px;
	}
	body.home .bella-tech ul {
		padding: 0 0 26px;
	}
}

/* Video band  (section 3d8f71e - scripts/video-band.php) */
body.home .elementor-22242 .elementor-element.elementor-element-3d8f71e {
	position: relative;
}
body.home .elementor-22242 .elementor-element.elementor-element-3d8f71e::before {
	content: "";
	position: absolute;
	inset: 0;
	
	background: radial-gradient(115% 86% at 50% 50%,
		rgba(6, 18, 38, .64) 0%,
		rgba(6, 18, 38, .58) 46%,
		rgba(6, 18, 38, .34) 74%,
		rgba(6, 18, 38, .18) 100%);
	pointer-events: none;
}
body.home .elementor-22242 .elementor-element.elementor-element-3d8f71e > .elementor-container {
	position: relative;
	z-index: 1;
}
/* Real padding on the section replaces the stack of spacer widgets. */
body.home .elementor-22242 .elementor-element.elementor-element-3d8f71e .elementor-widget-spacer {
	display: none;
}

body.home .bella-video-copy {
	margin-bottom: 30px;
	text-align: center;
}
body.home .bella-video-copy h2 {
	margin: 0 0 12px;
	font-size: 46px;
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -1px;
	color: var(--bella-white);
	text-wrap: balance;
}
body.home .bella-video-copy p {
	max-width: 520px;
	margin: 0 auto;
	font-size: 17px;
	line-height: 1.6;
	color: var(--bella-on-dark-soft);
}

/* The play pill. The theme's .round-square class pins buttons to a 101px
   square, which the label does not fit; the widget no longer carries it, but
   width/height are still reset here in case the class comes back. */
body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: auto;
	height: auto;
	min-height: 60px;
	padding: 0 30px 0 8px;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .14);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55);
	color: var(--bella-white);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1;
	text-transform: none;
	backdrop-filter: blur(6px);
	transition: background var(--bella-dur) var(--bella-ease),
		box-shadow var(--bella-dur) var(--bella-ease),
		transform var(--bella-dur) var(--bella-ease);
}
body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button:hover {
	background: rgba(255, 255, 255, .24);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .85);
	transform: translateY(-2px);
}
body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button:focus-visible {
	outline: 3px solid var(--bella-white);
	outline-offset: 3px;
}
body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button-text {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	white-space: nowrap;
}
/* The disc is solid white with a navy triangle - the one high-contrast mark in
   the frame, and the thing the eye lands on first. */
body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button-text::before {
	content: "";
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4.3 3 9 6 4.3 9z' fill='%230B1F3A'/%3E%3C/svg%3E") 56% 50% / 15px 15px no-repeat,
		var(--bella-white);
	transition: transform var(--bella-dur) var(--bella-ease);
}
body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button:hover .elementor-button-text::before {
	transform: scale(1.06);
}

@media (max-width: 1023px) {
	body.home .bella-video-copy h2 {
		font-size: 38px;
	}
}
@media (max-width: 767px) {
	body.home .bella-video-copy {
		margin-bottom: 26px;
	}
	body.home .bella-video-copy h2 {
		font-size: 30px;
		letter-spacing: -.6px;
	}
	body.home .bella-video-copy p {
		font-size: 16px;
	}
	/* Below 380px the label plus a 44px disc no longer fits on one line, and a
	   two-line button label is not allowed. The disc steps down instead of the
	   text wrapping. */
	body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button {
		min-height: 54px;
		padding: 0 22px 0 7px;
		font-size: 15px;
	}
	body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button-text {
		gap: 11px;
	}
	body.home .elementor-22242 .elementor-element.elementor-element-c10e74c .elementor-button-text::before {
		width: 40px;
		height: 40px;
		background-size: 14px 14px;
	}
}

/* Latest posts */

body.home .elementor-element-13462d0 .sc_blogger_content.masonry_wrap {
	position: static !important;
	height: auto !important;
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

body.home .elementor-22242 .elementor-element.elementor-element-13462d0 > .elementor-widget-container {
	margin-bottom: 0;
}
body.home .elementor-element-13462d0 .masonry_item {
	position: static !important;
	left: auto !important;
	top: auto !important;
	width: auto !important;
	padding: 0 !important;
	display: flex;
}
body.home .elementor-element-13462d0 .masonry_item > .post_item {
	display: flex;
	flex-direction: column;
	width: 100%;
}

body.home .elementor-element-13462d0 .post_featured.with_thumb {
	
	flex: none;
	aspect-ratio: 3 / 2;
	border-radius: var(--bella-radius-sm);
	overflow: hidden;
}
body.home .elementor-element-13462d0 .post_featured.with_thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}
body.home .elementor-element-13462d0 .post_item:hover .post_featured.with_thumb img {
	transform: scale(1.06);
}

body.home .elementor-element-13462d0 .masonry_wrap .masonry_item .post_featured,
body.home .elementor-element-13462d0 .post_featured {
	margin-bottom: 0;
}
/* Let the text block take the slack so the cards' bottoms line up. */
body.home .elementor-element-13462d0 .post_header {
	flex: 1 1 auto;
}

body.home .elementor-element-13462d0 .sc_blogger_classic-masonry.sc_blogger_classic-masonry_default .post_layout_classic-masonry .post_header,
body.home .elementor-element-13462d0 .masonry_wrap .masonry_item .post_layout_classic-masonry_3 .post_header,
body.home .elementor-element-13462d0 .post_header {
	padding: 20px 0 0;
}
body.home .elementor-element-13462d0 .post_meta {
	margin: 0 0 12px;
}
/* The theme prefixes the category with a drawn rule; a chip is clearer at
   card size and picks up the accent used elsewhere. */
body.home .elementor-element-13462d0 .post_meta_item.post_categories {
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--bella-blue-soft);
	color: var(--bella-blue);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 1px;
}
body.home .elementor-element-13462d0 .post_meta_item.post_categories a {
	color: inherit;
}
/* The theme rules a 35x2 bar into the card's left margin ahead of the meta
   row. With the category as a chip it is one mark too many, and it is what
   pushed the row off the card's own left edge. */
body.home .elementor-element-13462d0 .sc_blogger_classic-masonry.sc_blogger_classic-masonry_default .post_layout_classic-masonry .post_header::before,
body.home .elementor-element-13462d0 .masonry_wrap .masonry_item .post_layout_classic-masonry_3 .post_header::before,
body.home .elementor-element-13462d0 .post_meta::before,
body.home .elementor-element-13462d0 .post_meta_item.post_categories::before,
body.home .elementor-element-13462d0 .post_meta_item.post_categories::after {
	display: none;
}
/* The shortcode sets the card title size from a selector three classes deep,
   so the override has to match that depth to land. */
body.home .elementor-element-13462d0 .sc_blogger_classic-masonry.sc_blogger_classic-masonry_default .post_layout_classic-masonry_3 .post_title,
body.home .elementor-element-13462d0 .masonry_item .post_title {
	margin: 0;
	font-size: 18px;
	line-height: 1.44em;
	letter-spacing: -.1px;
}
body.home .elementor-element-13462d0 .post_title a {
	color: var(--bella-ink);
	transition: color var(--bella-dur) var(--bella-ease);
}
/* With the lift gone, hover is the photograph moving under its frame and the
   title taking the accent - the same acknowledgement the service rows give. */
body.home .elementor-element-13462d0 .post_item:hover .post_title a {
	color: var(--bella-blue);
}
/* ---------------------------------------------------------------------------
 * Tablet
 * ------------------------------------------------------------------------ */
@media (max-width: 1279px) {
	body.home .bella-hero-doctor-w {
		left: 0;
		bottom: 5%;
		max-width: 92%;
	}
	body.home .bella-hero-doctor {
		padding: 13px 18px 13px 20px;
	}
	body.home .bella-trust__item {
		padding: 4px 16px;
	}
}

@media (max-width: 1023px) {
	body.home .elementor-22242 .elementor-element.elementor-element-51314d5 {
		padding: 84px 0 72px;
	}
	
	body.home .elementor-22242 .elementor-element.elementor-element-99fade0,
	body.home .elementor-22242 .elementor-element.elementor-element-d4f88da {
		width: 100%;
	}
	/* min() not a bare px cap: the cap has to lose to the parent when the
	   parent is the smaller of the two, or the image overflows its column and
	   `margin: 0 auto` stops centring it. */
	body.home .elementor-element-8617d4a img {
		max-width: min(460px, 100%);
	}
	/* Stacked, the column is full width, so an absolutely positioned plate
	   would sit at the far left with the portrait centred away from it. Below
	   the panel it reads as a caption instead. */
	body.home .bella-hero-doctor-w {
		position: static;
		margin: 20px auto 0;
		max-width: 100%;
	}
	body.home .bella-trust {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px 0;
		margin-top: -38px;
		padding: 24px 10px;
	}
	body.home .bella-trust__item {
		padding: 14px 18px;
	}
	/* With two per row the third item starts a new row, so the vertical rule
	   has to be reset and drawn only between columns. */
	body.home .bella-trust__item + .bella-trust__item {
		border-left: none;
	}
	body.home .bella-trust__item:nth-child(2n) {
		border-left: 1px solid var(--bella-line);
	}
	body.home .bella-trust__item:nth-child(n + 3) {
		border-top: 1px solid var(--bella-line);
	}
	body.home .elementor-element-0d576aa .sc_item_title,
	body.home .elementor-element-3d90c56 .sc_item_title,
	body.home .elementor-element-08c9a5c .sc_item_title {
		font-size: 34px;
	}
	body.home .elementor-22242 .elementor-element.elementor-element-20bd554 {
		padding-bottom: 60px;
	}
	/* Three across at this width leaves each card about 230px wide, which puts
	   the titles on four lines. Two is the better read; the third card starting
	   a new row is fine. */
	body.home .elementor-element-13462d0 .sc_blogger_content.masonry_wrap {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}
	body.home .elementor-element-09a4f79 .sc_skills {
		padding: 44px 24px;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	body.home .elementor-element-8617d4a .elementor-widget-container {
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
	}
}

/* ---------------------------------------------------------------------------
 * Mobile
 * ------------------------------------------------------------------------ */
@media (max-width: 767px) {
	body.home .elementor-22242 .elementor-element.elementor-element-51314d5 {
		padding: 64px 0 52px;
	}
	body.home .elementor-element-58e9b6a .sc_item_title {
		max-width: none;
		letter-spacing: -.028em;
	}
	body.home .bella-hero-lede {
		font-size: 16.5px;
		line-height: 1.6;
	}
	/* Three columns of numbers do not fit 320px. A row that wraps to two lines
	   does, and the hairline above still separates it from the buttons. */
	body.home .bella-hero-proof {
		gap: 16px 28px;
		padding-top: 24px;
	}
	body.home .bella-hero-proof__n {
		font-size: 21px;
	}
	body.home .elementor-element-0d576aa .sc_item_title,
	body.home .elementor-element-3d90c56 .sc_item_title,
	body.home .elementor-element-08c9a5c .sc_item_title {
		font-size: 28px;
		letter-spacing: -.5px;
	}
	body.home .elementor-22242 .elementor-element.elementor-element-20bd554 {
		padding-bottom: 48px;
	}
	/* Stacked and chromeless, 24px is not enough: with no card edge between them
	   the title of one entry runs into the photograph of the next. The gap has
	   to do the separating the border used to. */
	body.home .elementor-element-13462d0 .sc_blogger_content.masonry_wrap {
		grid-template-columns: 1fr;
		gap: 44px;
	}
	body.home .elementor-element-7aea6c3 .sc_button {
		padding: 15px 26px;
	}
	/* The column's own padding leaves less than 300px of room at 320, so the
	   cap has to yield to the parent here too. */
	body.home .elementor-element-8617d4a img {
		max-width: min(300px, 100%);
	}
	body.home .elementor-element-8617d4a .elementor-widget-container::before {
		left: 8%;
		right: 8%;
		top: 20%;
	}
	body.home .bella-trust {
		grid-template-columns: minmax(0, 1fr);
		margin-top: -30px;
		padding: 12px 6px;
	}
	body.home .bella-trust__item:nth-child(2n) {
		border-left: none;
	}
	body.home .bella-trust__item + .bella-trust__item {
		border-top: 1px solid var(--bella-line);
	}
	body.home .elementor-element-09a4f79 .sc_skills {
		padding: 34px 18px;
	}
	body.home .elementor-element-09a4f79 .sc_skills_column + .sc_skills_column .sc_skills_item_wrap {
		border-left: none;
		border-top: 1px solid rgba(255, 255, 255, .22);
		padding-top: 26px;
		margin-top: 26px;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.home .bella-svc__list a,
	body.home .bella-svc__list a::after,
	body.home .elementor-element-13462d0 .post_featured.with_thumb img,
	body.home .elementor-element-13462d0 .post_title a,
	body.home .sc_button,
	body.home .elementor-button {
		transition: none;
	}
	body.home .elementor-element-13462d0 .post_item:hover .post_featured.with_thumb img,
	body.home .sc_button:hover,
	body.home .elementor-button:hover {
		transform: none;
	}
	/* Not transform:none here - the chevron's shape IS a transform, and
	   removing it leaves a square. Only the nudge goes. */
	body.home .bella-svc__list a:hover::after,
	body.home .bella-svc__list a:focus-visible::after {
		transform: translate(0, 0) rotate(-45deg);
	}
	body.home .bella-svc-all a::after,
	body.home .bella-svc-all a:hover::after,
	body.home .bella-svc-all a:focus-visible::after,
	body.home .bella-team__more a,
	body.home .bella-team__more a::after,
	body.home .bella-team__more a:hover::after,
	body.home .bella-team__more a:focus-visible::after {
		transition: none;
		transform: none;
	}
}

/* Phone action bar */
.bella-actionbar {
	display: none;
}

@media (max-width: 767px) {
	.bella-actionbar {
		position: fixed;
		z-index: 1000;
		left: 0;
		right: 0;
		bottom: 0;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: rgba(255, 255, 255, .94);
		backdrop-filter: blur(10px);
		box-shadow: 0 -6px 24px -12px rgba(27, 27, 43, .35);
	}
	.bella-actionbar a {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		min-height: 48px;
		border-radius: 14px;
		font-size: 15px;
		font-weight: 600;
		text-decoration: none;
	}
	.bella-actionbar__call {
		background: #fff;
		color: #10263F;
		box-shadow: inset 0 0 0 1px rgba(27, 27, 43, .14);
	}
	.bella-actionbar__call::before {
		content: "";
		width: 17px;
		height: 17px;
		background: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11.4 11.4 0 0 0 3.6.58 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.4 11.4 0 0 0 .58 3.6 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
		        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11.4 11.4 0 0 0 3.6.58 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.4 11.4 0 0 0 .58 3.6 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
	}
	.bella-actionbar__book {
		background: #0F4F9E;
		color: #fff;
	}
	/* The bar would otherwise sit on the last line of the footer. */
	body.home .footer_wrap {
		padding-bottom: 78px;
	}
	/* The theme's own "back to top" button lands under the bar. */
	body.home .trx_addons_scroll_to_top {
		bottom: 90px;
	}
}