/* =========================================================
   EMpire Directory
   Scoped under .ed so nothing leaks into the theme.
   Colours follow the EMpowered brand palette and can be
   retuned here in one place.
   ========================================================= */

.ed {
	--ed-coral: #FF6246;
	--ed-coral-deep: #E84A2E;
	--ed-pink: #FF75A8;
	--ed-pink-deep: #F2589B;
	--ed-peach-soft: #FCE3CC;
	--ed-cream: #FFF3E6;
	--ed-cream-deep: #FCE7D4;
	--ed-ink: #333333;
	--ed-text: #555555;
	--ed-muted: #666666;
	--ed-placeholder: #9b9b9b;

	/* Card image shape. Most people upload a square logo or headshot, and
	   object-fit: cover crops the difference off the top and bottom, so a wide
	   ratio here eats a lot of a square image. 4/3 loses a quarter of the
	   height, 5/4 loses a fifth, 1/1 loses nothing but makes the cards tall. */
	--ed-card-ratio: 4 / 3;
	--ed-white: #ffffff;
	--ed-line: rgba(61, 36, 24, 0.12);
	--ed-radius: 16px;
	--ed-radius-sm: 10px;

	/* Container to match the site's Oxygen page width. The gutter is added
	   on top of the container rather than inside it, so the content lines up
	   with the header at full width but still clears the viewport edge on
	   narrow screens. The submit, login and single listing wrappers set their
	   own narrower max-widths later in this file and override this. */
	--ed-container: 1366px;
	--ed-gutter: 20px;
	--ed-space-block: 60px;

	box-sizing: border-box;
	max-width: calc(var(--ed-container) + (var(--ed-gutter) * 2));
	margin-left: auto;
	margin-right: auto;
	padding: var(--ed-space-block) var(--ed-gutter);

	color: var(--ed-text);
	font-size: 16px;
	line-height: 1.65;
}

.ed *,
.ed *::before,
.ed *::after { box-sizing: border-box; }

/* Members paste URLs and run-on strings into text fields. Without this a
   single unbroken word blows the card or the listing page wider than its
   container and breaks the whole grid. */
.ed h1, .ed h2, .ed h3, .ed h4, .ed p, .ed li, .ed blockquote, .ed td {
	overflow-wrap: anywhere;
	word-break: break-word;
}

.ed img { max-width: 100%; height: auto; display: block; }

/* Placeholders should read as a hint, not as entered text. opacity:1 is
   needed because Firefox dims them by default, which would compound. */
.ed ::placeholder { color: var(--ed-placeholder); opacity: 1; }
.ed ::-webkit-input-placeholder { color: var(--ed-placeholder); }
.ed :-ms-input-placeholder { color: var(--ed-placeholder); }

/* ---------------------------------------------------------- Buttons */
.ed-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 26px;
	border: 2px solid transparent;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, transform .2s ease;
	max-width: 100%;
	text-align: center;
	line-height: 1.35;
}
.ed-btn--primary { background: var(--ed-coral); color: var(--ed-cream); border-color: var(--ed-pink); }
.ed-btn--primary:hover { background: var(--ed-coral-deep); color: var(--ed-cream); transform: translateY(-1px); }
.ed-btn--ghost { background: transparent; color: var(--ed-coral); border-color: var(--ed-coral); }
.ed-btn--ghost:hover { background: var(--ed-coral); color: var(--ed-cream); transform: translateY(-1px); }

/* The "Join the EMpire" upsell. Deliberately pink, never coral: coral is
   reserved for the primary action of whatever the user is actually doing
   (Save changes, Submit for approval, Search). If the upsell shared that
   style it would compete with the form's own button. Pink also ties it to
   the dashed pink border of the locked-fields box. */
/* Coral border on a pink fill, matching .btn-pink on the main site. Every
   filled button carries a contrasting border there, so the border must never
   be the same colour as the fill. */
.ed-btn--empire { background: var(--ed-pink); color: var(--ed-cream); border-color: var(--ed-coral); }
.ed-btn--empire:hover { background: var(--ed-pink-deep); border-color: var(--ed-coral); color: var(--ed-cream); transform: translateY(-1px); }

/* ---------------------------------------------------------- Filters */
.ed-filters {
	background: var(--ed-cream);
	border-radius: var(--ed-radius);
	padding: 20px;
	margin-bottom: 28px;
}
.ed-filters-row {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr auto;
	gap: 14px;
	align-items: end;
}
.ed-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ed-label {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ed-ink);
}
.ed-field input,
.ed-field select,
.ed-form input,
.ed-form select,
.ed-form textarea,
.ed-review-form textarea {
	width: 100%;
	padding: 11px 14px;
	border: 1.5px solid var(--ed-line);
	border-radius: var(--ed-radius-sm);
	background: var(--ed-white);
	font: inherit;
	color: var(--ed-ink);
}
.ed-field input:focus,
.ed-field select:focus,
.ed-form input:focus,
.ed-form select:focus,
.ed-form textarea:focus,
.ed-review-form textarea:focus {
	outline: none;
	border-color: var(--ed-coral);
}
.ed-filters-clear { margin: 12px 0 0; font-size: 0.85rem; }
.ed-filters-clear a { color: var(--ed-coral); }

/* Results toolbar - count left, sort right, as on a shop's results header */
.ed-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	padding: 0 4px 16px;
	margin-bottom: 12px;
	border-bottom: 1px solid var(--ed-line);
}
.ed-result-count { margin: 0; font-size: 0.9rem; font-weight: 600; color: var(--ed-ink); }
.ed-toolbar-clear { margin-left: 14px; font-size: 0.85rem; font-weight: 400; color: var(--ed-coral); }
.ed-sort { display: flex; align-items: center; gap: 10px; }
.ed-sort-label {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ed-muted);
	white-space: nowrap;
}
.ed-sort select {
	padding: 9px 12px;
	border: 1.5px solid var(--ed-line);
	border-radius: var(--ed-radius-sm);
	background: var(--ed-white);
	font: inherit;
	font-size: 0.88rem;
	color: var(--ed-ink);
}
.ed-sort select:focus { outline: none; border-color: var(--ed-coral); }
.ed-sort-go { padding: 8px 16px; font-size: 0.72rem; }

/* ------------------------------------------------------------- Grid */
.ed-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.ed-card {
	background: var(--ed-white);
	border: 1.5px solid var(--ed-line);
	border-radius: var(--ed-radius);
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
	height: 100%;
	display: flex;
	flex-direction: column;
	/* Anchor for the stretched title link */
	position: relative;
}
.ed-card:hover { transform: translateY(-3px); box-shadow: 0 14px 32px rgba(61, 36, 24, 0.12); }

/* EMpire listings are visually the premium tier - this is the whole point
   of the tiering, so the distinction is deliberately obvious. */
.ed-card--empire { border-color: var(--ed-coral); border-width: 2px; }

/* The title is the only link on the card. Its ::after stretches over the whole
   card so the card stays clickable, without wrapping every scrap of text in one
   giant anchor that a screen reader would read out as the link label. */
.ed-card-link { text-decoration: none; color: inherit; }
.ed-card-link::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}
.ed-card-link:focus-visible { outline: 3px solid var(--ed-coral); outline-offset: 3px; }

.ed-card-media {
	aspect-ratio: var(--ed-card-ratio);
	background: var(--ed-cream-deep);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.ed-card-media img { width: 100%; height: 100%; object-fit: cover; }
.ed-card-initials {
	font-family: Georgia, serif;
	font-size: 2.4rem;
	color: var(--ed-coral);
	letter-spacing: 0.05em;
}

.ed-card-body { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.ed-card-title { margin: 10px 0 2px; font-size: 1.15rem; line-height: 1.3; color: var(--ed-ink); }
.ed-card-owner { margin: 0 0 6px; font-size: 0.9rem; color: var(--ed-pink-deep); font-weight: 600; }
.ed-card-meta { margin: 0 0 10px; font-size: 0.8rem; color: var(--ed-muted); }
/* The gap above the View profile divider has to live on these two, not on
   .ed-card-view: that uses margin-top:auto to sit at the bottom of the card,
   and an auto margin collapses to zero once the card content fills the space,
   taking any margin-top with it. */
.ed-card-bio { margin: 0 0 20px; font-size: 0.9rem; color: var(--ed-text); }
.ed-card-rating { margin: 12px 0 20px; display: flex; align-items: center; gap: 8px; }

/* Pushed to the bottom of the card so every card's CTA lines up */
.ed-card-view {
	margin: 0;
	margin-top: auto;
	padding-top: 16px;
	border-top: 1px solid var(--ed-line);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ed-coral);
	display: flex;
	align-items: center;
	gap: 7px;
}
.ed-card-view-arrow { transition: transform .25s ease; }
.ed-card:hover .ed-card-view { color: var(--ed-coral-deep); }
.ed-card:hover .ed-card-view-arrow { transform: translateX(4px); }

/* ------------------------------------------------------------ Badge */
.ed-badge {
	display: inline-block;
	/* .ed-card-body is a column flex container, and a flex item stretches to
	   the full width unless told otherwise. Without this the pill spans the
	   whole card. */
	align-self: flex-start;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.ed-badge--empire { background: var(--ed-coral); color: var(--ed-cream); }
.ed-badge--free { background: var(--ed-peach-soft); color: #8a4b2a; }

/* ------------------------------------------------------------ Stars */
.ed-stars { display: inline-flex; gap: 2px; color: var(--ed-line); font-size: 0.95rem; }
.ed-star.is-on { color: var(--ed-coral); }
.ed-rating-count { font-size: 0.78rem; color: var(--ed-muted); }

/* ------------------------------------------------------- Pagination */
.ed-pagination { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 32px; }
.ed-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 2px solid var(--ed-cream-deep);
	border-radius: 999px;
	background: var(--ed-cream);
	color: var(--ed-ink);
	text-decoration: none;
	font-size: 0.85rem;
	font-weight: 600;
	transition: border-color .2s ease, color .2s ease;
}
.ed-pagination a.page-numbers:hover { border-color: var(--ed-coral); color: var(--ed-coral); }
.ed-pagination .page-numbers.current { background: var(--ed-coral); color: var(--ed-cream); border-color: var(--ed-pink); }

/* ------------------------------------------------------------ Empty */
.ed-empty { text-align: center; padding: 48px 20px; background: var(--ed-cream); border-radius: var(--ed-radius); }

/* ------------------------------------------------------- Join prompt */
.ed-join {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	align-items: center;
	justify-content: space-between;
	margin-top: 36px;
	padding: 26px 28px;
	background: var(--ed-cream);
	border-radius: var(--ed-radius);
}
.ed-join-title { margin: 0 0 6px; font-family: Georgia, serif; font-size: 1.3rem; color: var(--ed-ink); }
.ed-join-text { margin: 0; font-size: 0.92rem; max-width: 60ch; }
.ed-join-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ------------------------------------------------------------- Form */
.ed-submit-wrap { max-width: 720px; margin: 0 auto; }

.ed-notice-actions { margin: 16px 0 0; }

/* Marketing consent and privacy notice above the submit button. */
.ed-consent { margin: 28px 0 24px; padding: 20px; border: 1px solid var(--ed-line); border-radius: var(--ed-radius-sm); }
.ed-consent-check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.ed-consent-check input { margin: 4px 0 0; flex: 0 0 auto; width: 18px; height: 18px; }
.ed-consent-help { margin: 8px 0 0 30px; font-size: 0.9rem; color: var(--ed-muted); }
.ed-consent-privacy { margin: 16px 0 0; font-size: 0.9rem; color: var(--ed-muted); }
.ed-consent-check + .ed-consent-privacy,
.ed-consent-help + .ed-consent-privacy { padding-top: 16px; border-top: 1px solid var(--ed-line); }

/* The EMpire pitch under the form on a free listing. */
.ed-benefits { margin-top: 48px; padding: 32px; border-radius: var(--ed-radius); background: var(--ed-cream); }
.ed-benefits-title { margin: 0 0 10px; }
.ed-benefits-intro { margin: 0 0 20px; }
.ed-benefits-list { list-style: none; margin: 0 0 24px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px 20px; }
.ed-benefits-list li { display: flex; align-items: flex-start; gap: 10px; }
.ed-benefits-tick { color: var(--ed-coral); font-weight: 700; line-height: 1.65; flex: 0 0 auto; }
.ed-benefits-more { margin: 0 0 24px; }
.ed-benefits-more p { margin: 0 0 12px; }
.ed-benefits-more p:last-child { margin-bottom: 0; }
.ed-benefits-cta { margin: 0; }

@media (max-width: 600px) {
	.ed-benefits { padding: 24px 20px; }
	.ed-benefits-list { grid-template-columns: 1fr; }
}
.ed-form { background: var(--ed-cream); border-radius: var(--ed-radius); padding: 28px; }
.ed-form-heading { margin: 0 0 20px; font-family: Georgia, serif; font-size: 1.4rem; color: var(--ed-ink); }
.ed-field-row { margin-bottom: 18px; display: flex; flex-direction: column; gap: 6px; }
.ed-required { color: var(--ed-coral); }
.ed-help { margin: 0; font-size: 0.8rem; color: var(--ed-muted); }
.ed-counter { font-size: 0.75rem; color: var(--ed-muted); }
.ed-current-image { width: 90px; height: 90px; object-fit: cover; border-radius: var(--ed-radius-sm); margin-bottom: 8px; }
.ed-form-actions { margin: 24px 0 8px; }
.ed-form-note { margin: 0; font-size: 0.8rem; color: var(--ed-muted); }

.ed-gate, .ed-status {
	background: var(--ed-cream);
	border-radius: var(--ed-radius);
	padding: 24px 26px;
	margin-bottom: 20px;
}
.ed-gate-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; }
.ed-gate h3 { margin: 0 0 8px; font-family: Georgia, serif; font-size: 1.35rem; color: var(--ed-ink); }
.ed-gate-login { margin: 14px 0 0; font-size: 0.88rem; color: var(--ed-muted); }
.ed-gate-login a { color: var(--ed-coral); font-weight: 600; }
.ed-turnstile { margin: 20px 0 0; }
.ed-status p { margin: 10px 0 0; font-size: 0.92rem; }

/* ------------------------------------------------------------- Login */
.ed-login-wrap { max-width: 460px; margin: 0 auto; }
.ed-login {
	background: var(--ed-cream);
	border-radius: var(--ed-radius);
	padding: 32px 30px;
}
.ed-login-title { margin: 0 0 6px; font-family: Georgia, serif; font-size: 1.5rem; color: var(--ed-ink); }
.ed-login-intro { margin: 0 0 22px; font-size: 0.94rem; color: var(--ed-text); }

/* wp_login_form's own markup, restyled in place */
.ed-login #ed-login-form p { margin: 0 0 16px; }
.ed-login #ed-login-form label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ed-ink);
}
.ed-login #ed-login-form input[type="text"],
.ed-login #ed-login-form input[type="password"] {
	width: 100%;
	padding: 11px 14px;
	border: 1.5px solid var(--ed-line);
	border-radius: var(--ed-radius-sm);
	background: var(--ed-white);
	font: inherit;
	color: var(--ed-ink);
}
.ed-login #ed-login-form input:focus { outline: none; border-color: var(--ed-coral); }
.ed-login .login-remember label {
	display: flex;
	align-items: center;
	gap: 8px;
	text-transform: none;
	letter-spacing: 0;
	font-size: 0.88rem;
	font-weight: 500;
	color: var(--ed-muted);
}
.ed-login .login-remember input { width: auto; }
.ed-login #ed-login-form .button,
.ed-login #ed-login-form input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 28px;
	background: var(--ed-coral);
	color: var(--ed-cream);
	border: 2px solid var(--ed-pink);
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .2s ease, transform .2s ease;
}
.ed-login #ed-login-form .button:hover,
.ed-login #ed-login-form input[type="submit"]:hover {
	background: var(--ed-coral-deep);
	transform: translateY(-1px);
}
.ed-login-links { margin: 6px 0 0; font-size: 0.88rem; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ed-login-links a { color: var(--ed-coral); font-weight: 600; }
.ed-login-logout { color: var(--ed-muted) !important; font-weight: 500 !important; text-decoration: underline; }
.ed-login-alt {
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--ed-line);
	text-align: center;
}
.ed-login-alt p { margin: 0 0 12px; font-size: 0.9rem; color: var(--ed-muted); }

/* --------------------------------------------------- Locked / upgrade */
.ed-locked {
	background: var(--ed-white);
	border: 2px dashed var(--ed-pink);
	border-radius: var(--ed-radius);
	padding: 24px;
	margin: 24px 0;
}
.ed-locked-head h4 { margin: 0 0 6px; font-family: Georgia, serif; font-size: 1.2rem; color: var(--ed-ink); }
.ed-locked-head p { margin: 0 0 16px; font-size: 0.92rem; }
.ed-locked-list { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 8px; }
.ed-locked-list li { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; color: var(--ed-muted); }
.ed-lock { flex: none; }

.ed-upgrade-block {
	background: var(--ed-cream);
	border-radius: var(--ed-radius);
	padding: 28px;
	text-align: center;
}
.ed-upgrade-block h3 { margin: 0 0 8px; font-family: Georgia, serif; font-size: 1.4rem; color: var(--ed-ink); }
.ed-upgrade-block p { margin: 0 0 18px; }

/* ---------------------------------------------------------- Notices */
.ed-notice { border-radius: var(--ed-radius-sm); padding: 16px 20px; margin-bottom: 20px; }
.ed-notice--success { background: var(--ed-peach-soft); color: #7a4320; }
.ed-notice--error { background: #fde8e6; color: #a12a17; }
.ed-notice ul { margin: 0; padding-left: 20px; }
.ed-notice p { margin: 0 0 6px; }
.ed-notice p:last-child { margin-bottom: 0; }

/* ----------------------------------------------------- Single listing */
.ed-single { max-width: 820px; margin: 0 auto; }

/* Pill and business name, centred above the listing itself. */
.ed-single-intro { text-align: center; margin-bottom: 28px; }
.ed-single-title { margin: 12px 0 0; line-height: 1.2; }

/* Back link now closes the page rather than opening it. */
.ed-single-back { margin: 40px 0 0; padding-top: 24px; border-top: 1px solid var(--ed-line); font-size: 0.95rem; }
.ed-single-back a { color: var(--ed-muted); text-decoration: none; }
.ed-single-back a:hover,
.ed-single-back a:focus { color: var(--ed-coral-deep); text-decoration: underline; }

/* EMpire listings shown at the foot of a free listing. */
.ed-promo { margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--ed-line); text-align: center; }
.ed-promo-title { margin: 0 0 6px; }
.ed-promo-intro { margin: 0 auto 24px; color: var(--ed-muted); max-width: 60ch; }
.ed-promo-cta { margin: 24px 0 0; }

/* Cards keep their own left-aligned body inside the centred section. */
.ed-promo .ed-card { text-align: left; }

/* The promo grid lives inside the 820px single column, so it needs a
   narrower minimum than the main directory grid or the cards get squeezed. */
.ed-grid--promo { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }

@media (max-width: 600px) {
	.ed-promo { margin-top: 40px; padding-top: 28px; }
}
.ed-single-head { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin-bottom: 28px; }
.ed-single-photo { width: 180px; height: 180px; object-fit: cover; border-radius: var(--ed-radius); flex: none; }
.ed-single-headings { flex: 1 1 260px; }
.ed-single-owner { margin: 10px 0 4px; font-size: 1.05rem; font-weight: 600; color: var(--ed-pink-deep); }
.ed-single-meta { margin: 0; font-size: 0.9rem; color: var(--ed-muted); }
.ed-single-rating { margin: 10px 0 0; display: flex; align-items: center; gap: 8px; }
.ed-single-bio { margin-bottom: 28px; }

/* ---------------------------------------------------------- Owner bar */
.ed-owner-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 20px;
	background: var(--ed-peach-soft);
	border-radius: var(--ed-radius);
	padding: 16px 20px;
	margin-bottom: 24px;
}
.ed-owner-bar-text { margin: 0; font-size: 0.9rem; color: #7a4320; }
.ed-owner-bar-btn { padding: 9px 20px; font-size: 0.72rem; }

/* ------------------------------------------------------------ Gallery */
.ed-gallery { margin-bottom: 32px; }
.ed-gallery h3 { margin: 0 0 14px; font-family: Georgia, serif; font-size: 1.2rem; color: var(--ed-ink); }
.ed-gallery-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
}
.ed-gallery-item a { display: block; border-radius: var(--ed-radius-sm); overflow: hidden; }
.ed-gallery-item img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: transform .3s ease;
}
.ed-gallery-item a:hover img { transform: scale(1.05); }
.ed-gallery-item a:focus-visible { outline: 3px solid var(--ed-coral); outline-offset: 2px; }

/* Gallery management on the submission form */
.ed-gallery-edit {
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
	gap: 12px;
}
.ed-gallery-edit-item {
	background: var(--ed-white);
	border: 1.5px solid var(--ed-line);
	border-radius: var(--ed-radius-sm);
	padding: 8px;
	text-align: center;
}
.ed-gallery-edit-item img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 6px; margin-bottom: 6px; }
.ed-gallery-remove { font-size: 0.72rem; color: var(--ed-muted); display: flex; align-items: center; justify-content: center; gap: 5px; cursor: pointer; }
.ed-gallery-remove input { width: auto; margin: 0; }

/* ----------------------------------------------------------- Lightbox */
.ed-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(28, 20, 18, 0.92);
}
.ed-lightbox[hidden] { display: none; }
.ed-lightbox img { max-width: 100%; max-height: 86vh; border-radius: var(--ed-radius-sm); }
.ed-lightbox-close,
.ed-lightbox-prev,
.ed-lightbox-next {
	position: absolute;
	background: rgba(255, 255, 255, 0.14);
	border: 0;
	color: #fff;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}
.ed-lightbox-close:hover,
.ed-lightbox-prev:hover,
.ed-lightbox-next:hover { background: rgba(255, 255, 255, 0.28); }
.ed-lightbox-close { top: 18px; right: 18px; }
.ed-lightbox-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.ed-lightbox-next { right: 18px; top: 50%; transform: translateY(-50%); }
.ed-lightbox-count { position: absolute; bottom: 18px; left: 0; right: 0; text-align: center; color: rgba(255,255,255,.75); font-size: 0.8rem; }

/* -------------------------------------------------------- Introduction */
.ed-intro { margin-bottom: 32px; }
.ed-intro h3,
.ed-services h3 { margin: 0 0 14px; font-family: Georgia, serif; font-size: 1.2rem; color: var(--ed-ink); }
.ed-intro-body { font-size: 1.02rem; line-height: 1.8; }
.ed-intro-body p { margin: 0 0 16px; }
.ed-intro-body p:last-child { margin-bottom: 0; }

/* ----------------------------------------------------------- Services */
.ed-services { margin-bottom: 32px; }
.ed-services-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 24px;
}
.ed-services-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 0.95rem; line-height: 1.5; }
.ed-services-tick {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--ed-coral);
	color: var(--ed-cream);
	margin-top: 1px;
}

/* ---------------------------------------------------------- Get in touch */
.ed-contact { background: var(--ed-cream); border-radius: var(--ed-radius); padding: 24px 26px; margin-bottom: 32px; }
.ed-contact h3 { margin: 0 0 14px; font-family: Georgia, serif; font-size: 1.2rem; color: var(--ed-ink); }
.ed-contact-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 12px; }
.ed-contact-list a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px 9px 12px;
	background: var(--ed-white);
	border: 1.5px solid var(--ed-line);
	border-radius: 999px;
	color: var(--ed-ink);
	font-weight: 600;
	font-size: 0.88rem;
	text-decoration: none;
	transition: border-color .2s ease, color .2s ease, transform .2s ease;
}
.ed-contact-list a:hover {
	border-color: var(--ed-coral);
	color: var(--ed-coral);
	transform: translateY(-1px);
	text-decoration: none;
}
.ed-contact-list .ed-icon { flex: none; color: var(--ed-coral); }
.ed-contact-list a:hover .ed-icon { color: var(--ed-coral); }

.ed-icon { display: block; }

.ed-single-tagline {
	margin: 10px 0 2px;
	font-family: Georgia, serif;
	font-style: italic;
	font-size: 1.1rem;
	line-height: 1.4;
	color: var(--ed-ink);
}
.ed-counter-static { font-size: 0.75rem; color: var(--ed-muted); }

/* ---------------------------------------------------------- Reviews */
.ed-reviews { margin-top: 8px; }
.ed-reviews h3 { font-family: Georgia, serif; font-size: 1.3rem; color: var(--ed-ink); margin: 0 0 16px; }
.ed-review-list { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 16px; }
.ed-review { background: var(--ed-white); border: 1.5px solid var(--ed-line); border-radius: var(--ed-radius); padding: 20px 22px; }
.ed-review-text { margin: 10px 0; font-family: Georgia, serif; font-style: italic; font-size: 1rem; color: var(--ed-ink); border: 0; padding: 0; }
.ed-review-author { margin: 0; font-size: 0.82rem; font-weight: 600; color: var(--ed-ink); }
.ed-review-author span { font-weight: 400; color: var(--ed-muted); margin-left: 8px; }
.ed-reviews-empty { color: var(--ed-muted); }
.ed-review-gate { background: var(--ed-cream); border-radius: var(--ed-radius-sm); padding: 14px 18px; font-size: 0.9rem; }

.ed-review-form { background: var(--ed-cream); border-radius: var(--ed-radius); padding: 24px 26px; }
.ed-review-form h4 { margin: 0 0 14px; font-family: Georgia, serif; font-size: 1.15rem; color: var(--ed-ink); }
.ed-review-form textarea { margin-bottom: 16px; }

/* Star picker. Rendered 5..1 in the DOM so the CSS sibling selector can
   light up the hovered star and everything before it. */
.ed-rating-input { border: 0; padding: 0; margin: 0 0 16px; display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 4px; }
.ed-rating-input legend { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ed-ink); float: left; width: 100%; margin-bottom: 8px; }
.ed-rating-input input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ed-rating-input label { font-size: 1.6rem; color: var(--ed-line); cursor: pointer; line-height: 1; transition: color .15s ease; }
.ed-rating-input input:checked ~ label,
.ed-rating-input label:hover,
.ed-rating-input label:hover ~ label { color: var(--ed-coral); }
.ed-rating-input input:focus-visible + label { outline: 2px solid var(--ed-pink); outline-offset: 2px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* ------------------------------------------------------------ Modal */
.ed-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(51, 36, 32, 0.6);
}
.ed-modal[hidden] { display: none; }
.ed-modal-panel {
	background: var(--ed-white);
	border-radius: var(--ed-radius);
	max-width: 460px;
	width: 100%;
	padding: 32px 30px;
	text-align: center;
	position: relative;
	box-shadow: 0 24px 60px rgba(61, 36, 24, 0.3);
}
.ed-modal-panel h3 { margin: 0 0 10px; font-family: Georgia, serif; font-size: 1.5rem; color: var(--ed-ink); }
.ed-modal-panel p { margin: 0 0 20px; font-size: 0.95rem; }
.ed-modal-close {
	position: absolute;
	top: 10px; right: 14px;
	background: none; border: 0;
	font-size: 1.5rem; line-height: 1;
	color: var(--ed-muted); cursor: pointer;
}
.ed-modal-dismiss { display: block; margin: 14px auto 0; background: none; border: 0; font-size: 0.82rem; color: var(--ed-muted); text-decoration: underline; cursor: pointer; }

/* ------------------------------------------------------- Responsive */
@media (max-width: 900px) {
	.ed-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ed-filters-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
	.ed-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.ed-grid { grid-template-columns: 1fr; }
	.ed-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ed-services-list { grid-template-columns: 1fr; }
	.ed-toolbar { flex-direction: column; align-items: flex-start; }
	.ed-sort { width: 100%; }
	.ed-sort select { flex: 1; }
	.ed-owner-bar { flex-direction: column; align-items: flex-start; }
	.ed-filters-row { grid-template-columns: 1fr; }
	.ed-join { flex-direction: column; align-items: flex-start; }
	.ed-single-head { flex-direction: column; align-items: flex-start; }
	.ed-single-photo { width: 140px; height: 140px; }
	.ed-btn { width: 100%; }
	.ed-join-actions, .ed-gate-actions { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.ed *, .ed *::before, .ed *::after { transition-duration: .01ms !important; }
}
