/**
 * Mobile UX polish — phone-first readability & spacing.
 * Scoped to max-width breakpoints; desktop unchanged.
 */

/* ---------- Shared mobile (≤768) ---------- */
@media (max-width: 768px) {
	body {
		font-size: 16px;
		line-height: 1.6;
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
	}

	.consult-modal__row-2 {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.consult-modal__form .form-field input,
	.consult-modal__form .form-field select,
	.consult-modal__form .form-field textarea,
	.consult-modal__form button,
	.consult-modal__submit {
		min-height: 48px;
		font-size: 16px;
	}

	/* Project pages — readable body, tighter rhythm */
	body.single-du-an .duan-single,
	body.single-du-an .duan-section__desc,
	body.single-du-an .duan-section__desc p,
	body.single-du-an .duan-intro p,
	body.single-du-an .duan-location__desc,
	body.single-du-an .duan-location__desc p,
	body.single-du-an .duan-faq__answer,
	body.single-du-an .duan-faq__answer p {
		font-size: 16px;
		line-height: 1.6;
	}

	/* Hide project header bar on mobile */
	body.single-du-an .duan-topbar {
		display: none !important;
		visibility: hidden;
		pointer-events: none;
	}

	body.single-du-an .site-content,
	body.single-du-an .duan-single {
		--duan-topbar-offset: 12px;
	}

	body.single-du-an .duan-section {
		padding-top: 32px;
		padding-bottom: 24px;
	}

	body.single-du-an .duan-section__head {
		margin-bottom: 14px;
	}

	body.single-du-an .duan-section__head h2 {
		font-size: clamp(20px, 5.6vw, 26px);
		line-height: 1.28;
		letter-spacing: -0.02em;
		text-wrap: balance;
	}

	body.single-du-an .duan-hero h1 {
		font-size: clamp(22px, 6.2vw, 28px);
		line-height: 1.22;
		letter-spacing: -0.02em;
		text-wrap: balance;
	}

	body.single-du-an .duan-hero {
		padding: 20px 0 16px;
	}

	body.single-du-an .duan-hero__subtitle,
	body.single-du-an .duan-hero__description,
	body.single-du-an .duan-hero__description p {
		font-size: 16px;
		line-height: 1.55;
	}

	/* Touch targets */
	body.single-du-an .duan-form input,
	body.single-du-an .duan-form select,
	body.single-du-an .duan-form textarea,
	body.single-du-an .consult-modal__form input,
	body.single-du-an .consult-modal__form select,
	body.single-du-an .consult-modal__form textarea {
		min-height: 48px;
		font-size: 16px;
	}

	body.single-du-an .duan-form button,
	body.single-du-an .duan-form__submit,
	body.single-du-an .btn,
	body.single-du-an .duan-hero__btn,
	body.single-du-an .duan-modal-cta,
	body.single-du-an .cp-context-cta__btn,
	body.single-du-an .duan-payment-cta__submit {
		min-height: 48px;
		font-size: 15px;
	}

	/* Short hero form */
	body.single-du-an .duan-hero__form {
		padding: 14px;
		border-radius: 14px;
	}

	body.single-du-an .duan-hero__form-title {
		font-size: 17px;
		line-height: 1.3;
		margin: 0 0 6px;
		text-wrap: balance;
	}

	body.single-du-an .duan-form--cp-lead,
	body.single-du-an .duan-form {
		display: grid;
		gap: 10px;
	}

	body.single-du-an .duan-form__field--need-select span,
	body.single-du-an .duan-form__field--phone span,
	body.single-du-an .duan-form__field--name span {
		font-size: 13px;
	}

	/* Payment / FAQ — compact chrome, keep full SEO text in DOM */
	body.single-du-an .duan-payment-accordion {
		gap: 8px;
	}

	body.single-du-an .duan-payment-accordion__trigger {
		min-height: 48px;
		padding: 12px;
	}

	body.single-du-an .duan-payment-accordion__panel {
		padding: 0 10px 10px;
	}

	body.single-du-an .duan-payment-accordion__item:not(.is-open) .duan-payment-accordion__panel {
		display: none;
	}

	body.single-du-an .duan-payment-method__subtitle {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		font-size: 13px;
		line-height: 1.4;
	}

	body.single-du-an .duan-payment-method__discount strong,
	body.single-du-an .duan-hero__offer-copy strong {
		font-size: clamp(18px, 5.2vw, 22px);
		line-height: 1.15;
	}

	body.single-du-an .duan-faq__list {
		gap: 0;
	}

	body.single-du-an .duan-faq__trigger {
		min-height: 48px;
		padding: 12px 0;
		font-size: 15px;
		line-height: 1.35;
	}

	body.single-du-an .duan-faq__answer,
	body.single-du-an .duan-faq__answer p {
		font-size: 15px;
		line-height: 1.55;
	}

	body.single-du-an .duan-faq__item:not(.is-open) .duan-faq__panel {
		display: none;
	}

	/* Floor plans — no horizontal bleed / overflow */
	body.single-du-an .duan-layout__stage,
	body.single-du-an .duan-masterplan__stage,
	body.single-du-an .duan-amenities__master,
	body.single-du-an .duan-layout__zoom,
	body.single-du-an .duan-masterplan__panel {
		width: 100% !important;
		max-width: 100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box;
		overflow: hidden;
	}

	body.single-du-an .duan-layout__zoom img,
	body.single-du-an .duan-masterplan__panel img,
	body.single-du-an .duan-amenities__master img {
		display: block;
		width: 100%;
		max-width: 100%;
		height: auto;
		max-height: min(70vh, 420px);
		object-fit: contain;
		object-position: center;
		background: #f4f6f5;
	}

	body.single-du-an .duan-layout__zoom,
	body.single-du-an .duan-masterplan__panel [data-image-zoom] {
		cursor: zoom-in;
	}

	body.single-du-an .duan-price-table__wrap,
	body.single-du-an .duan-price-table table {
		max-width: 100%;
	}

	body.single-du-an .duan-price-table__wrap {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior-x: contain;
	}

	/* Image viewer — stay within viewport */
	.duan-image-viewer__stage {
		padding: 56px 10px 72px;
		width: 100%;
		max-width: 100vw;
		box-sizing: border-box;
	}

	.duan-image-viewer__stage img {
		max-width: calc(100vw - 24px);
		height: auto;
	}

	.duan-image-viewer__nav {
		width: 44px;
		height: 44px;
	}

	.duan-image-viewer__nav--prev {
		left: 6px;
	}

	.duan-image-viewer__nav--next {
		right: 6px;
	}

	/* City Life — reduce oversized section padding */
	body.du-an-bcons-city-life .duan-section {
		padding-top: 32px;
		padding-bottom: 24px;
	}

	body.du-an-bcons-city-life .duan-section__head h2 {
		font-size: clamp(20px, 5.6vw, 26px);
	}

	body.du-an-bcons-city-life .duan-single .container {
		padding-left: 16px;
		padding-right: 16px;
	}

	/* CP / Aria — denser than prior 40/28 */
	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-section {
		padding-top: 28px;
		padding-bottom: 18px;
	}

	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero {
		padding: 18px 0 12px;
	}

	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero__description,
	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero__description p {
		font-size: 16px;
	}

	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero__offer {
		min-height: 76px;
		padding: 10px;
	}

	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero__form {
		padding: 14px;
	}

	/* Sticky CTA — keep Gọi ngay / Zalo / Nhận bảng giá */
	body.has-cp-sticky-cta .cp-sticky-cta {
		gap: 6px;
		padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
	}

	body.has-cp-sticky-cta .cp-sticky-cta__btn {
		min-height: 48px;
	}

	body.has-cp-sticky-cta .cp-sticky-cta__btn--lead {
		min-height: 52px;
		padding-left: 8px;
		padding-right: 8px;
		font-size: 14px;
		line-height: 1.2;
		text-align: center;
	}

	body.has-cp-sticky-cta .cp-sticky-cta__label {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	/* Fix mojibake swipe hint */
	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-price-table__wrap::after {
		content: "Vuốt ngang để xem đủ cột →";
	}
}

/* ---------- Mid phones (≤430) ---------- */
@media (max-width: 430px) {
	body.single-du-an .duan-section {
		padding-top: 26px;
		padding-bottom: 16px;
	}

	body.single-du-an .duan-hero h1 {
		font-size: clamp(21px, 6vw, 26px);
	}

	body.single-du-an .duan-section__head h2 {
		font-size: clamp(19px, 5.4vw, 24px);
	}

	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero__offer-stack {
		gap: 8px;
	}

	body.has-cp-sticky-cta .cp-sticky-cta {
		grid-template-columns: minmax(0, 0.85fr) minmax(0, 0.85fr) minmax(0, 2.1fr);
		gap: 6px;
		padding-left: 8px;
		padding-right: 8px;
	}

	body.has-cp-sticky-cta .cp-sticky-cta__btn--call,
	body.has-cp-sticky-cta .cp-sticky-cta__btn--zalo {
		font-size: 12px;
	}

	body.has-cp-sticky-cta .cp-sticky-cta__btn--lead {
		font-size: 13px;
	}

	.duan-image-viewer__stage img {
		max-width: calc(100vw - 16px);
	}
}

/* ---------- Compact phones (≤390) ---------- */
@media (max-width: 390px) {
	body.single-du-an .container,
	body.du-an-bcons-city-life .duan-single .container {
		padding-left: 14px;
		padding-right: 14px;
	}

	body.single-du-an .duan-hero__form-title {
		font-size: 16px;
	}

	body:is(.du-an-bcons-central-park, .aria-cta-streamlined) .duan-hero__offer-copy strong {
		font-size: 18px;
	}

	body.single-du-an .duan-layout__zoom img,
	body.single-du-an .duan-masterplan__panel img {
		max-height: min(62vh, 360px);
	}
}

/* ---------- Narrow phones (≤375) ---------- */
@media (max-width: 375px) {
	body.single-du-an .duan-section {
		padding-top: 22px;
		padding-bottom: 14px;
	}

	body.single-du-an .duan-hero {
		padding: 14px 0 10px;
	}

	body.single-du-an .duan-hero h1 {
		font-size: 21px;
	}

	body.single-du-an .duan-section__head h2 {
		font-size: 19px;
	}

	body.has-cp-sticky-cta {
		--cp-sticky-cta-h: 78px;
	}

	body.has-cp-sticky-cta .cp-sticky-cta__btn {
		min-height: 46px;
		padding: 6px 4px;
		border-radius: 10px;
	}

	body.has-cp-sticky-cta .cp-sticky-cta__btn--lead {
		min-height: 50px;
		font-size: 12.5px;
	}
}