/* Aligned Living theme. Tokens come from the old Elementor kit. */
:root {
	--al-olive: #686230;
	--al-ochre: #C08330;
	--al-sage: #A79D56;
	--al-sand: #BAAF89;
	--al-rust: #C4572D;
	--al-brick: #B15032;
	--al-brown: #68412F;
	--al-bg: #E6DDD2;
	--al-card: #EDE6DE;
	--al-line: rgb(104 98 48 / .15);
	--al-text: #686230;
	--al-heading: "ivystyle-tw", Georgia, serif;
	--al-body: "ivystyle-sans", system-ui, sans-serif;
	--al-radius: 6px;
	--al-max: 1140px;
	--al-gutter: clamp(16px, 4vw, 32px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--al-bg);
	color: var(--al-text);
	font-family: var(--al-body);
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5;
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
}
.al-main { flex: 1 0 auto; }
.al-part-header, .al-part-footer { flex-shrink: 0; }
.al-modal h2 { font-family: var(--al-heading); font-weight: 400; line-height: 1.2; margin: 0 0 .5em; }
:where(body:not(.al-snapshot-page)) img:where(:not(.al-snapshot *)) { max-width: 100%; height: auto; display: block; }
:where(body:not(.al-snapshot-page)) a:where(:not(.al-snapshot *)) { color: var(--al-ochre); }
:where(body:not(.al-snapshot-page)) :is(h1, h2, h3, h4):where(:not(.al-snapshot *)) { font-family: var(--al-heading); font-weight: 400; line-height: 1.2; margin: 0 0 .5em; color: var(--al-olive); }
:where(body:not(.al-snapshot-page)) h1:where(:not(.al-snapshot *)) { font-size: clamp(30px, 4vw, 42px); }
:where(body:not(.al-snapshot-page)) h2:where(:not(.al-snapshot *)) { font-size: clamp(24px, 3vw, 30px); }
:focus-visible { outline: 2px solid var(--al-ochre); outline-offset: 2px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.al-skip { position: absolute; left: -999px; top: 8px; background: #fff; padding: 8px 12px; z-index: 100; }
.al-skip:focus { left: 8px; }

.al-container { max-width: var(--al-max); margin: 0 auto; padding: 0 var(--al-gutter); }
.al-prose { padding-top: 48px; padding-bottom: 64px; max-width: 760px; }
.al-muted { opacity: .7; }
.al-link { color: var(--al-olive); }

/* Buttons */
.al-btn {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--al-olive); color: var(--al-bg);
	border: 1px solid var(--al-olive); border-radius: 999px;
	padding: 10px 22px; font: 400 15px/1.2 var(--al-body);
	text-decoration: none; cursor: pointer;
}
.al-btn:hover { background: transparent; color: var(--al-olive); }
.al-btn--small { padding: 6px 14px; font-size: 13px; }
.al-btn--accent { background: var(--al-rust); border-color: var(--al-rust); }
.al-btn--accent:hover { color: var(--al-rust); }

/* Header (copied from live): stays at the top like Elementor's sticky header */
.al-part-header { position: sticky; top: 0; z-index: 99; }
@media (min-width: 601px) { .admin-bar .al-part-header { top: var(--wp-admin--admin-bar--height, 32px); } }

/* Hero */
.al-hero { background: var(--al-hero-bg, var(--al-olive)); color: var(--al-bg); text-align: center; padding: clamp(48px, 8vw, 88px) var(--al-gutter); }
.al-hero__inner { max-width: 640px; margin: 0 auto; }
.al-hero__title { color: var(--al-bg); text-transform: none; }
.al-hero__text { font-size: 14px; line-height: 1.7; }
.al-hero__text p { margin: 0; }

/* Library layout */
.al-library { padding-top: clamp(32px, 5vw, 56px); padding-bottom: 72px; }
.al-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 14px; font-size: 13px; padding: 8px 0 24px; }
.al-jump span { text-transform: uppercase; letter-spacing: .05em; }
.al-jump a { color: var(--al-olive); }
.al-section { margin-top: 40px; scroll-margin-top: 90px; }
.al-section__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.al-section__head h2 { margin: 0; }
.al-empty { padding: 40px 0; text-align: center; }

.al-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 20px; }

/* Card */
.al-card { background: var(--al-card); border-radius: var(--al-radius); overflow: hidden; display: flex; flex-direction: column; }
.al-card__media { position: relative; aspect-ratio: 3 / 2; background: #ddd3c6; }
.al-card__img { width: 100%; height: 100%; object-fit: cover; }
.al-card__play {
	position: absolute; inset: 0; display: grid; place-items: center;
	background: transparent; border: 0; cursor: pointer; color: rgb(255 255 255 / .9);
}
.al-card__play .al-icon { width: 40px; height: 40px; filter: drop-shadow(0 2px 6px rgb(0 0 0 / .35)); transition: transform .15s; }
.al-card__play:hover .al-icon { transform: scale(1.1); }
.al-card__locked {
	position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
	text-align: center; padding: 16px; color: var(--al-bg);
	background: rgb(104 98 48 / .88); opacity: 0; transition: opacity .2s;
	font-size: 13px;
}
.al-card__locked p { margin: 0; max-width: 24ch; }
.al-card__locked-title { font-family: var(--al-heading); font-size: 22px; }
.al-card:hover .al-card__locked, .al-card:focus-within .al-card__locked { opacity: 1; }
.al-card__locked .al-btn { background: var(--al-bg); color: var(--al-olive); border-color: var(--al-bg); margin-top: 4px; }
.al-card__login { color: var(--al-bg); font-size: 12px; }
@media (hover: none) { .al-card__locked { opacity: 1; background: rgb(104 98 48 / .7); } }

.al-card__body { padding: 12px 12px 8px; flex: 1; }
.al-card__title { font-size: 18px; margin: 0 0 2px; }
.al-card__title a { color: var(--al-olive); text-decoration: none; }
.al-card__title a:hover { text-decoration: underline; }
.al-card__length { color: var(--al-ochre); font-size: 13px; font-weight: 500; margin: 0 0 8px; }
.al-card__meta { list-style: none; margin: 0; padding: 0; font-size: 13px; display: grid; gap: 4px; }
.al-card__meta li { display: flex; align-items: center; gap: 6px; }
.al-card__meta .al-icon { flex: none; width: 14px; height: 14px; }
.al-card__foot { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--al-line); padding: 6px 12px; font-size: 11px; }
.al-fav { background: none; border: 0; padding: 6px; cursor: pointer; color: var(--al-olive); }
.al-fav .al-icon { width: 18px; height: 18px; }
.al-fav[aria-pressed="true"] .al-icon { fill: var(--al-rust); stroke: var(--al-rust); }
.al-fav.is-busy { opacity: .5; }

/* Filters */
.al-filters { margin-bottom: 20px; }
.al-filters > summary { list-style: none; }
.al-filters > summary::-webkit-details-marker { display: none; }
.al-filters__form { margin-top: 16px; }
.al-filters__groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 20px; }
.al-filters__group { border: 0; margin: 0; padding: 0; font-size: 13px; }
.al-filters__group legend { font-weight: 500; margin-bottom: 6px; }
.al-filters__group label { display: flex; gap: 6px; align-items: flex-start; padding: 2px 0; cursor: pointer; }
.al-filters__group input { accent-color: var(--al-olive); margin-top: 3px; }
.al-filters__actions { display: flex; align-items: center; gap: 16px; margin-top: 16px; }

/* Pagination */
.al-pagination ul { list-style: none; display: flex; justify-content: center; gap: 6px; padding: 0; margin: 40px 0 0; }
.al-pagination a, .al-pagination span { display: inline-block; min-width: 36px; padding: 6px 10px; text-align: center; border-radius: 999px; color: var(--al-olive); text-decoration: none; }
.al-pagination .current { background: var(--al-olive); color: var(--al-bg); }

/* Player */
.al-player { position: relative; aspect-ratio: 16 / 9; background: #000; border-radius: var(--al-radius); overflow: hidden; margin: 16px 0 20px; }
.al-player iframe, .al-player__poster { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.al-player__locked { opacity: 1; }
.al-single-class { padding-top: 32px; padding-bottom: 72px; max-width: 900px; }
.al-single-class__meta { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14px; }

.al-dialog { border: 0; padding: 0; width: min(1000px, 94vw); background: #000; border-radius: var(--al-radius); }
.al-dialog::backdrop { background: rgb(20 18 10 / .8); }
.al-dialog__frame { aspect-ratio: 16 / 9; }
.al-dialog__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.al-dialog__close { position: absolute; top: 6px; right: 6px; background: rgb(0 0 0 / .5); color: #fff; border: 0; border-radius: 999px; padding: 6px; cursor: pointer; z-index: 1; }
.al-dialog__close .al-icon { width: 20px; height: 20px; }

/* Footer */

/* Forms */
.al-form { display: grid; gap: 14px; }
.al-form__trap { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.al-field { display: grid; gap: 6px; }
.al-field label { font-size: 14px; }
.al-req { color: var(--al-rust); }
.al-field input[type=text], .al-field input[type=email], .al-field input[type=tel], .al-field select, .al-field textarea {
	width: 100%; padding: 10px 14px; border: 1px solid rgb(104 98 48 / .35); border-radius: 20px;
	background: #F5F3F1; color: var(--al-olive); font: 300 15px/1.4 var(--al-body);
}
.al-field textarea { border-radius: 14px; resize: vertical; }
.al-field input:focus, .al-field select:focus, .al-field textarea:focus { outline: 2px solid var(--al-ochre); outline-offset: 1px; }
.al-field.has-error input, .al-field.has-error select, .al-field.has-error textarea { border-color: var(--al-rust); }
.al-field__error { color: var(--al-rust); font-size: 13px; margin: 0; }
.al-field__check { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; }
.al-field__check input { margin-top: 4px; accent-color: var(--al-olive); }
.al-form__note { font-size: 12px; margin: 0; opacity: .85; }
.al-form__submit { justify-self: start; }
.al-form__submit[disabled] { opacity: .6; cursor: wait; }
.al-form__message { margin: 0; font-size: 15px; }
.al-form__message.is-error { color: var(--al-rust); }
.al-form.is-sent > :not(.al-form__message) { display: none; }

.al-form--compact { gap: 10px; }

.al-form-page { display: grid; gap: 40px; padding-top: 48px; padding-bottom: 72px; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.al-form-page--single { grid-template-columns: minmax(0, 720px); justify-content: center; }
@media (max-width: 760px) { .al-form-page { grid-template-columns: 1fr; } }

.al-modal { border: 0; border-radius: var(--al-radius); padding: 32px; width: min(520px, 94vw); background: var(--al-bg); color: var(--al-olive); }
.al-modal::backdrop { background: rgb(20 18 10 / .6); }
.al-modal__close { position: absolute; top: 10px; right: 10px; background: none; border: 0; padding: 6px; cursor: pointer; color: var(--al-olive); }
.al-modal__close .al-icon { width: 20px; height: 20px; }

/* Snapshot pages: photo lightbox */
.al-lightbox { border: 0; padding: 0; background: transparent; max-width: 96vw; max-height: 94vh; }
.al-lightbox::backdrop { background: rgb(10 10 8 / .9); }
.al-lightbox img { max-width: 92vw; max-height: 88vh; width: auto; height: auto; display: block; margin: auto; }
.al-lightbox button { position: fixed; background: none; border: 0; color: #fff; font-size: 44px; cursor: pointer; padding: 10px 16px; line-height: 1; }
.al-lightbox__close { top: 10px; right: 14px; }
.al-lightbox__prev { left: 10px; top: 50%; transform: translateY(-50%); }
.al-lightbox__next { right: 10px; top: 50%; transform: translateY(-50%); }
.al-snapshot .al-form { text-align: left; }

/* Elementor Pro pop-ups are replaced by the theme's own dialogs; hide any it still prints while the plugin is active (staging, launch day). */
.elementor-location-popup { display: none !important; }

/* Library list while new results load */
.al-loading { opacity: .5; transition: opacity .2s; }

/* Library: shown when the ticked filters match no classes */
.al-lib-empty { grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: var(--e-global-color-primary, #686230); }
.al-lib-empty p { margin: 0 0 12px; font-size: 18px; }
.al-lib-empty a { color: var(--e-global-color-secondary, #C08330); text-decoration: underline; }

/* Library: Load more button under the class grid */
.al-load-more { text-align: center; margin-top: 40px; }
.al-load-more .elementor-button { padding: 12px 28px; }
.al-load-more .elementor-button[aria-busy="true"] { opacity: .6; pointer-events: none; }
.al-snapshot .e-loop-item[tabindex="-1"]:focus { outline: none; }

/* ---------- Motion (assets/js/motion.js). Off for "reduce motion" ---------- */
@media (prefers-reduced-motion: no-preference) {
	/* Reveal: hidden only while JS is running (html.al-js, set in <head>); a safety net shows everything if motion.js never runs. */
	html.al-js:not(.al-anim-done) :is(.al-snapshot:not(.al-part-header):not(.al-part-footer) .elementor-widget, .al-snapshot .e-loop-item, .al-snapshot .jet-listing-grid__item):not(.e-loop-item .elementor-widget, .jet-listing-grid__item .elementor-widget, .elementor-widget-n-menu, .elementor-widget-n-menu .elementor-widget, .swiper .e-loop-item, .swiper .elementor-widget):not(.is-in) {
		opacity: 0;
		transform: translate3d(0, 20px, 0);
	}
	html.al-js .is-in:not(.is-done) {
		opacity: 1;
		transform: none;
		transition: opacity .8s cubic-bezier(.22, .61, .36, 1) var(--al-delay, 0ms), transform .8s cubic-bezier(.22, .61, .36, 1) var(--al-delay, 0ms);
	}

	/* Library and favourites cards: lift a little, photo zooms in a touch. */
	.al-snapshot .e-loop-item > .e-con,
	.al-snapshot .jet-listing-grid__item > .elementor > .e-con { transition: transform .35s ease, box-shadow .35s ease; }
	.al-snapshot .e-loop-item .elementor-wrapper,
	.al-snapshot .jet-listing-grid__item .elementor-wrapper { overflow: hidden; }
	.al-snapshot .e-loop-item .elementor-custom-embed-image-overlay img,
	.al-snapshot .jet-listing-grid__item .elementor-custom-embed-image-overlay img,
	.al-snapshot .e-loop-item .elementor-flip-box__front { transition: transform .6s ease; }
	@media (hover: hover) {
		.al-snapshot .e-loop-item:hover > .e-con,
		.al-snapshot .jet-listing-grid__item:hover > .elementor > .e-con { transform: translateY(-4px); box-shadow: 0 14px 30px rgb(104 98 48 / .14); }
		.al-snapshot .e-loop-item:hover .elementor-custom-embed-image-overlay img,
		.al-snapshot .jet-listing-grid__item:hover .elementor-custom-embed-image-overlay img { transform: scale(1.04); }
	}
}

/* Header: soft shadow once scrolled */
.al-part-header [data-elementor-type="header"] > .e-con { transition: box-shadow .3s ease; }
.al-part-header.is-scrolled [data-elementor-type="header"] > .e-con { box-shadow: 0 2px 18px rgb(104 98 48 / .10); }