/* Casa Tarafurilor — main.css v4.6.4 */

:root {
	--ct-bg:        #faf6ee;
	--ct-bg-alt:    #f3ecdd;
	--ct-bg-elev:   #ffffff;
	--ct-surface:   #ece4d2;
	--ct-ink:       #2a1f1a;
	--ct-ink-soft:  #5a4a40;
	--ct-ink-muted: #8a7a6c;
	--ct-burgundy:  #7a1d20;
	--ct-gold:      #a3781f;
	--ct-mauve:     #8a5a52;
	--ct-line:      rgba(42, 31, 26, 0.12);
	--ct-line-strong: rgba(163, 120, 31, 0.35);
	--ct-display:   'Fraunces', Georgia, serif;
	--ct-body:      'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
	--ct-container: 1240px;
	--ct-radius:    6px;
	--ct-radius-lg: 12px;
	--ct-ease:      cubic-bezier(.2, .8, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
	margin: 0;
	background: var(--ct-bg);
	color: var(--ct-ink);
	font-family: var(--ct-body);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
	text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--ct-burgundy); text-decoration: none; transition: color .2s var(--ct-ease); }
a:hover { color: var(--ct-gold); }

h1, h2, h3 {
	font-family: var(--ct-display);
	font-weight: 500;
	font-variation-settings: "opsz" 144;
	letter-spacing: -0.015em;
	line-height: 1.15;
	color: var(--ct-ink);
	margin: 0 0 .6em;
}

::selection { background: var(--ct-gold); color: var(--ct-bg); }

.ct-skip {
	position: absolute; left: -9999px; top: -9999px;
	padding: 12px 16px; background: var(--ct-burgundy); color: #fff;
	z-index: 999; font-weight: 600; border-radius: 0 0 6px 6px;
}
.ct-skip:focus { left: 16px; top: 16px; }

a:focus-visible, button:focus-visible {
	outline: 2px solid var(--ct-burgundy);
	outline-offset: 3px;
	border-radius: 3px;
}

.ct-container {
	max-width: var(--ct-container);
	margin: 0 auto;
	padding: 0 28px;
}
@media (max-width: 600px) { .ct-container { padding: 0 18px; } }
@media (max-width: 380px) { .ct-container { padding: 0 14px; } }

/* Header */
.ct-site-header {
	background: var(--ct-bg);
	border-bottom: 1px solid var(--ct-line);
	padding: 32px 0 24px;
}
.ct-header-inner { display: flex; justify-content: center; align-items: center; }
/* v4.6.4: logo bumped to match the visual size of the hero title
   "Noi îi avem pe cei mai buni." (the logo asset has internal transparent
   padding, so the rendered logo at 120px looked smaller than 3.6rem text). */
.ct-brand-img, .custom-logo { max-height: 240px; width: auto; height: auto; display: block; }
@media (max-width: 600px) {
	.ct-site-header { padding: 22px 0 18px; }
	.ct-brand-img, .custom-logo { max-height: 160px; }
}
@media (max-width: 380px) {
	.ct-brand-img, .custom-logo { max-height: 136px; }
}

/* ---------------------------------------------------------------------------
 * Hero — tagline + dual CTA. Lives between site header and first taraf.
 * ------------------------------------------------------------------------- */
.ct-hero {
	background:
		radial-gradient(ellipse at top, rgba(163, 120, 31, 0.08) 0%, transparent 60%),
		linear-gradient(180deg, var(--ct-bg) 0%, var(--ct-bg-alt) 100%);
	padding: 72px 0 88px;
	text-align: center;
	border-bottom: 1px solid var(--ct-line);
}
@media (max-width: 600px) {
	.ct-hero { padding: 44px 0 56px; }
}
.ct-hero-inner { max-width: 780px; }

.ct-hero-eyebrow {
	font-family: var(--ct-display);
	font-size: clamp(2.2rem, 5.4vw, 3.6rem);
	font-variation-settings: "opsz" 144, "SOFT" 30;
	line-height: 1.08;
	color: var(--ct-ink-soft);
	margin: 0 0 18px;
}
.ct-hero-title {
	font-size: clamp(2.2rem, 5.4vw, 3.6rem);
	font-weight: 500;
	font-variation-settings: "opsz" 144, "SOFT" 30;
	margin: 0 0 18px;
	line-height: 1.08;
	color: var(--ct-ink);
}
.ct-hero-sub {
	font-size: clamp(1.05rem, 2vw, 1.2rem);
	line-height: 1.55;
	color: var(--ct-ink-soft);
	margin: 0 0 14px;
}
.ct-hero-open {
	font-size: 1rem;
	color: var(--ct-ink-soft);
	margin: 0 0 32px;
}
.ct-hero-open strong { color: var(--ct-ink); font-weight: 600; }
.ct-hero-247 {
	display: inline-block;
	background: var(--ct-burgundy);
	color: #fff;
	padding: 2px 10px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 0.92em;
	letter-spacing: 0.02em;
	margin: 0 2px;
}
.ct-hero-ctas {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
}
.ct-hero-secondary-phone {
	margin: 18px 0 0;
	font-size: 0.95rem;
	color: var(--ct-ink-soft);
	text-align: center;
}
.ct-hero-secondary-phone a {
	color: var(--ct-burgundy);
	text-decoration: none;
	font-weight: 600;
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
	transition: border-color .2s var(--ct-ease);
}
.ct-hero-secondary-phone a:hover,
.ct-hero-secondary-phone a:focus-visible {
	border-bottom-color: var(--ct-burgundy);
}
@media (max-width: 600px) {
	.ct-hero-open { margin: 0 0 24px; }
	.ct-hero-ctas { gap: 10px; flex-direction: column; align-items: stretch; padding: 0 8px; }
	.ct-hero-secondary-phone { margin-top: 14px; font-size: 0.9rem; }
}

/* ---------------------------------------------------------------------------
 * CTAs — used in hero and after each taraf section.
 * ------------------------------------------------------------------------- */
.ct-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 26px;
	border-radius: 999px;
	font-family: inherit;
	font-weight: 600;
	font-size: 1rem;
	letter-spacing: 0.01em;
	line-height: 1.2;
	min-height: 48px;
	cursor: pointer;
	transition: transform .22s var(--ct-ease), background .22s var(--ct-ease),
	            color .22s var(--ct-ease), border-color .22s var(--ct-ease),
	            box-shadow .22s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
	text-decoration: none;
	white-space: nowrap;
}
.ct-cta-icon { width: 18px; height: 18px; flex: 0 0 auto; }

.ct-cta-primary {
	background: var(--ct-burgundy);
	color: #fff;
	border: 1px solid var(--ct-burgundy);
	box-shadow: 0 6px 18px rgba(122, 29, 32, 0.22);
}
.ct-cta-primary:hover,
.ct-cta-primary:focus-visible {
	background: var(--ct-ink);
	border-color: var(--ct-ink);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 10px 24px rgba(42, 31, 26, 0.25);
}

.ct-cta-ghost {
	background: transparent;
	color: var(--ct-ink);
	border: 1px solid var(--ct-ink);
}
.ct-cta-ghost:hover,
.ct-cta-ghost:focus-visible {
	background: var(--ct-ink);
	color: var(--ct-bg);
	transform: translateY(-1px);
}

.ct-cta-phone-display { opacity: 0.85; font-weight: 500; }
@media (max-width: 480px) {
	.ct-cta-phone-display { display: none; }
}

/* Each Taraf section
 *
 * content-visibility: auto + contain-intrinsic-size let the browser skip
 * layout/paint of off-screen sections entirely. With 8 sections totaling
 * ~50 images this is a major scroll/load perf win on mobile.
 * ------------------------------------------------------------------------- */
.ct-taraf {
	padding: 88px 0 64px;
	content-visibility: auto;
	contain-intrinsic-size: auto 900px;
}
.ct-taraf-alt { background: var(--ct-bg-alt); }
@media (max-width: 600px) {
	.ct-taraf { padding: 56px 0 44px; contain-intrinsic-size: auto 760px; }
}

.ct-taraf-title {
	font-size: clamp(1.85rem, 3.6vw, 2.7rem);
	font-weight: 500;
	font-variation-settings: "opsz" 96, "SOFT" 30;
	margin: 0 0 28px;
	text-align: left;
}
.ct-taraf-bio {
	color: var(--ct-ink-soft);
	font-size: 1.04rem;
	line-height: 1.78;
	margin: 0 0 24px;
}
.ct-taraf-bio p:last-child { margin-bottom: 0; }
@media (max-width: 600px) {
	.ct-taraf-title { margin: 0 0 18px; }
	.ct-taraf-bio { font-size: 1rem; line-height: 1.7; }
}

/* 2-col grid: video (left) | bio + social (right). Mobile → stack. */
.ct-taraf-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 36px;
	align-items: start;
	margin-bottom: 40px;
}
.ct-taraf-grid--no-video {
	grid-template-columns: minmax(0, 1fr);
	max-width: 70ch;
}
.ct-taraf-video-col {
	min-width: 0;
}
.ct-taraf-bio-col {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
@media (max-width: 860px) {
	.ct-taraf-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
		margin-bottom: 28px;
	}
}

/* Social/audio links */
.ct-links {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: flex-start;
	list-style: none;
	margin: 0;
	padding: 0;
}
.ct-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: var(--ct-ink-soft);
	background: var(--ct-bg-elev);
	border: 1px solid var(--ct-line);
	transition: all .25s var(--ct-ease);
}
.ct-links a svg { width: 17px; height: 17px; }
.ct-links a:hover {
	color: #fff;
	background: var(--ct-burgundy);
	border-color: var(--ct-burgundy);
	transform: translateY(-2px);
}
@media (max-width: 600px) {
	/* 44px = Apple HIG minimum touch target */
	.ct-links a { width: 44px; height: 44px; }
	.ct-links a svg { width: 18px; height: 18px; }
}

/* ---------------------------------------------------------------------------
 * Single-row horizontal gallery
 * ------------------------------------------------------------------------- */
.ct-gallery-wrap {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Gallery arrow navigation buttons (desktop) */
.ct-gallery-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: var(--ct-burgundy);
	border: 1px solid var(--ct-line);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	box-shadow: 0 6px 18px rgba(42, 31, 26, 0.18);
	transition: transform .22s var(--ct-ease), background .22s var(--ct-ease), opacity .22s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
}
.ct-gallery-nav svg { width: 22px; height: 22px; }
.ct-gallery-nav:hover,
.ct-gallery-nav:focus-visible {
	background: #fff;
	transform: translateY(-50%) scale(1.06);
}
.ct-gallery-nav[hidden] { display: none; }
.ct-gallery-prev { left: 8px; }
.ct-gallery-next { right: 8px; }
@media (max-width: 600px) {
	.ct-gallery-nav { display: none; }
}

.ct-gallery {
	display: flex;
	flex-wrap: nowrap;
	gap: 14px;
	max-width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 28px;
	scroll-behavior: smooth;
	scrollbar-width: thin;
	scrollbar-color: var(--ct-mauve) transparent;
	padding: 4px 28px 18px;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-x;
	overscroll-behavior-x: contain;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%);
}
@media (max-width: 600px) {
	.ct-gallery {
		padding: 4px 18px 14px;
		scroll-padding-inline: 18px;
		gap: 10px;
		/* Hide scrollbar on touch — the scroll snap and mask are enough hints */
		scrollbar-width: none;
		-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
		mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
	}
	.ct-gallery::-webkit-scrollbar { display: none; }
}
.ct-gallery::-webkit-scrollbar { height: 8px; }
.ct-gallery::-webkit-scrollbar-track { background: transparent; }
.ct-gallery::-webkit-scrollbar-thumb {
	background: var(--ct-mauve); border-radius: 4px; opacity: 0.6;
}

.ct-gallery-item {
	flex: 0 0 auto;
	width: clamp(220px, 28vw, 360px);
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--ct-radius);
	background: var(--ct-surface);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset, 0 6px 18px rgba(42, 31, 26, 0.12);
	scroll-snap-align: start;
	display: block;
	cursor: zoom-in;
	-webkit-tap-highlight-color: transparent;
}
.ct-gallery-item img,
.ct-gallery-item .ct-gallery-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* v4.6.3: anchor crop at 25% from top (face line on a typical
	   half/three-quarter-body portrait). v4.6.2 used `center top` which
	   was too aggressive — pushed photos so high that the headroom
	   dominated and faces hugged the bottom edge. 25% keeps faces in the
	   upper third of the visible frame without clipping heads. */
	object-position: center 25%;
	transition: transform 1s var(--ct-ease);
}
@media (hover: hover) {
	.ct-gallery-item:hover img,
	.ct-gallery-item:hover .ct-gallery-img { transform: scale(1.04); }
}
@media (max-width: 600px) { .ct-gallery-item { width: 78vw; max-width: 360px; } }
@media (max-width: 380px) { .ct-gallery-item { width: 84vw; } }

/* ---------------------------------------------------------------------------
 * Video carousel — single featured video slot (16:9) with prev/next arrows.
 * Click on the slot opens the popup player modal (.ct-vlb).
 * ------------------------------------------------------------------------- */
.ct-video-carousel {
	position: relative;
	width: 100%;
}

.ct-vc-stage {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--ct-radius);
	overflow: hidden;
	background: var(--ct-ink);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 12px 28px rgba(42, 31, 26, 0.22);
}

/* Each slide fills the stage; only .is-active is visible (others get `hidden`). */
.ct-video-item {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	background: var(--ct-ink);
	font: inherit;
}
.ct-video-item[hidden] { display: none; }

.ct-video-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .9s var(--ct-ease), opacity .25s var(--ct-ease);
	opacity: 0.94;
}
.ct-video-item:hover .ct-video-thumb,
.ct-video-item:focus-visible .ct-video-thumb { opacity: 1; }
@media (hover: hover) {
	.ct-video-item:hover .ct-video-thumb { transform: scale(1.04); }
}

.ct-video-play {
	position: absolute;
	top: 50%; left: 50%;
	width: 72px; height: 72px;
	margin: -36px 0 0 -36px;
	background: rgba(255, 255, 255, 0.94);
	color: var(--ct-burgundy);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
	transition: transform .22s var(--ct-ease), background .22s var(--ct-ease);
	pointer-events: none;
}
.ct-video-play svg { width: 30px; height: 30px; margin-left: 3px; /* optical center for triangle */ }
.ct-video-item:hover .ct-video-play,
.ct-video-item:focus-visible .ct-video-play {
	transform: scale(1.08);
	background: #fff;
}
@media (max-width: 600px) {
	.ct-video-play { width: 56px; height: 56px; margin: -28px 0 0 -28px; }
	.ct-video-play svg { width: 22px; height: 22px; }
}

/* Carousel arrows — overlaid on the video stage. */
.ct-vc-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: var(--ct-burgundy);
	border: 1px solid var(--ct-line);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	box-shadow: 0 6px 18px rgba(42, 31, 26, 0.18);
	transition: transform .22s var(--ct-ease), background .22s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
}
.ct-vc-nav svg { width: 22px; height: 22px; }
.ct-vc-nav:hover,
.ct-vc-nav:focus-visible {
	background: #fff;
	transform: translateY(-50%) scale(1.06);
}
.ct-vc-prev { left: 10px; }
.ct-vc-next { right: 10px; }
@media (max-width: 600px) {
	.ct-vc-nav { width: 40px; height: 40px; }
	.ct-vc-nav svg { width: 20px; height: 20px; }
}

.ct-vc-counter {
	position: absolute;
	right: 10px;
	bottom: 10px;
	z-index: 4;
	background: rgba(42, 31, 26, 0.72);
	color: #fff;
	font-size: 0.82rem;
	font-weight: 500;
	padding: 4px 10px;
	border-radius: 999px;
	pointer-events: none;
	letter-spacing: 0.02em;
}

/* Separator */
.ct-separator {
	border: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, var(--ct-line-strong) 50%, transparent 100%);
	margin: 0;
	position: relative;
}
.ct-separator::after {
	content: '';
	position: absolute;
	left: 50%; top: 50%;
	width: 8px; height: 8px;
	background: var(--ct-gold);
	border-radius: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
	box-shadow: 0 0 0 4px var(--ct-bg);
}
.ct-taraf-alt + .ct-separator::after { box-shadow: 0 0 0 4px var(--ct-bg-alt); }

/* Page (legal) */
.ct-page { padding: 80px 0 96px; }
@media (max-width: 600px) { .ct-page { padding: 48px 0 64px; } }
.ct-prose {
	font-size: 1.02rem;
	line-height: 1.8;
	color: var(--ct-ink-soft);
	max-width: 72ch;
	margin: 0 auto;
}
.ct-prose h1 {
	font-size: clamp(2rem, 4.4vw, 3rem);
	margin: 0 0 32px;
	color: var(--ct-ink);
	text-align: center;
}
.ct-prose h2 {
	font-size: 1.4rem;
	color: var(--ct-ink);
	margin-top: 2em;
	margin-bottom: 0.6em;
}
.ct-prose p { margin: 0 0 1.2em; }
.ct-prose ul, .ct-prose ol { padding-left: 1.4em; margin: 0 0 1.2em; }
.ct-prose a { color: var(--ct-burgundy); border-bottom: 1px solid var(--ct-line); }
.ct-prose a:hover { color: var(--ct-gold); border-color: var(--ct-gold); }

/* Footer */
.ct-site-footer {
	border-top: 1px solid var(--ct-line);
	padding: 44px 0 36px;
	color: var(--ct-ink-soft);
	font-size: 14px;
	background: var(--ct-bg-elev);
}
.ct-footer-inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 28px;
	flex-wrap: wrap;
}
.ct-footer-brand p { margin: 0 0 4px; }
.ct-footer-name { color: var(--ct-ink); font-weight: 500; }
.ct-footer-phones { color: var(--ct-ink-soft); font-size: 14px; }
.ct-footer-phones a {
	color: var(--ct-ink-soft);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color .2s var(--ct-ease), border-color .2s var(--ct-ease);
}
.ct-footer-phones a:hover,
.ct-footer-phones a:focus-visible {
	color: var(--ct-burgundy);
	border-bottom-color: var(--ct-burgundy);
}
.ct-footer-menu {
	display: flex;
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
	flex-wrap: wrap;
}
.ct-footer-menu a {
	color: var(--ct-ink-soft);
	font-size: 13px;
}
.ct-footer-menu a:hover { color: var(--ct-burgundy); }
@media (max-width: 600px) {
	.ct-site-footer { padding: 32px 0 28px; }
	.ct-footer-inner { flex-direction: column; gap: 18px; }
	.ct-footer-menu { gap: 14px 22px; }
}

/* Cookie banner */
.ct-cookie-banner {
	position: fixed;
	bottom: 16px; left: 16px; right: 16px;
	max-width: 580px;
	margin: 0 auto;
	background: var(--ct-bg-elev);
	border: 1px solid var(--ct-line);
	border-radius: var(--ct-radius-lg);
	padding: 20px 24px;
	z-index: 999;
	box-shadow: 0 20px 50px rgba(42, 31, 26, 0.18);
	transform: translateY(20px);
	opacity: 0;
	transition: transform .4s var(--ct-ease), opacity .4s var(--ct-ease);
}
.ct-cookie-banner[hidden] { display: none; }
.ct-cookie-banner.is-visible { transform: translateY(0); opacity: 1; }
.ct-cookie-msg {
	margin: 0 0 14px;
	color: var(--ct-ink-soft);
	font-size: 0.92rem;
}
.ct-cookie-actions {
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}
.ct-cookie-more {
	color: var(--ct-burgundy);
	font-size: 0.9rem;
	border-bottom: 1px solid var(--ct-line);
}
.ct-cookie-accept {
	background: var(--ct-burgundy);
	color: #fff;
	border: 0;
	padding: 10px 20px;
	border-radius: 999px;
	font-weight: 600;
	font-family: inherit;
	font-size: 0.9rem;
	cursor: pointer;
	min-height: 44px;
}
.ct-cookie-accept:hover { background: var(--ct-ink); }
@media (max-width: 600px) {
	.ct-cookie-banner { padding: 16px 18px; bottom: 12px; left: 12px; right: 12px; }
}

/* ---------------------------------------------------------------------------
 * Lightbox — with loading state and mobile-optimized controls
 * ------------------------------------------------------------------------- */
.ct-lb {
	position: fixed; inset: 0;
	background: rgba(20, 14, 10, 0.94);
	z-index: 9999;
	display: flex; align-items: center; justify-content: center;
	opacity: 0; pointer-events: none;
	transition: opacity .3s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
}
.ct-lb.is-open { opacity: 1; pointer-events: auto; }
.ct-lb-img {
	max-width: 92vw; max-height: 88vh;
	width: auto; height: auto;
	object-fit: contain;
	border-radius: 4px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
	opacity: 0;
	transition: opacity .25s var(--ct-ease);
}
.ct-lb-img.is-loaded { opacity: 1; }

/* Loading spinner shown while image is fetching */
.ct-lb-spinner {
	position: absolute;
	width: 36px; height: 36px;
	border: 2px solid rgba(255, 255, 255, 0.18);
	border-top-color: rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	animation: ct-spin .9s linear infinite;
	opacity: 0;
	transition: opacity .15s var(--ct-ease);
	pointer-events: none;
}
.ct-lb.is-loading .ct-lb-spinner { opacity: 1; }
@keyframes ct-spin { to { transform: rotate(360deg); } }

.ct-lb-close, .ct-lb-prev, .ct-lb-next {
	position: absolute;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: #fff;
	width: 48px; height: 48px;
	border-radius: 50%;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	transition: all .2s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
	font-family: inherit;
}
.ct-lb-close:hover, .ct-lb-prev:hover, .ct-lb-next:hover {
	background: #fff; color: var(--ct-ink); border-color: #fff;
}
.ct-lb-close { top: 24px; right: 24px; }
.ct-lb-prev  { left: 24px; top: 50%; transform: translateY(-50%); }
.ct-lb-next  { right: 24px; top: 50%; transform: translateY(-50%); }
.ct-lb-counter {
	position: absolute;
	bottom: 24px; left: 50%; transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.7);
	font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase;
}

/* Mobile: thumb-reachable controls at the bottom */
@media (max-width: 600px) {
	.ct-lb-img { max-width: 96vw; max-height: 78vh; }
	.ct-lb-close { top: 14px; right: 14px; width: 44px; height: 44px; }
	.ct-lb-prev, .ct-lb-next {
		top: auto; bottom: 22px; transform: none;
		width: 52px; height: 52px;
	}
	.ct-lb-prev { left: 18px; }
	.ct-lb-next { right: 18px; }
	.ct-lb-counter { bottom: 88px; font-size: 12px; }
}

/* ---------------------------------------------------------------------------
 * Video popup player — YouTube iframe in a modal, 16:9 responsive.
 * Iframe src is set on open and cleared on close (so the video stops).
 * ------------------------------------------------------------------------- */
.ct-vlb {
	position: fixed; inset: 0;
	background: rgba(20, 14, 10, 0.94);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	opacity: 0; pointer-events: none;
	transition: opacity .3s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
}
.ct-vlb.is-open { opacity: 1; pointer-events: auto; }

.ct-vlb-frame {
	position: relative;
	width: 100%;
	max-width: min(1200px, 92vw);
	max-height: 84vh;
}
.ct-vlb-aspect {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	max-height: 84vh;
	background: #000;
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}
.ct-vlb-iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.ct-vlb-close {
	position: absolute;
	top: 24px; right: 24px;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: #fff;
	width: 48px; height: 48px;
	border-radius: 50%;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	transition: all .2s var(--ct-ease);
	-webkit-tap-highlight-color: transparent;
	font-family: inherit;
	z-index: 1;
}
.ct-vlb-close:hover,
.ct-vlb-close:focus-visible {
	background: #fff;
	color: var(--ct-ink);
	border-color: #fff;
}
@media (max-width: 600px) {
	.ct-vlb { padding: 12px; }
	.ct-vlb-close { top: 14px; right: 14px; width: 44px; height: 44px; }
	.ct-vlb-frame { max-width: 96vw; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------------------------------------------------------------------------
 * Mobile floating "Sună acum" CTA — fixed bottom pill, mobile-only.
 * Hidden until first interaction-ready (no FOUC); body gets padding-bottom
 * on mobile so content isn't covered.
 * ------------------------------------------------------------------------- */
.ct-floating-cta {
	display: none;
	position: fixed;
	left: 50%;
	bottom: 14px;
	transform: translateX(-50%);
	z-index: 90;
	align-items: center;
	gap: 10px;
	padding: 13px 24px;
	border-radius: 999px;
	background: var(--ct-burgundy);
	color: #fff;
	font-family: var(--ct-font-sans);
	font-weight: 600;
	font-size: 1rem;
	letter-spacing: 0.01em;
	text-decoration: none;
	box-shadow: 0 10px 28px rgba(122, 29, 32, 0.42), 0 2px 6px rgba(42, 31, 26, 0.2);
	-webkit-tap-highlight-color: transparent;
	transition: transform .22s var(--ct-ease), background .22s var(--ct-ease);
}
.ct-floating-cta:hover,
.ct-floating-cta:focus-visible {
	background: #5d1518;
	color: #fff;
}
.ct-floating-cta-icon svg { width: 18px; height: 18px; display: block; }
@media (max-width: 860px) {
	.ct-floating-cta { display: inline-flex; }
	body { padding-bottom: 78px; }
	/* Don't let the cookie banner sit underneath the floating CTA */
	.ct-cookie-banner.is-visible ~ .ct-floating-cta,
	.ct-cookie-banner.is-visible + .ct-floating-cta { bottom: 96px; }
}

/* Push the floating CTA above the WP admin bar when logged in. */
.admin-bar .ct-floating-cta { bottom: 14px; }