/*
Theme Name: Exotic Lane
Theme URI: https://exoticlane.net
Author: Exotic Lane
Description: Block theme for Exotic Lane, a Hobart media agency: event coverage, live streaming, content creation and digital marketing.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
Version: 1.5.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: exoticlane
*/

/* Headings: slightly condensed broadcast feel (variable wdth axis). */
h1, h2, h3, .wp-block-heading, .el-condensed {
	font-stretch: 82%;
	text-wrap: balance;
}
p { text-wrap: pretty; }

/* Full-width sections butt together; no stray paper strips between them. */
.wp-site-blocks > *,
.wp-block-post-content > .alignfull,
.wp-block-post-content > .wp-block-pattern > .alignfull { margin-block: 0; }

:where(a, button, summary, input, textarea, select):focus-visible {
	outline: 2px solid var(--wp--preset--color--signal);
	outline-offset: 3px;
}

.screen-reader-text:not(:focus) {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	position: absolute !important;
	height: 1px; width: 1px; overflow: hidden; white-space: nowrap;
}
/* Swipe rows and cards contain their visually-hidden labels; otherwise the absolutely
   positioned text escapes the scroller and widens the page on phones. */
.el-feed__list, .el-quotes, .el-work-home, .el-card, .el-feed__item { position: relative; }

/* Header */
.el-header {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid var(--wp--preset--color--mist);
}
/* Blur lives on a pseudo-element: backdrop-filter on the header itself would make it the
   containing block for the fixed mobile-menu overlay and trap the menu inside the bar. */
.el-header::before {
	content: "";
	position: absolute; inset: 0; z-index: -1;
	background: color-mix(in srgb, var(--wp--preset--color--paper) 92%, transparent);
	-webkit-backdrop-filter: saturate(1.4) blur(8px);
	backdrop-filter: saturate(1.4) blur(8px);
}

/* Collapse the menu below 1024px (core collapses only below 600px, which wraps six links). */
@media (min-width: 600px) and (max-width: 1023px) {
	.el-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.el-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
/* Open mobile menu: large, easy tap targets. */
.el-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: calc(1rem + env(safe-area-inset-top)) clamp(1rem, 6vw, 2.5rem) 2rem;
}
.el-header .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 3.5rem !important;
	align-items: flex-start !important;
}
.el-header .is-menu-open .wp-block-navigation__container { gap: .25rem !important; align-items: flex-start !important; }
.el-header .is-menu-open .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 800;
	font-stretch: 82%;
	padding: .55rem 0 !important;
}
.admin-bar .el-header { top: var(--wp-admin--admin-bar--height, 32px); }
.el-logo img { mix-blend-mode: multiply; display: block; aspect-ratio: 480 / 285; height: auto; width: 108px !important; }
.el-header .wp-block-navigation-item__content { padding: .6rem .25rem; }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

/* Eyebrow with "live" dot */
.el-eyebrow {
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: .55em;
}
.el-eyebrow::before {
	content: "";
	width: .6em; height: .6em;
	border-radius: 50%;
	background: var(--wp--preset--color--signal);
	box-shadow: 0 0 0 0 rgba(212, 42, 31, .6);
	animation: el-pulse 2s infinite;
}
@keyframes el-pulse {
	70% { box-shadow: 0 0 0 .55em rgba(212, 42, 31, 0); }
	100% { box-shadow: 0 0 0 0 rgba(212, 42, 31, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.el-eyebrow::before { animation: none; }
	* { scroll-behavior: auto !important; }
}

/* Hero */
.el-hero .wp-block-cover__image-background { object-position: 55% 100%; }
/* Cover with left content position shrink-wraps its inner container; pin it to the wide grid instead. */
.wp-block-cover.el-hero.has-custom-content-position .wp-block-cover__inner-container {
	width: 100% !important;
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-inline: auto !important;
}
.el-hero .wp-block-cover__inner-container > * { margin-inline: 0 !important; }
/* Match the header's side gutter at every width. */
.wp-block-cover.el-hero { padding-inline: 0 !important; }
.wp-block-cover.el-hero .wp-block-cover__inner-container {
	padding-inline: var(--wp--style--root--padding-left, 1rem) var(--wp--style--root--padding-right, 1rem) !important;
	box-sizing: border-box;
}
.el-hero h1 { max-width: 15ch; }
.el-hero p { max-width: min(52ch, 100%); }

/* Logo strip */
.el-logos { gap: clamp(1rem, 2.2vw, 2rem) !important; }
.el-logos .wp-block-image { margin: 0; }
.el-logos img {
	height: 76px; width: auto; max-width: 120px; object-fit: contain;
	filter: grayscale(1); opacity: .8;
	transition: filter .2s, opacity .2s;
}
.el-logos .wp-block-image:hover img { filter: none; opacity: 1; }

/* Cards */
.el-card {
	height: 100%;
	transition: transform .2s ease, box-shadow .2s ease;
}
.el-card:hover { transform: translateY(-3px); }
.el-card .wp-block-image img { aspect-ratio: 4 / 3; object-fit: contain; background: var(--wp--preset--color--white); }
.el-arrow a { text-decoration: none; font-weight: 700; display: inline-block; padding-block: .3rem; }
.el-arrow a::after { content: " →"; }

/* Steps */
.el-step-num {
	font-stretch: 75%;
	font-weight: 800;
	color: var(--wp--preset--color--signal);
	line-height: 1;
}

/* FAQ */
.wp-block-details summary {
	cursor: pointer;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.35;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
	padding-block: .35rem;
	min-height: 44px;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: "+";
	flex: none;
	width: 1.6rem; height: 1.6rem; margin-top: .05rem;
	display: grid; place-items: center;
	border-radius: 50%;
	background: var(--wp--preset--color--mist);
	color: var(--wp--preset--color--ink);
	font-weight: 800; line-height: 1;
}
.wp-block-details[open] summary::after { content: "−"; background: var(--wp--preset--color--signal); color: #fff; }
.wp-block-details[open] summary { margin-bottom: .5rem; }

/* Placeholders the owner must replace before publishing */
.el-placeholder {
	border: 2px dashed var(--wp--preset--color--signal);
	background: #fff5f4;
	color: var(--wp--preset--color--ink);
	padding: 1rem 1.25rem;
	border-radius: 6px;
}

/* YouTube facade: loads the player only on click */
.el-yt {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--wp--preset--color--ink) center / cover no-repeat;
	border-radius: 8px;
	overflow: hidden;
}
.el-yt button {
	position: absolute; inset: 0;
	width: 100%; border: 0; cursor: pointer;
	background: linear-gradient(transparent 50%, rgba(14,17,22,.6));
	color: #fff; font: inherit; font-weight: 700;
	display: flex; align-items: center; justify-content: center; gap: .6rem;
}
.el-yt button::before {
	content: ""; width: 68px; height: 48px; border-radius: 12px;
	background: var(--wp--preset--color--signal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / 28px no-repeat;
}
.el-yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Contact */
.el-contact-list a { text-decoration: none; font-weight: 700; display: inline-block; padding-block: .25rem; }
.wpforms-container .wpforms-field input,
.wpforms-container .wpforms-field textarea,
.wpforms-container .wpforms-field select {
	border-radius: 6px !important;
	border: 1px solid var(--wp--preset--color--slate) !important;
	min-height: 48px;
	font: inherit !important;
}
.wpforms-container button[type=submit] {
	background: var(--wp--preset--color--signal) !important;
	color: #fff !important;
	border-radius: 6px !important;
	font: inherit !important; font-weight: 700 !important;
	min-height: 48px; padding: 0 1.75rem !important;
}

/* Footer */
.el-footer a { color: var(--wp--preset--color--white); display: inline-block; padding-block: .3rem; }
.el-footer .el-plain-list { line-height: 1.6 !important; }
.el-footer a:hover { color: var(--wp--preset--color--ash); }

/* Mobile action bar (replaces floating "Ring Us" button) */
.el-mobile-bar { display: none; }
@media (max-width: 781px) {
	.el-mobile-bar {
		display: flex;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
		gap: .5rem;
		padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom));
		background: var(--wp--preset--color--ink);
	}
	.el-mobile-bar a {
		flex: 1; text-align: center; text-decoration: none;
		min-height: 48px; display: flex; align-items: center; justify-content: center;
		border-radius: 6px; font-weight: 700; color: #fff;
		border: 2px solid rgba(255,255,255,.35);
	}
	.el-mobile-bar a.el-primary { background: var(--wp--preset--color--signal); border-color: var(--wp--preset--color--signal); }
	footer.wp-block-template-part { padding-bottom: calc(68px + env(safe-area-inset-bottom)); background: var(--wp--preset--color--ink); }
	.el-header .wp-block-button { display: none; }
	.el-logo img { width: 92px !important; }
}

/* Mobile: keep long sections short */
@media (max-width: 781px) {
	.el-card .wp-block-image img { aspect-ratio: auto; height: 112px; width: 100%; }
	.el-logos img { height: 56px; }
}

.el-plain-list { list-style: none; }

/* ---------- Live now ---------- */
.el-live {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
	border-bottom: 4px solid var(--wp--preset--color--signal);
	padding: var(--wp--preset--spacing--50) var(--wp--style--root--padding-right, 1rem);
	margin-block: 0 !important;
}
.el-live__inner {
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-inline: auto;
	display: grid;
	gap: var(--wp--preset--spacing--40);
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
	align-items: center;
}
.el-live__badge { color: var(--wp--preset--color--white); background: var(--wp--preset--color--signal); padding: .3rem .7rem; border-radius: 4px; display: inline-flex !important; }
.el-live__badge::before { background: #fff; }
.el-live__title { color: #fff; font-size: var(--wp--preset--font-size--x-large); margin-block: .75rem; }
.el-live p { color: var(--wp--preset--color--ash); }
.el-live a { color: #fff; font-weight: 700; }
@media (max-width: 781px) { .el-live__inner { grid-template-columns: 1fr; } }

/* ---------- YouTube feeds ---------- */
.el-feed { margin-top: var(--wp--preset--spacing--40); }
.el-feed__list {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: 1.25rem;
	grid-template-columns: repeat(auto-fill, minmax(min(19rem, 100%), 1fr));
}
.el-feed__item { margin: 0; }
.el-feed__title {
	font-weight: 700; line-height: 1.3; margin: .6rem 0 0;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.el-feed__meta { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); margin: .2rem 0 0; }
.el-feed__actions { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; margin-top: var(--wp--preset--spacing--40); }
.el-feed__more {
	background: transparent !important; color: var(--wp--preset--color--ink) !important;
	border: 2px solid currentColor !important; border-radius: 6px; cursor: pointer;
	font: inherit; font-weight: 700; padding: .75rem 1.4rem; min-height: 48px;
}
.el-feed__more:hover { color: var(--wp--preset--color--signal) !important; }
.el-feed__all { font-weight: 700; display: inline-block; padding-block: .6rem; }
.el-badge {
	position: absolute; top: .6rem; left: .6rem; z-index: 1; pointer-events: none;
	background: var(--wp--preset--color--signal); color: #fff;
	font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
	padding: .2rem .5rem; border-radius: 4px;
}
.el-yt { background-size: cover; background-position: center; }

/* Shorts: 9:16 tiles, swipeable row on phones */
.el-feed--shorts .el-feed__list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.el-yt--short { aspect-ratio: 9 / 16; }
.el-yt--short button::before { width: 52px; height: 36px; background-size: 22px; }
@media (max-width: 781px) {
	.el-feed--shorts .el-feed__list {
		grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 62%;
		overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem;
		overscroll-behavior-x: contain;
	}
	.el-feed--shorts .el-feed__item { scroll-snap-align: start; }
	.el-feed--videos .el-feed__list { grid-template-columns: 1fr; }
}

/* ---------- Testimonials ---------- */
.el-quotes { columns: 3 18rem; column-gap: 1.25rem; margin-top: var(--wp--preset--spacing--40); }
.el-quote {
	break-inside: avoid;
	margin: 0 0 1.25rem !important;
	padding: 1.5rem;
	border: 0 !important;
	border-radius: 8px;
	background: #1A1F27;
}
.el-quote p { color: var(--wp--preset--color--white); font-size: var(--wp--preset--font-size--medium); line-height: 1.55; }
.el-quote p::before { content: "“"; color: var(--wp--preset--color--signal); font-weight: 800; font-size: 2.5rem; line-height: 0; vertical-align: -.45em; margin-right: .15em; }
.el-quote cite { display: block; margin-top: 1rem; font-style: normal; color: var(--wp--preset--color--ash); font-size: var(--wp--preset--font-size--small); line-height: 1.45; }
.el-quote cite strong { color: #fff; font-size: var(--wp--preset--font-size--medium); }
@media (max-width: 781px) {
	.el-quotes {
		columns: auto; display: grid; grid-auto-flow: column; grid-auto-columns: 86%;
		gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem;
	}
	.el-quote { scroll-snap-align: start; margin: 0 !important; }
}

/* ---------- Phones: keep the page short ---------- */
@media (max-width: 781px) {
	/* Swipe rows: latest videos and tournament cards (shorts/testimonials already swipe) */
	.el-feed--videos .el-feed__list,
	.el-work-home {
		display: grid !important;
		grid-auto-flow: column; grid-template-columns: none !important; grid-auto-columns: 82%;
		overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
		padding-bottom: .5rem;
	}
	.el-work-home { grid-auto-columns: 68%; }
	.el-feed--videos .el-feed__item, .el-work-home > * { scroll-snap-align: start; }

	/* Services: tighter cards */
	.el-services .el-card { padding: 1.25rem !important; }
	.el-services h3 { font-size: var(--wp--preset--font-size--large) !important; }
	.el-services p { margin-block: .5rem 0; }

	/* Process: 2 x 2 (see also tablet rule) */
	.el-steps { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1.25rem 1rem !important; }
	.el-steps .el-step-num { font-size: var(--wp--preset--font-size--x-large) !important; }
	.el-steps h3 { font-size: var(--wp--preset--font-size--medium) !important; }
	.el-steps p { font-size: var(--wp--preset--font-size--small); }

	/* Footer: brand full width, two link columns */
	.el-footer-cols { flex-wrap: wrap !important; gap: 1.5rem 1rem !important; }
	.wp-block-columns.el-footer-cols:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: calc(50% - .5rem) !important; min-width: 0; }
	.wp-block-columns.el-footer-cols:not(.is-not-stacked-on-mobile) > .wp-block-column:first-child { flex-basis: 100% !important; }
	.el-footer-cols a { overflow-wrap: anywhere; }
	.el-footer-cols .el-plain-list { font-size: var(--wp--preset--font-size--small); }
}

/* ---------- Balanced grids: no orphaned last item ---------- */
/* Logo strip: 9 logos -> 3x3 on phones, 5+4 on tablets, one row from 1100px */
@media (max-width: 1099px) {
	.el-logos { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); justify-items: center; align-items: center; }
	.el-logos img { height: 64px; max-width: 100%; }
}
@media (max-width: 599px) {
	.el-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.el-logos img { height: 56px; }
}
/* Services: three across from tablet up */
@media (min-width: 782px) { .el-services { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
/* Process: 2x2 below 1024px, 4 across above */
@media (min-width: 782px) and (max-width: 1023px) { .el-steps { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (min-width: 1024px) { .el-steps { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
/* Portfolio cards (6 on home, 10 on /work/): 3 across on tablet+ */
@media (min-width: 782px) { .wp-block-group.is-layout-grid:has(> .el-card) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (min-width: 782px) and (max-width: 1023px) { .el-card .wp-block-image img { height: 120px; width: 100%; aspect-ratio: auto; } }

/* WPForms: full-width fields */
.wpforms-container .wpforms-field-medium,
.wpforms-container .wpforms-field-small,
.wpforms-container .wpforms-field input,
.wpforms-container .wpforms-field textarea { max-width: 100% !important; width: 100% !important; }
.wpforms-container .wpforms-field textarea.wpforms-field-small { height: 8rem !important; }

/* ---------- About: objectives ---------- */
.el-objectives {
	list-style: none; counter-reset: obj; padding: 0; margin-top: .75rem;
	columns: 2 14rem; column-gap: 2rem;
}
.el-objectives li {
	counter-increment: obj; break-inside: avoid;
	position: relative; padding-left: 2.6rem; margin-bottom: .9rem; min-height: 1.9rem;
}
.el-objectives li::before {
	content: counter(obj, decimal-leading-zero);
	position: absolute; left: 0; top: .05rem;
	font-weight: 800; font-stretch: 75%; color: var(--wp--preset--color--signal);
	font-size: 1.15rem; line-height: 1.4;
}
.el-objectives--full { columns: 1; }
.el-objectives--full li { margin-bottom: 1.4rem; padding-left: 3.2rem; }
.el-objectives--full li::before { font-size: 1.6rem; line-height: 1.1; }
.el-objectives--full strong { font-size: var(--wp--preset--font-size--large); }
.el-mission { border-radius: 0 8px 8px 0; margin-block: 1.5rem; }
.el-mission h3 { margin-top: 0; }

/* Feature cards: 4 items -> 2x2, 6 items -> 3x2 (tablet up) */
@media (min-width: 782px) {
	.el-features { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
	.el-features:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
/* Long-form text pages (privacy) */
.el-prose h2 { font-size: var(--wp--preset--font-size--x-large); margin-top: 2.25rem; }
.el-prose h2:first-of-type { margin-top: 1.5rem; }

/* ---------- Behind the lens gallery ---------- */
.el-g {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-rows: clamp(9rem, 14vw, 13rem);
	grid-auto-flow: dense;
	gap: .75rem;
	margin-top: var(--wp--preset--spacing--40);
}
.el-g__item { position: relative; margin: 0; overflow: hidden; border-radius: 8px; background: #1A1F27; }
.el-g__item--tall { grid-row: span 2; }
.el-g__item--wide { grid-column: span 2; }
.el-g__link { display: block; height: 100%; }
.el-g img, .el-g video { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.el-g__link:hover img, .el-g__link:focus-visible img { transform: scale(1.04); }
.el-g figcaption {
	position: absolute; left: 0; right: 0; bottom: 0; pointer-events: none;
	padding: 1.75rem .75rem .6rem;
	background: linear-gradient(transparent, rgba(14,17,22,.85));
	color: #fff; font-size: var(--wp--preset--font-size--small); font-weight: 600; line-height: 1.3;
}
.el-g figcaption small { display: block; font-weight: 400; opacity: .8; }
@media (max-width: 1023px) { .el-g { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599px) {
	.el-g { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 9.5rem; gap: .5rem; }
	.el-g figcaption { font-size: .75rem; padding: 1.5rem .5rem .45rem; }
}

/* Photo viewer */
.el-lb {
	width: 100vw; height: 100dvh; max-width: none; max-height: none;
	margin: 0; padding: 0; border: 0;
	background: rgba(8,10,13,.96); color: #fff;
}
.el-lb::backdrop { background: rgba(8,10,13,.96); }
.el-lb[open] { display: flex; align-items: center; justify-content: center; }
.el-lb__fig { margin: 0; max-width: min(1600px, 92vw); text-align: center; }
.el-lb__fig img { max-width: 100%; max-height: calc(100dvh - 7rem); width: auto; height: auto; object-fit: contain; border-radius: 4px; }
.el-lb__fig figcaption { margin-top: .75rem; color: var(--wp--preset--color--ash); font-size: var(--wp--preset--font-size--small); }
.el-lb__btn {
	position: absolute; z-index: 2; border: 0; cursor: pointer;
	width: 48px; height: 48px; border-radius: 50%;
	background: rgba(255,255,255,.12); color: #fff; font-size: 2rem; line-height: 1;
	display: grid; place-items: center;
}
.el-lb__btn:hover { background: var(--wp--preset--color--signal); }
.el-lb__prev { left: max(1rem, env(safe-area-inset-left)); top: 50%; transform: translateY(-50%); }
.el-lb__next { right: max(1rem, env(safe-area-inset-right)); top: 50%; transform: translateY(-50%); }
.el-lb__close { right: max(1rem, env(safe-area-inset-right)); top: calc(1rem + env(safe-area-inset-top)); }
.el-lb__count { position: absolute; left: 1rem; top: calc(1rem + env(safe-area-inset-top)); margin: 0; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ash); }
@media (max-width: 599px) { .el-lb__prev, .el-lb__next { top: auto; bottom: calc(1rem + env(safe-area-inset-bottom)); transform: none; } }
html.el-lb-open { overflow: hidden; }

/* ---------- Editable gallery (core Gallery block with class el-g) ---------- */
.wp-block-gallery.el-g.has-nested-images {
	display: grid !important;
	grid-template-columns: repeat(var(--el-g-cols, 4), minmax(0, 1fr));
	grid-auto-rows: clamp(9rem, 14vw, 13rem);
	grid-auto-flow: dense;
	gap: .75rem !important;
}
.wp-block-gallery.el-g.has-nested-images.columns-3 { --el-g-cols: 3; }
.wp-block-gallery.el-g.has-nested-images figure.wp-block-image {
	width: auto !important; max-width: none; margin: 0 !important;
	border-radius: 8px; overflow: hidden; background: #1A1F27;
}
.wp-block-gallery.el-g.has-nested-images figure.wp-block-image.el-g__item--tall { grid-row: span 2; }
.wp-block-gallery.el-g.has-nested-images figure.wp-block-image.el-g__item--wide { grid-column: span 2; }
.wp-block-gallery.el-g.has-nested-images figure.wp-block-image img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .4s ease; }
.wp-block-gallery.el-g.has-nested-images figure.wp-block-image:hover img { transform: scale(1.04); }
.wp-block-gallery.el-g.has-nested-images figure.wp-block-image figcaption {
	padding: 1.75rem .75rem .6rem !important; margin: 0 !important;
	background: linear-gradient(transparent, rgba(14,17,22,.85)) !important;
	font-size: var(--wp--preset--font-size--small); font-weight: 600; line-height: 1.3; text-align: left;
	max-height: none; overflow: visible;
}
@media (max-width: 1023px) { .wp-block-gallery.el-g.has-nested-images { --el-g-cols: 3; } }
@media (max-width: 599px) {
	.wp-block-gallery.el-g.has-nested-images { --el-g-cols: 2 !important; grid-auto-rows: 9.5rem; gap: .5rem !important; }
	.wp-block-gallery.el-g.has-nested-images figure.wp-block-image figcaption { font-size: .75rem; padding: 1.5rem .5rem .45rem !important; }
}
/* Video tile next to / below the gallery */
.wp-block-video.el-g-video { margin: 0; border-radius: 8px; overflow: hidden; background: #1A1F27; }
.wp-block-video.el-g-video video { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 9 / 16; }
.wp-block-video.el-g-video figcaption { color: var(--wp--preset--color--ash); font-size: var(--wp--preset--font-size--small); margin-top: .5rem; }
.el-g-row .wp-block-column:first-child .wp-block-video.el-g-video video { aspect-ratio: auto; max-height: 100%; }
.el-g-video--solo { max-width: 22rem; }

@media (max-width: 781px) { .wp-block-video.el-g-video video { aspect-ratio: 4 / 5 !important; } .el-g-video--solo { max-width: 100%; } }
@media (max-width: 599px) { .el-g-row .wp-block-gallery.el-g figure.wp-block-image.el-g__item--tall { grid-row: span 1; } }

/* ---------- "Website content" list sections (rendered by inc/blocks.php) ---------- */
.el-tgrid, .el-sgrid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(18rem, 100%), 1fr)); margin-top: var(--wp--preset--spacing--40); }
@media (min-width: 782px) { .el-tgrid, .el-sgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.el-features:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.el-tcard { display: flex; flex-direction: column; gap: .5rem; padding: 1rem 1rem 1.5rem; border-radius: 8px; }
.el-tcard .wp-block-image { margin: 0; }
.el-tcard .wp-block-image img { width: 100%; height: 140px; object-fit: contain; aspect-ratio: auto; background: var(--wp--preset--color--white); }
.el-tcard .el-eyebrow, .el-tcard h3 { margin: 0; }
.el-scard { display: flex; flex-direction: column; gap: .75rem; border-radius: 8px; border-top: 4px solid var(--wp--preset--color--signal); padding: var(--wp--preset--spacing--40); }
.el-scard h3, .el-scard p { margin: 0; }
.el-scard .el-arrow { margin-top: auto; }
.el-steps { display: grid; gap: 1.5rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--wp--preset--spacing--40); }
.el-step { display: flex; flex-direction: column; gap: .5rem; }
.el-step p, .el-step h3 { margin: 0; }
.el-logos-grid { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.el-logos-grid img { height: 76px; width: auto; max-width: 120px; object-fit: contain; filter: grayscale(1); opacity: .8; }
.el-faqs { margin-top: var(--wp--preset--spacing--30); }
@media (max-width: 781px) {
	.el-tgrid.el-work-home { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 68%; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-bottom: .5rem; position: relative; }
	.el-tgrid.el-work-home > * { scroll-snap-align: start; }
	.el-tcard .wp-block-image img { height: 112px; }
	.el-sgrid .el-scard { padding: 1.25rem; }
	.el-services .el-scard h3 { font-size: var(--wp--preset--font-size--large) !important; }
}

/* Editor only: label on list blocks so the owner knows where to edit them */
.el-dyn { position: relative; outline: 2px dashed rgba(212,42,31,.45); outline-offset: 4px; }
.el-dyn__bar { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; background: #fff5f4; color: #0E1116; border: 1px solid rgba(212,42,31,.35); border-radius: 6px; padding: .5rem .75rem; margin-bottom: .75rem; font-size: 14px; font-family: system-ui, sans-serif; }
.el-dyn__btn { background: #D42A1F; color: #fff !important; text-decoration: none !important; border-radius: 4px; padding: .3rem .7rem; font-weight: 600; }
