/* =========================================================================
   Nab Ul Hayat - Patient Proof section
   Self-contained styles. All rules are scoped under .nuh-proof so nothing
   leaks into the rest of the theme.
   ========================================================================= */

.nuh-proof {
	/* Brand tokens sampled from the live site so the section blends with the
	   sections above and below it. */
	--nuh-navy: oklch(0.33 0.085 257);
	--nuh-navy-2: oklch(0.30 0.08 257);
	--nuh-green: oklch(0.68 0.17 138);
	--nuh-dark: oklch(0.20 0.06 257);
	--nuh-fg: 238, 243, 250;     /* near-white, used as rgba(var(--nuh-fg), a) */
	--nuh-card: #ffffff;
	--nuh-radius: 16px;
	--nuh-radius-sm: 12px;

	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	background: var(--nuh-navy);
	color: rgb(var(--nuh-fg));
	padding: 40px 0;
	font-family: Inter, "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
.nuh-proof *,
.nuh-proof *::before,
.nuh-proof *::after { box-sizing: border-box; }

.nuh-proof[dir="rtl"] { font-family: Cairo, Inter, system-ui, sans-serif; letter-spacing: 0; }

@media (min-width: 640px) { .nuh-proof { padding: 56px 0; } }
@media (min-width: 1024px) { .nuh-proof { padding: 72px 0; } }

.nuh-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
}
@media (min-width: 640px) { .nuh-container { padding: 0 24px; } }

/* ---- Panel -------------------------------------------------------------- */
.nuh-panel {
	position: relative;
	background: rgba(255, 255, 255, 0.03);
	border-top: 1px solid rgba(255, 255, 255, 0.10);
	border-bottom: 1px solid rgba(255, 255, 255, 0.10);
	padding: 22px 16px;
	margin: 0 -16px;                 /* edge-to-edge on phones */
}
@media (min-width: 640px) {
	.nuh-panel {
		border: 1px solid rgba(255, 255, 255, 0.10);
		border-radius: var(--nuh-radius);
		padding: 28px;
		margin: 0;
		backdrop-filter: blur(6px);
	}
}
@media (min-width: 1024px) { .nuh-panel { padding: 34px; } }

.nuh-grid { display: grid; grid-template-columns: 1fr; gap: 28px; }
@media (min-width: 1024px) {
	.nuh-grid { grid-template-columns: 3fr 2fr; gap: 36px; }
}
.nuh-col-left, .nuh-col-right { min-width: 0; }

/* ---- Headings ----------------------------------------------------------- */
.nuh-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--nuh-green);
	background: color-mix(in srgb, var(--nuh-green) 10%, transparent);
	border: 1px solid color-mix(in srgb, var(--nuh-green) 25%, transparent);
	padding: 6px 12px;
	border-radius: 999px;
}
.nuh-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--nuh-green); }

.nuh-h2 {
	font-family: "Plus Jakarta Sans", Inter, system-ui, sans-serif;
	font-size: 1.6rem;
	line-height: 1.15;
	font-weight: 800;
	margin: 14px 0 0;
	color: rgb(var(--nuh-fg));
}
@media (min-width: 640px) { .nuh-h2 { font-size: 1.9rem; } }
.nuh-green { color: var(--nuh-green); }
.nuh-subcopy {
	margin: 8px 0 0;
	max-width: 34rem;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(var(--nuh-fg), 0.65);
}

.nuh-google-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	font-size: 13px;
	color: rgba(var(--nuh-fg), 0.85);
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.10);
	padding: 6px 12px;
	border-radius: 999px;
	text-decoration: none;
}
.nuh-google-chip strong { color: rgb(var(--nuh-fg)); }
.nuh-gstar { width: 14px; height: 14px; fill: var(--nuh-green); }

/* ---- Right column header ------------------------------------------------ */
.nuh-say-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
}
.nuh-say-eye {
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(var(--nuh-fg), 0.45);
}
.nuh-say-title {
	font-family: "Plus Jakarta Sans", Inter, sans-serif;
	font-size: 1.15rem;
	font-weight: 800;
	margin: 2px 0 0;
	color: rgb(var(--nuh-fg));
}
.nuh-rating-pill {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex: none;
	font-size: 12px;
	font-weight: 700;
	color: var(--nuh-green);
	background: color-mix(in srgb, var(--nuh-green) 15%, transparent);
	padding: 4px 10px;
	border-radius: 999px;
}
.nuh-rating-pill svg { width: 13px; height: 13px; fill: var(--nuh-green); }

/* ---- Stars -------------------------------------------------------------- */
.nuh-stars { display: inline-flex; gap: 2px; }
.nuh-star { width: 14px; height: 14px; fill: rgba(var(--nuh-fg), 0.25); }
.nuh-star.on { fill: var(--nuh-green); }

/* ---- Text review card --------------------------------------------------- */
.nuh-rev-card {
	border: 1px solid rgba(255, 255, 255, 0.10);
	background: rgba(255, 255, 255, 0.06);
	border-radius: var(--nuh-radius-sm);
	padding: 16px;
	backdrop-filter: blur(4px);
	transition: border-color 0.2s ease;
}
.nuh-rev-card:hover { border-color: color-mix(in srgb, var(--nuh-green) 40%, transparent); }
.nuh-rev-quote {
	margin: 10px 0 0;
	font-size: 14px;
	line-height: 1.55;
	color: rgba(var(--nuh-fg), 0.85);
	overflow-wrap: anywhere;
}
.nuh-rev-foot {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.10);
}
.nuh-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px; height: 32px;
	flex: none;
	border-radius: 50%;
	background: color-mix(in srgb, var(--nuh-green) 20%, transparent);
	color: var(--nuh-green);
	font-weight: 700;
	font-size: 13px;
}
.nuh-avatar.sm { width: 26px; height: 26px; font-size: 11px; }
.nuh-rev-meta { display: flex; flex-direction: column; min-width: 0; }
.nuh-rev-name {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-weight: 700;
	font-size: 13px;
	color: rgb(var(--nuh-fg));
}
.nuh-badge { width: 14px; height: 14px; fill: none; stroke: var(--nuh-green); stroke-width: 1.6; }
.nuh-rev-proc { font-size: 11px; color: var(--nuh-green); }

/* ---- Vertical marquee (desktop reviews) --------------------------------- */
.nuh-rev-marquee {
	position: relative;
	height: 430px;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to bottom, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(to bottom, transparent, #000 8%, #000 92%, transparent);
}
.nuh-rev-track {
	display: flex;
	flex-direction: column;
	gap: 16px;
	animation: nuh-marquee-up 38s linear infinite;
	will-change: transform;
}
.nuh-rev-marquee:hover .nuh-rev-track { animation-play-state: paused; }

@keyframes nuh-marquee-up {
	from { transform: translateY(0); }
	to   { transform: translateY(-50%); }
}

/* ---- Video slider ------------------------------------------------------- */
.nuh-vid-item { width: 100%; }
.nuh-vid-frame {
	position: relative;
	height: 250px;
	overflow: hidden;
	border-radius: var(--nuh-radius-sm);
	background: var(--nuh-dark);
}
@media (min-width: 640px) { .nuh-vid-frame { height: 360px; } }
@media (min-width: 1024px) { .nuh-vid-frame { height: 430px; } }

.nuh-video, .nuh-video-fallback {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	background: var(--nuh-dark);
}
.nuh-video-fallback { object-fit: cover; }

.nuh-playbtn {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	transition: opacity 0.25s ease;
}
.nuh-playbtn:focus-visible { outline: 2px solid var(--nuh-green); outline-offset: -4px; }
.nuh-play {
	width: 74px; height: 74px;
	display: flex; align-items: center; justify-content: center;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.20);
	background: rgba(255, 255, 255, 0.10);
	backdrop-filter: blur(6px);
	pointer-events: none;
	transition: transform 0.25s ease;
}
.nuh-play-core {
	width: 52px; height: 52px;
	display: flex; align-items: center; justify-content: center;
	border-radius: 50%;
	background: var(--nuh-green);
	box-shadow: 0 0 24px color-mix(in srgb, var(--nuh-green) 60%, transparent);
}
.nuh-play-core svg { width: 24px; height: 24px; fill: #fff; margin-inline-start: 2px; }
.nuh-video-card:hover .nuh-play { transform: scale(1.1); }

.nuh-vid-cap {
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	padding: 64px 16px 16px;
	background: linear-gradient(to top, rgba(14, 26, 48, 0.92), rgba(14, 26, 48, 0.45) 45%, transparent);
	pointer-events: none;
}
.nuh-vid-proc {
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--nuh-green);
}
.nuh-vid-name { display: block; font-weight: 800; font-size: 16px; color: #fff; margin-top: 2px; }
.nuh-vid-row { display: none; align-items: center; gap: 8px; margin-top: 10px; }
.nuh-vid-rowproc { font-size: 12px; color: rgba(255, 255, 255, 0.75); }
@media (min-width: 640px) { .nuh-vid-row { display: flex; } }

/* ---- SwipeRow ----------------------------------------------------------- */
.nuh-swipe { position: relative; margin-top: 18px; }
.nuh-swipe-vp {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 8px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	cursor: grab;
	user-select: none;
}
.nuh-swipe-vp::-webkit-scrollbar { display: none; }
.nuh-swipe-vp:active { cursor: grabbing; }
.nuh-swipe.nuh-bleed .nuh-swipe-vp { margin: 0 -16px; padding-inline: 16px; }

.nuh-swipe-item, .nuh-swipe .nuh-swipe-item {
	min-width: 0;
	flex: none;
	scroll-snap-align: center;
}
.nuh-items-w-full .nuh-swipe-item { width: 100%; }
.nuh-items-half .nuh-swipe-item { width: 100%; }
@media (min-width: 640px) { .nuh-items-half .nuh-swipe-item { width: 46%; } }

/* Floating glass arrows (tablet/desktop, >= 640px only) */
.nuh-swipe-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px; height: 44px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.30);
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
	display: none;
	align-items: center; justify-content: center;
	cursor: pointer;
	z-index: 3;
	transition: opacity 0.2s ease, transform 0.15s ease, background 0.2s ease;
}
@media (min-width: 640px) { .nuh-arrow-float { display: flex; } }
.nuh-swipe-btn:hover { background: rgba(255, 255, 255, 0.25); transform: translateY(-50%) scale(1.05); }
.nuh-swipe-btn svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.nuh-arrow-float.nuh-prev { inset-inline-start: 12px; }
.nuh-arrow-float.nuh-next { inset-inline-end: 12px; }
.nuh-swipe-btn:disabled { opacity: 0; pointer-events: none; }

/* Mobile controls row: small glass arrows beside the hint, below the cards (< 640px) */
.nuh-swipe-foot {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 12px;
}
@media (min-width: 640px) { .nuh-swipe-foot { display: none; } }
.nuh-swipe-btn-sm {
	flex: none;
	width: 36px; height: 36px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.30);
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	display: flex; align-items: center; justify-content: center;
	cursor: pointer;
	transition: opacity 0.2s ease, background 0.2s ease;
}
.nuh-swipe-btn-sm svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.nuh-swipe-btn-sm:disabled { opacity: 0.3; pointer-events: none; }
.nuh-swipe-hint {
	margin: 0;
	text-align: center;
	font-size: 11px;
	color: rgba(var(--nuh-fg), 0.6);
}
.nuh-tone-light .nuh-swipe-hint { color: rgba(0, 0, 0, 0.45); }

/* RTL: flip chevrons */
.nuh-proof[dir="rtl"] .nuh-rtlflip { transform: scaleX(-1); }

/* ---- Trust bar + CTA ---------------------------------------------------- */
.nuh-trustbar {
	margin-top: 24px;
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, 0.10);
	display: flex;
	flex-direction: column;
	gap: 18px;
}
@media (min-width: 1024px) {
	.nuh-trustbar { flex-direction: row; align-items: center; justify-content: space-between; }
}
.nuh-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}
.nuh-stat {
	text-align: center;
	padding: 0 12px;
	border-inline-end: 1px solid rgba(255, 255, 255, 0.10);
}
.nuh-stat:last-child { border-inline-end: none; }
.nuh-stat-num {
	display: block;
	font-family: "Plus Jakarta Sans", Inter, sans-serif;
	font-size: 1.25rem;
	font-weight: 800;
	color: rgb(var(--nuh-fg));
}
@media (min-width: 640px) { .nuh-stat-num { font-size: 1.5rem; } }
.nuh-stat-lab {
	display: block;
	margin-top: 2px;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(var(--nuh-fg), 0.45);
}
@media (min-width: 640px) { .nuh-stat-lab { font-size: 10px; } }

.nuh-cta-wrap { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
@media (min-width: 1024px) { .nuh-cta-wrap { align-items: flex-end; } }
.nuh-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: var(--nuh-green);
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	padding: 13px 22px;
	border-radius: 999px;
	box-shadow: 0 10px 26px color-mix(in srgb, var(--nuh-green) 35%, transparent);
	transition: transform 0.15s ease, filter 0.15s ease;
}
.nuh-cta:hover { filter: brightness(1.05); transform: translateY(-1px); }
.nuh-wa-ico { width: 20px; height: 20px; fill: #fff; }
.nuh-subline { font-size: 11px; color: rgba(var(--nuh-fg), 0.55); text-align: center; }
@media (min-width: 1024px) { .nuh-subline { text-align: end; } }

/* ---- Full-bleed before/after band --------------------------------------- */
.nuh-band {
	margin-top: 32px;
	padding: 28px 0;
	border-top: 1px solid rgba(255, 255, 255, 0.10);
	border-bottom: 1px solid rgba(255, 255, 255, 0.10);
	background: rgba(14, 26, 48, 0.35);
}
@media (min-width: 640px) { .nuh-band { margin-top: 40px; padding: 36px 0; } }

.nuh-band-head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}
.nuh-band-eye {
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(var(--nuh-fg), 0.45);
}
.nuh-band-title {
	font-family: "Plus Jakarta Sans", Inter, sans-serif;
	font-size: 1.3rem;
	font-weight: 800;
	margin: 2px 0 0;
	color: rgb(var(--nuh-fg));
}
.nuh-band-count {
	flex: none;
	font-size: 12px;
	font-weight: 700;
	color: var(--nuh-green);
	background: color-mix(in srgb, var(--nuh-green) 15%, transparent);
	padding: 5px 12px;
	border-radius: 999px;
}

.nuh-ba-marquee {
	position: relative;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent);
}
.nuh-ba-track {
	display: flex;
	gap: 20px;
	width: max-content;
	animation: nuh-marquee-right 52s linear infinite;
	will-change: transform;
	padding: 0 16px;
}
.nuh-ba-marquee:hover .nuh-ba-track { animation-play-state: paused; }
@keyframes nuh-marquee-right {
	from { transform: translateX(-50%); }
	to   { transform: translateX(0); }
}

.nuh-ba-card {
	flex: none;
	width: 300px;
	border: 1px solid rgba(255, 255, 255, 0.10);
	background: rgba(255, 255, 255, 0.05);
	border-radius: var(--nuh-radius);
	padding: 12px;
	backdrop-filter: blur(4px);
}
@media (min-width: 1024px) { .nuh-ba-card { width: 320px; } }
.nuh-ba-img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--nuh-radius-sm);
	display: block;
}
.nuh-ba-body { padding: 12px 4px 4px; }
.nuh-ba-title { font-size: 15px; font-weight: 700; margin: 0; color: rgb(var(--nuh-fg)); }
.nuh-ba-meta { font-size: 12px; color: rgba(var(--nuh-fg), 0.6); margin: 4px 0 0; }
.nuh-ba-save {
	display: inline-block;
	margin-top: 10px;
	font-size: 12px;
	font-weight: 700;
	color: var(--nuh-green);
	background: color-mix(in srgb, var(--nuh-green) 15%, transparent);
	padding: 4px 12px;
	border-radius: 999px;
}
.nuh-consent {
	margin: 16px 0 0;
	font-size: 12px;
	color: rgba(var(--nuh-fg), 0.5);
}

/* ---- Desktop / mobile visibility --------------------------------------- */
.nuh-desktop { display: none; }
.nuh-mobile { display: block; }
@media (min-width: 1024px) {
	.nuh-desktop { display: block; }
	.nuh-mobile { display: none; }
}
/* Before/after switches at md (768) per the guide */
.nuh-band .nuh-desktop { display: none; }
.nuh-band .nuh-mobile { display: block; }
@media (min-width: 768px) {
	.nuh-band .nuh-desktop { display: block; }
	.nuh-band .nuh-mobile { display: none; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
	.nuh-rev-track, .nuh-ba-track { animation: none; }
}

/* =========================================================================
   Contrast overrides (v1.0.2)
   The theme/Elementor global kit sets heading colors with higher specificity,
   which made headings render dark on the navy. Force the section's own text
   colors so they are always readable. Scoped under .nuh-proof so nothing leaks.
   ========================================================================= */
.nuh-proof .nuh-h2,
.nuh-proof .nuh-say-title,
.nuh-proof .nuh-band-title,
.nuh-proof .nuh-stat-num,
.nuh-proof .nuh-ba-title,
.nuh-proof .nuh-rev-name,
.nuh-proof .nuh-google-chip strong { color: rgb(var(--nuh-fg)) !important; }

.nuh-proof .nuh-vid-name { color: #fff !important; }

/* CTA button: theme link color was bleeding green onto the green button.
   Force white text + icon so the WhatsApp CTA is always readable. */
.nuh-proof .nuh-cta,
.nuh-proof a.nuh-cta,
.nuh-proof .nuh-cta:link,
.nuh-proof .nuh-cta:visited,
.nuh-proof .nuh-cta:hover,
.nuh-proof .nuh-cta:focus,
.nuh-proof .nuh-cta:active { color: #fff !important; }
.nuh-proof .nuh-cta .nuh-wa-ico,
.nuh-proof .nuh-cta svg { fill: #fff !important; }

.nuh-proof .nuh-h2 .nuh-green,
.nuh-proof .nuh-green,
.nuh-proof .nuh-eyebrow,
.nuh-proof .nuh-rev-proc,
.nuh-proof .nuh-vid-proc,
.nuh-proof .nuh-rating-pill,
.nuh-proof .nuh-band-count,
.nuh-proof .nuh-ba-save,
.nuh-proof .nuh-avatar { color: var(--nuh-green) !important; }

.nuh-proof .nuh-rev-quote,
.nuh-proof .nuh-ba-meta { color: rgba(var(--nuh-fg), 0.85) !important; }

.nuh-proof .nuh-say-eye,
.nuh-proof .nuh-band-eye,
.nuh-proof .nuh-google-chip,
.nuh-proof .nuh-subcopy,
.nuh-proof .nuh-subline,
.nuh-proof .nuh-consent,
.nuh-proof .nuh-stat-lab,
.nuh-proof .nuh-swipe-hint { color: rgba(var(--nuh-fg), 0.6) !important; }

/* =========================================================================
   Video player states (v1.0.4)
   Preview: play badge + caption visible. Playing: they fade out so native
   controls are fully usable; they return when the video is paused/ended.
   ========================================================================= */
.nuh-vid-cap { transition: opacity 0.25s ease; }
.nuh-video-card.nuh-is-playing .nuh-playbtn { opacity: 0; pointer-events: none; }
.nuh-video-card.nuh-is-playing .nuh-vid-cap { opacity: 0; pointer-events: none; }

/* =========================================================================
   NUH AGENT FIXES
   1) Theme/Elementor global <button> styling overrides the plugin's
      `background: transparent` on .nuh-playbtn, painting brand green across
      the entire video frame and hiding the poster. Restate with weight.
   2) Testimonials are portrait 9:16 but the frame was landscape, so
      object-fit: contain letterboxed them. Match frame to footage.
   ========================================================================= */
.nuh-proof .nuh-playbtn,
.nuh-proof .nuh-playbtn:hover,
.nuh-proof .nuh-playbtn:focus,
.nuh-proof .nuh-playbtn:active {
	background: transparent !important;
	background-image: none !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	border-radius: 0 !important;
	min-height: 0 !important;
	color: inherit !important;
}

.nuh-proof .nuh-swipe-btn,
.nuh-proof .nuh-swipe-btn-sm {
	background: rgba(255, 255, 255, 0.15) !important;
	background-image: none !important;
	border: 1px solid rgba(255, 255, 255, 0.30) !important;
	box-shadow: none !important;
	padding: 0 !important;
	min-height: 0 !important;
}
.nuh-proof .nuh-swipe-btn:hover,
.nuh-proof .nuh-swipe-btn-sm:hover {
	background: rgba(255, 255, 255, 0.25) !important;
}

.nuh-proof .nuh-vid-frame {
	height: auto !important;
	aspect-ratio: 9 / 16;
	max-width: 242px;
	margin-inline: auto;
}
.nuh-proof .nuh-video,
.nuh-proof .nuh-video-fallback {
	object-fit: cover;
}
/* -------------------------------------------------------------------------
   RTL fix: before/after marquee
   In RTL the track box is anchored to the right edge and extends LEFT, so the
   LTR keyframe (translateX(-50%) -> 0) drives it off-screen and the band looks
   empty. Travelling 0 -> +50% instead keeps the strip populated for the whole
   loop. Text direction is untouched.
   ---------------------------------------------------------------------- */
@keyframes nuh-marquee-right-rtl {
	from { transform: translateX(0); }
	to   { transform: translateX(50%); }
}
.nuh-proof[dir="rtl"] .nuh-ba-track {
	animation-name: nuh-marquee-right-rtl;
}
/* gap fix: reviews column fills the row height on desktop (26 Sep 2026) */
@media (min-width: 1024px) {
	.nuh-proof .nuh-col-right { display: flex; flex-direction: column; }
	.nuh-proof .nuh-say-head { flex: none; }
	/* flex-basis 0: marquee takes the column's leftover height, never its content height */
	.nuh-proof .nuh-rev-marquee.nuh-desktop { flex: 1 1 0; height: auto; min-height: 430px; position: relative; }
	/* track out of flow (as in the Lovable build) so the 2x card stack cannot stretch the column */
	.nuh-proof .nuh-rev-marquee.nuh-desktop .nuh-rev-track { position: absolute; top: 0; inset-inline: 0; }
}

/* mobile before/after: card fills the swipe slot (was fixed 300px, start-aligned) */
@media (max-width: 767px) {
	.nuh-proof .nuh-band .nuh-swipe .nuh-ba-card { width: 100%; max-width: 100%; }
}
