/* Custom overrides that go beyond Tailwind utility classes. */

html {
	scroll-behavior: smooth;
}

body {
	font-family: 'Assistant', sans-serif;
	padding-top: 0;
}

/* Sticky header (navbar + marquee together) — stays in normal flow at the
   top of the viewport; no negative margin/transform should ever be applied
   to it, otherwise page content would slide underneath. */
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
}

/* Screen-reader only helper (Tailwind's sr-only + focus:not-sr-only cover this,
   kept here as a safety net if the Tailwind CDN script fails to load). */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Visible focus ring for keyboard navigation across the whole theme. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid #8B3A4A;
	outline-offset: 2px;
	border-radius: 4px;
}

/* Keep the sticky navbar height stable so the marquee strip below it never
   overlaps — an uploaded custom logo has no intrinsic size limit otherwise. */
.site-header .custom-logo,
.site-header a img {
	max-height: 4rem;
	width: auto;
	height: auto;
}

/* Marquee ticker (section 2) — infinite horizontal scroll, RTL-aware. */
.marquee-wrap {
	--marquee-duration: 28s;
}

.marquee-track {
	width: max-content;
	animation: luli-marquee var(--marquee-duration) linear infinite;
}

@keyframes luli-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(50%);
	}
}

html[dir="rtl"] .marquee-track {
	animation-name: luli-marquee-rtl;
}

@keyframes luli-marquee-rtl {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.marquee-track {
		animation: none;
	}
}

/* Accessibility mode: larger text + high contrast, toggled via JS. */
body.a11y-large-text {
	font-size: 112.5%;
}

body.a11y-larger-text {
	font-size: 125%;
}

body.a11y-high-contrast {
	background: #ffffff !important;
	filter: contrast(1.15);
}

body.a11y-high-contrast * {
	text-shadow: none !important;
}

/* Cookie consent / accessibility panel entrance */
#cookie-consent.is-visible {
	display: block;
	animation: luli-slide-up 0.35s ease-out;
}

@keyframes luli-slide-up {
	from {
		transform: translateY(100%);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

/* Services & Prices cards — force right-aligned RTL text regardless of any
   ancestor context, since the price badge is pinned to the physical right
   and the duration/CTA row is pinned to the physical left. */
.service-card {
	text-align: right;
	direction: rtl;
}

/* Lazy-loaded images: subtle fade once loaded */
img[loading="lazy"] {
	background-color: #E8E0D8;
}

/* Single post body copy — on-brand typography (serif headings, burgundy
   links) since the Tailwind Typography plugin isn't loaded via the CDN build. */
.entry-content {
	color: #404040;
	line-height: 1.8;
}

.entry-content > * + * {
	margin-top: 1.25em;
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	font-family: 'Frank Ruhl Libre', serif;
	color: #171717;
	line-height: 1.3;
	margin-top: 1.75em;
}

.entry-content h2 {
	font-size: 1.5rem;
}

.entry-content h3 {
	font-size: 1.25rem;
}

.entry-content h4 {
	font-size: 1.1rem;
}

.entry-content a {
	color: #8B3A4A;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.entry-content a:hover {
	color: #6B2D3E;
}

.entry-content ul,
.entry-content ol {
	padding-right: 1.5em;
	padding-left: 0;
}

.entry-content ul {
	list-style: disc;
}

.entry-content ol {
	list-style: decimal;
}

.entry-content li + li {
	margin-top: 0.5em;
}

.entry-content blockquote {
	border-right: 3px solid #8B3A4A;
	border-left: none;
	padding-right: 1.25em;
	padding-left: 0;
	font-style: italic;
	color: #525252;
}

.entry-content img {
	border-radius: 1rem;
}

.entry-content figcaption {
	font-size: 0.875rem;
	color: #a3a3a3;
	text-align: center;
	margin-top: 0.5em;
}

/* Gallery masonry (CSS columns, no JS) */
.gallery-masonry-item img {
	display: block;
}
