/* site-cta.css — form liên hệ cuối trang + nút nổi (v1.3.0) */

/* ===== Form liên hệ cuối trang ===== */
.lcr-contact {
	background: var(--warm-ivory);
	padding: var(--space-section) 0;
	border-top: 1px solid var(--color-border-light);
}
.lcr-contact__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr);
	gap: clamp(2rem, 5vw, 5rem);
	align-items: start;
}
.lcr-contact__eyebrow {
	font-family: var(--font-accent);
	font-size: var(--text-xs);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin: 0 0 var(--space-sm);
}
.lcr-contact__title {
	font-family: var(--font-heading);
	font-size: clamp(1.9rem, 1.4rem + 2vw, 2.8rem);
	line-height: 1.15;
	color: var(--deep-navy);
	margin: 0 0 var(--space-md);
}
.lcr-contact__text { color: var(--color-text-muted); margin: 0 0 var(--space-lg); max-width: 42ch; }
.lcr-contact__list { list-style: none; padding: 0; margin: 0; }
.lcr-contact__list li { padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
.lcr-contact__list a { color: var(--deep-navy); font-weight: 600; text-decoration: none; }
.lcr-contact__list a:hover { color: var(--color-accent); }
.lcr-contact__form {
	background: var(--white);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-card);
	padding: clamp(1.25rem, 3vw, 2.25rem);
}

/* Fluent Form theo tông thương hiệu (dùng được ở mọi trang, không chỉ trang marketing) */
.lcr-form-wrap .fluentform label { font-weight: 600; color: var(--color-text); }
.lcr-form-wrap .fluentform input[type="text"],
.lcr-form-wrap .fluentform input[type="email"],
.lcr-form-wrap .fluentform input[type="tel"],
.lcr-form-wrap .fluentform input[type="number"],
.lcr-form-wrap .fluentform input[type="date"],
.lcr-form-wrap .fluentform select,
.lcr-form-wrap .fluentform textarea {
	border-radius: var(--radius-md);
	border: 1px solid var(--color-border);
	padding: 0.7rem 0.9rem;
}
.lcr-form-wrap .fluentform input:focus,
.lcr-form-wrap .fluentform select:focus,
.lcr-form-wrap .fluentform textarea:focus {
	border-color: var(--color-accent);
	box-shadow: 0 0 0 2px rgba(201, 169, 110, 0.2);
	outline: none;
}
.lcr-form-wrap .fluentform .ff-btn-submit,
.lcr-form-wrap .fluentform button[type="submit"] {
	background: var(--color-accent);
	border: none;
	color: #fff;
	font-weight: 600;
	padding: 0.8rem 1.8rem;
	border-radius: var(--radius-full);
	cursor: pointer;
}
.lcr-form-wrap .fluentform .ff-btn-submit:hover { opacity: 0.9; }

/* ===== Nút nổi (desktop) ===== */
.lcr-fab {
	position: fixed;
	right: 20px;
	bottom: 24px;
	z-index: var(--z-sticky);
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.lcr-fab__btn {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
	text-decoration: none;
	transition: transform var(--transition-fast);
}
.lcr-fab__btn:hover { transform: translateY(-2px); }
.lcr-fab__btn:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.lcr-fab__btn--zalo { background: #0068ff; color: #fff; font: 700 0.78rem/1 var(--font-body); }
.lcr-fab__btn--msg { background: #fff; }
.lcr-fab__btn--msg svg { width: 26px; height: 26px; fill: #0866ff; }

/* ===== Thanh sticky mobile: 3 nút ===== */
.sticky-cta .btn--chat { background: #0068ff; color: #fff; border-color: #0068ff; }
.sticky-cta .btn--chat.is-messenger { background: #0866ff; border-color: #0866ff; }

@media (max-width: 900px) {
	.lcr-contact__grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
	.lcr-fab { display: none; }
	.sticky-cta .btn { padding: 0.75rem 0.5rem; font-size: 0.9rem; }
}