.bac-card{
	--bac-ink:#2f2b28;      /* headings */
	--bac-muted:#8a7c6e;    /* body copy */
	--bac-accent:#5f8a86;   /* eyebrow + accent */
	--bac-line:#e9e4dc;     /* borders */
	--bac-handle:#ffffff;   /* slider handle */
	--bac-radius:18px;
	--bac-ratio:4 / 3;      /* media aspect ratio */

	box-sizing:border-box;
	width:100%;
	height:100%;            /* stretch to match siblings in the row */
	display:flex;
	flex-direction:column;
	background:#fff;
	border:1px solid var(--bac-line);
	border-radius:var(--bac-radius);
	overflow:hidden;
	font-family:'Poppins',system-ui,sans-serif;
}
.bac-card *{box-sizing:border-box;}

/* the widget wrappers must stretch too, or height:100% has nothing to fill */
.elementor-widget-before-after-card,
.elementor-widget-before-after-card .elementor-widget-container{
	height:100%;
}

/* --- comparison stage --- */
.bac-compare{
	position:relative;
	flex:0 0 auto;
	aspect-ratio:var(--bac-ratio);
	line-height:0;
	overflow:hidden;
	cursor:ew-resize;
	touch-action:pan-y;
	user-select:none;
	-webkit-user-select:none;
}
.bac-compare img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	pointer-events:none;
}
.bac-compare__before,
.bac-compare__before img{width:100%;height:100%;}
.bac-compare__after{
	position:absolute;
	inset:0;
	will-change:clip-path;
}

/* pill labels */
.bac-tag{
	position:absolute;
	z-index:3;
	padding:6px 14px;
	border-radius:999px;
	font-size:11px;
	font-weight:500;
	letter-spacing:.14em;
	line-height:1;
	pointer-events:none;
}
.bac-tag--before{
	top:16px;left:16px;
	background:rgba(255,255,255,.9);
	color:#4a443d;
	-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.bac-tag--after{
	top:16px;right:16px;
	background:rgba(60,72,64,.82);
	color:#f4f1ea;
	-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
/* bottom bar: drag hint (left) + caption (right) */
.bac-bar{
	position:absolute;
	left:16px;right:16px;
	bottom:16px;
	z-index:3;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:11px 20px;
	border-radius:999px;
	background:rgba(255,255,255,.88);
	-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
	pointer-events:none;
}
.bac-bar__hint,
.bac-bar__caption{
	font-size:11px;
	font-weight:500;
	letter-spacing:.12em;
	line-height:1.3;
	text-transform:uppercase;
}
.bac-bar__hint{color:#6a625a;}
.bac-bar__caption{color:#4a443d;text-align:right;}

/* handle */
.bac-handle{
	position:absolute;
	top:0;bottom:0;
	left:50%;
	z-index:4;
	width:44px;
	margin-left:-22px;
	padding:0;
	border:0;
	background:transparent;
	cursor:ew-resize;
	display:flex;
	align-items:center;
	justify-content:center;
}
/* the vertical divider line */
.bac-handle::before{
	content:"";
	position:absolute;
	top:0;bottom:0;
	left:50%;
	width:3px;
	margin-left:-1.5px;
	background:var(--bac-handle);
	box-shadow:0 0 6px rgba(0,0,0,.25);
}
/* the round grip */
.bac-handle svg{
	position:relative;
	width:40px;height:40px;
	padding:8px;
	border-radius:50%;
	background:var(--bac-handle);
	color:#4a443d;
	box-shadow:0 4px 14px -4px rgba(0,0,0,.5);
}
.bac-handle:focus-visible{outline:none;}
.bac-handle:focus-visible svg{outline:2px solid var(--bac-accent);outline-offset:3px;}

/* --- text body --- */
.bac-card__body{
	flex:1 1 auto;   /* absorbs the leftover height so cards end level */
	padding:26px 26px 24px;
}
.bac-card__eyebrow{
	display:block;
	margin-bottom:10px;
	font-size:12px;
	font-weight:500;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--bac-accent);
}
.bac-card__title{
	margin:0 0 12px;
	font-family:'Playfair Display',serif;
	font-weight:600;
	font-size:24px;
	line-height:1.2;
	color:var(--bac-ink);
}
.bac-card__text{
	margin:0;
	font-size:15px;
	line-height:1.65;
	color:var(--bac-muted);
}
/* optional: trim to a fixed number of lines so text blocks align */
.bac-card--clamp .bac-card__text{
	display:-webkit-box;
	-webkit-line-clamp:var(--bac-lines,3);
	line-clamp:var(--bac-lines,3);
	-webkit-box-orient:vertical;
	overflow:hidden;
}

@media (prefers-reduced-motion:reduce){
	.bac-tag--hint{transition:none;}
}

/* ============================================================
   Gallery button + popup (added in v1.1.0)
   ============================================================ */

/* button colour tokens live on .bac-card */
.bac-card{
	--bac-btn-bg:#3c4840;
	--bac-btn-bg-hover:#2f3a33;
	--bac-btn-fg:#f4f1ea;
	--bac-btn-border:transparent;
}

.bac-card__actions{
	display:flex;
	flex-direction:column;
	margin-top:18px;
}
/* Scoped + !important on the colour props so a theme's generic
   button/link :hover rule can't repaint it white. */
.bac-card .bac-gallery-btn,
.bac-card .bac-gallery-btn:link,
.bac-card .bac-gallery-btn:visited{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:9px;
	padding:11px 20px;
	border-radius:999px;
	border:1px solid var(--bac-btn-border) !important;
	background:var(--bac-btn-bg) !important;
	color:var(--bac-btn-fg) !important;
	font-family:'Poppins',system-ui,sans-serif;
	font-size:13px;
	font-weight:500;
	letter-spacing:.04em;
	line-height:1;
	cursor:pointer;
	text-decoration:none !important;
	box-shadow:none;
	transition:background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
	-webkit-appearance:none;appearance:none;
}
.bac-card .bac-gallery-btn svg{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;}
.bac-card .bac-gallery-btn:hover,
.bac-card .bac-gallery-btn:focus,
.bac-card .bac-gallery-btn:active{
	background:var(--bac-btn-bg-hover) !important;
	color:var(--bac-btn-fg-hover, var(--bac-btn-fg)) !important;
	transform:translateY(-1px);
	box-shadow:0 8px 18px -8px rgba(0,0,0,.45);
}
.bac-card .bac-gallery-btn:focus-visible{outline:2px solid var(--bac-accent);outline-offset:3px;}

/* --- modal shell --- */
.bac-modal{
	position:fixed;
	inset:0;
	z-index:99999;
	display:none;
	align-items:center;
	justify-content:center;
	padding:clamp(14px,4vw,40px);
	font-family:'Poppins',system-ui,sans-serif;
}
.bac-modal.is-open{display:flex;}
.bac-modal__backdrop{
	position:absolute;
	inset:0;
	background:rgba(24,22,20,.72);
	-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
	opacity:0;
	transition:opacity .25s ease;
}
.bac-modal.is-open .bac-modal__backdrop{opacity:1;}

.bac-modal__dialog{
	position:relative;
	width:min(920px,100%);
	max-height:calc(100vh - 2 * clamp(14px,4vw,40px));
	display:flex;
	flex-direction:column;
	background:#fff;
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 30px 80px -20px rgba(0,0,0,.6);
	transform:translateY(14px) scale(.98);
	opacity:0;
	transition:transform .28s cubic-bezier(.2,.8,.25,1), opacity .28s ease;
}
.bac-modal.is-open .bac-modal__dialog{transform:none;opacity:1;}

/* close */
.bac-modal__close{
	position:absolute;
	top:12px;right:12px;
	z-index:6;
	width:40px;height:40px;
	display:flex;align-items:center;justify-content:center;
	border:0;border-radius:50%;
	background:rgba(255,255,255,.92);
	color:#3c4840;
	cursor:pointer;
	box-shadow:0 4px 14px -4px rgba(0,0,0,.4);
	transition:background .18s ease, transform .18s ease;
}
.bac-modal__close svg{width:20px;height:20px;}
.bac-modal__close:hover{background:#fff;transform:rotate(90deg);}
.bac-modal__close:focus-visible{outline:2px solid var(--bac-accent,#5f8a86);outline-offset:2px;}

/* viewport / track (the slider) */
.bac-modal__viewport{
	position:relative;
	flex:1 1 auto;
	overflow:hidden;
}
.bac-modal__track{
	display:flex;
	height:100%;
	transition:transform .38s cubic-bezier(.2,.8,.25,1);
	will-change:transform;
}
.bac-slide{
	flex:0 0 100%;
	width:100%;
	display:flex;
	flex-direction:column;
	min-width:0;
}

/* single image per slide, sized to fit the viewport */
.bac-slide__media{
	flex:1 1 auto;
	min-height:0;
	max-height:80vh;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#0f0f0f;
	line-height:0;
	overflow:hidden;
}
.bac-slide__media img{
	max-width:100%;
	max-height:80vh;
	width:auto;
	height:auto;
	object-fit:contain;
	display:block;
	-webkit-user-drag:none;
	user-select:none;
}
/* Cover mode: fill the stage (may crop) */
.bac-modal.bac-fit--cover .bac-slide__media{height:80vh;}
.bac-modal.bac-fit--cover .bac-slide__media img{
	width:100%;
	height:100%;
	max-width:none;
	max-height:none;
	object-fit:cover;
}

/* slide caption */
.bac-slide__body{
	flex:0 0 auto;
	padding:18px 22px 20px;
	text-align:center;
}
.bac-slide__title{
	margin:0 0 6px;
	font-family:'Playfair Display',serif;
	font-weight:600;
	font-size:20px;
	line-height:1.25;
	color:var(--bac-ink,#2f2b28);
}
.bac-slide__caption{
	margin:0;
	font-size:14px;
	line-height:1.6;
	color:var(--bac-muted,#8a7c6e);
}

/* prev / next arrows */
.bac-modal__nav{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	z-index:5;
	width:46px;height:46px;
	display:flex;align-items:center;justify-content:center;
	border:0;border-radius:50%;
	background:rgba(255,255,255,.92);
	color:#3c4840;
	cursor:pointer;
	box-shadow:0 6px 18px -6px rgba(0,0,0,.5);
	transition:background .18s ease, transform .18s ease;
}
.bac-modal__nav svg{width:22px;height:22px;}
.bac-modal__nav--prev{left:14px;}
.bac-modal__nav--next{right:14px;}
.bac-modal__nav:hover{background:#fff;}
.bac-modal__nav--prev:hover{transform:translateY(-50%) translateX(-2px);}
.bac-modal__nav--next:hover{transform:translateY(-50%) translateX(2px);}
.bac-modal__nav:focus-visible{outline:2px solid var(--bac-accent,#5f8a86);outline-offset:2px;}

/* dots */
.bac-modal__dots{
	position:absolute;
	left:0;right:0;
	bottom:14px;
	z-index:5;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	pointer-events:none;
}
.bac-dot{
	pointer-events:auto;
	width:9px;height:9px;
	padding:0;border:0;border-radius:50%;
	background:rgba(60,72,64,.28);
	cursor:pointer;
	transition:background .18s ease, transform .18s ease;
}
.bac-dot:hover{background:rgba(60,72,64,.5);}
.bac-dot.is-current{background:var(--bac-accent,#5f8a86);transform:scale(1.25);}
.bac-dot:focus-visible{outline:2px solid var(--bac-accent,#5f8a86);outline-offset:2px;}

/* counter */
.bac-modal__counter{
	position:absolute;
	top:16px;left:16px;
	z-index:5;
	padding:5px 12px;
	border-radius:999px;
	background:rgba(255,255,255,.9);
	color:#4a443d;
	font-size:12px;
	font-weight:500;
	letter-spacing:.06em;
	line-height:1;
}

/* lock the page while the popup is open */
html.bac-lock,
body.bac-lock{overflow:hidden;}

@media (max-width:600px){
	.bac-modal__nav{width:40px;height:40px;}
	.bac-slide__media,
	.bac-slide__media img{max-height:72vh;}
	.bac-modal.bac-fit--cover .bac-slide__media{height:72vh;}
}

@media (prefers-reduced-motion:reduce){
	.bac-modal__backdrop,
	.bac-modal__dialog,
	.bac-modal__track,
	.bac-modal__close,
	.bac-modal__nav,
	.bac-gallery-btn{transition:none;}
}
