/*
 * Single listing — Claude Design "Direction A" handoff, Sep 2026.
 *
 * Colours come from tokens.css. The sizes are written in px on purpose: the
 * handoff specifies this page to the pixel (112px logo, 200px mosaic rows,
 * 340px sidebar, 140px scroll offset) and rounding them into the 4px spacing
 * scale would quietly redraw it.
 *
 * Loaded only on gd_place / gd_weddingvenue singles — see inc/enqueue.php.
 */

/* ---------- Page frame --------------------------------------------------
 * scroll-behavior + the sections' scroll-margin-top give the handoff's
 * "scroll to the section top minus 140px, smoothly" with no JavaScript.     */

html { scroll-behavior: smooth; }

/* ---------- Page frame -------------------------------------------------- */

.own-listing {
	max-width: var(--own-width-content);
	margin-inline: auto;
	padding-inline: 0;
}

.own-listing__crumbs,
.own-listing__layout {
	padding-inline: var(--own-gutter);
}

.own-listing__crumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	padding-top: 16px;
	font-size: 12.5px;
	color: var(--own-color-muted);
}
.own-listing__crumbs a { color: var(--own-color-accent); font-weight: 400; text-decoration: none; }
.own-listing__crumbs a:hover { color: var(--own-color-accent-hover); }
.own-listing__crumbs [aria-current="page"] { color: var(--own-color-primary); font-weight: 500; }

/* ---------- Photo mosaic ------------------------------------------------ */

.own-mosaic {
	position: relative;
	margin: 16px var(--own-gutter) 0;
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	grid-template-rows: 200px 200px;
	gap: 8px;
	border-radius: var(--own-radius-xl);
	overflow: hidden;
}

.own-mosaic__cell {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	background: var(--own-color-surface-muted);
}

.own-mosaic .own-mosaic__cell:first-child { grid-row: 1 / 3; }

/* The template prints every photo so the phone carousel can page through all
   of them; the desktop mosaic is a five-cell composition. */
.own-mosaic .own-mosaic__cell:nth-of-type(n + 6) { display: none; }

/* Fewer than five photos: fill the row rather than leave holes. */
.own-mosaic[data-count="1"] { grid-template-columns: 1fr; grid-template-rows: 408px; }
.own-mosaic[data-count="2"] { grid-template-columns: 2fr 1fr; grid-template-rows: 408px; }
.own-mosaic[data-count="2"] .own-mosaic__cell:first-child { grid-row: auto; }
.own-mosaic[data-count="3"] { grid-template-columns: 2fr 1fr; }
.own-mosaic[data-count="4"] { grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 408px; }
.own-mosaic[data-count="4"] .own-mosaic__cell:first-child { grid-row: auto; }

.own-mosaic__all {
	position: absolute;
	right: 16px;
	bottom: 16px;
	background: var(--own-color-surface);
	color: var(--own-color-primary);
	font-size: 12.5px;
	font-weight: 600;
	padding: 9px 14px;
	border-radius: var(--own-radius);
	box-shadow: var(--own-shadow-float);
	text-decoration: none;
}
.own-mosaic__all:hover { background: var(--own-color-surface-muted); color: var(--own-color-primary); }

/* ---------- Two-column body --------------------------------------------- */

.own-listing__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 48px;
	align-items: start;
	padding-top: 28px;
	padding-bottom: 80px;
}

.own-listing__main { min-width: 0; }

/* ---------- Vendor header block ----------------------------------------- */

.own-listing__header {
	display: flex;
	gap: 22px;
	align-items: flex-start;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--own-color-border);
}

.own-listing__logo { position: relative; flex: none; }
.own-listing__logo img {
	width: 112px;
	height: 112px;
	object-fit: cover;
	border-radius: var(--own-radius-lg);
	box-shadow: var(--own-shadow-tile);
	display: block;
}

.own-flag {
	position: absolute;
	top: -8px;
	left: -8px;
	background: var(--own-color-featured);
	color: #fff;
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: 4px 8px;
	border-radius: var(--own-radius-sm);
}

.own-listing__identity { flex: 1; min-width: 0; }

.own-pills { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.own-pill { border-radius: var(--own-radius-pill); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.own-pill--dark {
	background: var(--own-color-primary);
	color: #fff;
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .1em;
	padding: 5px 10px;
}
.own-pill--tint {
	background: var(--own-color-accent-tint);
	color: var(--own-color-accent);
	font-size: 12.5px;
	font-weight: 500;
	padding: 5px 10px;
}

.own-listing__title {
	margin: 0 0 8px;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--own-color-primary);
}

.own-listing__rating {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	margin-bottom: 10px;
}
.own-stars { color: var(--own-color-star); letter-spacing: 1px; }
.own-listing__rating b { color: var(--own-color-primary); }
.own-listing__rating a { font-weight: 400; }
.own-dot { color: #c9cdd3; }
.own-listing__price { color: var(--own-color-text-2); }

.own-listing__facts { display: grid; gap: 5px; margin: 0; font-size: 13.5px; color: var(--own-color-text-2); }
.own-listing__facts > div { display: flex; flex-wrap: wrap; gap: 6px; }
.own-listing__facts dt { color: var(--own-color-muted); }
.own-listing__facts dd { margin: 0; }

/* ---------- Sticky section nav ------------------------------------------
 * Only this pins. The page header deliberately does not: with both sticky,
 * content scrolled visibly through the band above the nav.                 */

.own-sectionnav {
	position: sticky;
	top: 0;
	z-index: 40;
	display: flex;
	gap: 4px;
	background: var(--own-color-surface);
	border-bottom: 1px solid var(--own-color-border);
	margin-bottom: 28px;
	overflow-x: auto;
	scrollbar-width: none;
}
.own-sectionnav::-webkit-scrollbar { display: none; }

.own-sectionnav a {
	padding: 14px;
	font-size: 13px;
	font-weight: 500;
	color: var(--own-color-text-2);
	border-bottom: 2px solid transparent;
	white-space: nowrap;
	text-decoration: none;
}
.own-sectionnav a:hover { color: var(--own-color-accent); }
.own-sectionnav a.is-active {
	color: var(--own-color-accent);
	font-weight: 600;
	border-bottom-color: var(--own-color-accent);
}

/* ---------- Sections ---------------------------------------------------- */

.own-sec { margin-bottom: 44px; scroll-margin-top: 140px; }
.own-sec__title { margin: 0 0 14px; font-size: 19px; font-weight: 600; color: var(--own-color-primary); }
.own-sec__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.own-sec__head .own-sec__title { margin: 0; }
.own-sec__meta { font-size: 12.5px; color: var(--own-color-muted); }
.own-sec__sub { margin: -8px 0 16px; font-size: 12.5px; color: var(--own-color-muted); }

.own-prose { font-size: 14.5px; line-height: 1.75; color: var(--own-color-text); }
.own-prose p { margin: 0 0 16px; }
.own-prose p:last-child { margin-bottom: 0; }

.own-creds { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.own-cred {
	padding: 7px 12px;
	background: var(--own-color-surface-muted);
	border-radius: var(--own-radius-pill);
	font-size: 12.5px;
	font-weight: 500;
	color: var(--own-color-text);
}

/* Gallery */
.own-thumbs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.own-thumbs img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: var(--own-radius-md);
	display: block;
	background: var(--own-color-surface-muted);
}

/* Services */
.own-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.own-card2 { padding: 18px 20px; border: 1px solid var(--own-color-border); border-radius: var(--own-radius-lg); }
.own-card2__title { margin: 0 0 6px; font-size: 14.5px; font-weight: 600; color: var(--own-color-primary); line-height: 1.3; }
.own-card2__body { margin: 0 0 8px; font-size: 13.5px; line-height: 1.65; color: var(--own-color-text-2); }
.own-card2__body:last-child { margin-bottom: 0; }

/* Packages & Deals */
.own-package + .own-package { margin-top: 14px; }
.own-package__row {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 16px 20px;
	border: 1px solid var(--own-color-border);
	border-radius: var(--own-radius-lg);
}
.own-package__thumb { width: 64px; height: 64px; flex: none; border-radius: var(--own-radius-md); object-fit: cover; display: block; }
.own-package__id { flex: 1; min-width: 0; }
.own-package__title { margin: 0; font-size: 15px; font-weight: 600; color: var(--own-color-primary); }
.own-package__by { margin: 3px 0 0; font-size: 12.5px; color: var(--own-color-muted); }
.own-package__price { font-size: 20px; font-weight: 600; text-align: right; color: var(--own-color-primary); }
.own-package__inclusions {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-top: 14px;
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--own-color-text-2);
}
.own-package__inclusions b { display: block; color: var(--own-color-primary); }
.own-package__inclusions span { display: block; }

/* Meet the Team */
.own-member { display: flex; gap: 22px; align-items: flex-start; }
.own-member + .own-member { margin-top: 28px; }
.own-member__photo { width: 96px; height: 96px; flex: none; border-radius: 50%; object-fit: cover; display: block; }
.own-member__name { margin: 0; font-size: 16px; font-weight: 600; color: var(--own-color-primary); }
.own-member__role { margin: 0 0 10px; font-size: 12.5px; color: var(--own-color-muted); }
.own-member .own-prose { font-size: 14px; }

/* Details */
.own-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.own-tile { padding: 14px 16px; background: var(--own-color-surface-muted); border-radius: var(--own-radius-lg); }
.own-tile__label { display: block; font-size: 11.5px; color: var(--own-color-muted); margin-bottom: 4px; }
.own-tile__value { display: block; font-size: 16px; font-weight: 600; color: var(--own-color-primary); }
.own-detail + .own-detail { margin-top: 18px; }
.own-detail__label { display: block; font-size: 12.5px; color: var(--own-color-muted); margin-bottom: 6px; }
.own-detail .own-prose { font-size: 14px; }
.own-detail .own-creds { margin-top: 0; }

/* FAQ */
.own-faq { display: grid; gap: 8px; }
.own-faq__item { border: 1px solid var(--own-color-border); border-radius: var(--own-radius-md); }
.own-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 15px 18px;
	font-size: 14px;
	font-weight: 600;
	color: var(--own-color-primary);
	cursor: pointer;
	list-style: none;
}
.own-faq__q::-webkit-details-marker { display: none; }
.own-faq__q::after {
	content: "+";
	font-size: 18px;
	font-weight: 400;
	color: var(--own-color-muted);
	line-height: 1;
}
.own-faq__item[open] .own-faq__q::after { content: "−"; }
.own-faq__a { padding: 0 18px 16px; font-size: 13.5px; line-height: 1.7; color: var(--own-color-text-2); }
.own-faq__a p { margin: 0 0 10px; }

/* Map */
.own-map { border: 1px solid var(--own-color-border); border-radius: var(--own-radius-lg); overflow: hidden; }
.own-map__canvas { height: 300px; background: var(--own-color-surface-muted); }
.own-map__canvas .geodir-map-wrap, .own-map__canvas iframe, .own-map__canvas > div { height: 300px !important; width: 100%; }
.own-map__directions { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--own-color-border); }
.own-map__directions input[type="text"] {
	flex: 1;
	min-width: 0;
	height: 42px;
	padding: 0 14px;
	font: inherit;
	font-size: 13px;
	border: 1px solid var(--own-color-divider);
	border-radius: var(--own-radius);
	background: var(--own-color-surface);
	color: var(--own-color-primary);
}
.own-map__directions input::placeholder { color: var(--own-color-placeholder); }
.own-map__directions input:focus { border-color: var(--own-color-accent); outline: none; }

/* ---------- Recommended by <vendor> -------------------------------------
 * The attribution is the component: a couple must not read these as OWN's
 * recommendations. Logo, "Recommended by <name>" and the qualifier stay.    */

.own-partners {
	background: var(--own-color-surface-panel);
	border: 1px solid var(--own-color-border);
	border-radius: var(--own-radius-xl);
	padding: 26px 24px;
	margin-top: 8px;
	scroll-margin-top: 140px;
}
.own-partners__head { display: flex; gap: 12px; align-items: center; margin-bottom: 4px; }
.own-partners__head .own-sec__title { margin: 0; }
.own-partners__logo {
	width: 34px;
	height: 34px;
	flex: none;
	border-radius: 7px;
	object-fit: cover;
	border: 1px solid var(--own-color-border);
	display: block;
}
.own-partners__sub { margin: 2px 0 0; font-size: 12.5px; color: var(--own-color-muted); }
.own-partners__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin-top: 20px;
}
.own-partner {
	display: block;
	background: var(--own-color-surface);
	border: 1px solid var(--own-color-border);
	border-radius: var(--own-radius-lg);
	overflow: hidden;
	color: var(--own-color-primary);
	text-decoration: none;
	font-weight: 400;
}
.own-partner:hover { box-shadow: var(--own-shadow-hover); color: var(--own-color-primary); }
.own-partner__media { position: relative; display: block; aspect-ratio: 16 / 10; background: var(--own-color-surface-muted); }
.own-partner__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.own-partner__badge {
	position: absolute;
	top: 10px;
	left: 10px;
	background: rgba(255, 255, 255, .94);
	color: var(--own-color-primary);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: 4px 8px;
	border-radius: var(--own-radius-sm);
}
.own-partner__body { display: block; padding: 14px 16px; }
.own-partner__name { display: block; font-size: 15px; font-weight: 600; }
.own-partner__where { display: block; font-size: 12px; color: var(--own-color-muted); margin-top: 3px; }

/* ---------- Sidebar: contact / quote card ------------------------------- */

.own-listing__aside { position: sticky; top: 24px; min-width: 0; }

.own-quote {
	background: var(--own-color-surface);
	border: 1px solid var(--own-color-border);
	border-radius: var(--own-radius-xl);
	overflow: hidden;
	box-shadow: var(--own-shadow-sidebar);
}

.own-quote__id { display: flex; gap: 12px; align-items: center; padding: 18px 20px; border-bottom: 1px solid var(--own-color-border); }
.own-quote__id img { width: 48px; height: 48px; flex: none; border-radius: var(--own-radius-md); object-fit: cover; border: 1px solid var(--own-color-border); display: block; }
.own-quote__id > div { min-width: 0; }
.own-quote__name { display: block; font-size: 15px; font-weight: 600; line-height: 1.25; color: var(--own-color-primary); }
.own-quote__rating { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--own-color-muted); margin-top: 3px; }
.own-quote__rating b { color: var(--own-color-primary); }

.own-quote__form { padding: 20px; display: grid; gap: 12px; }
.own-quote__intro strong { display: block; font-size: 15px; font-weight: 600; margin-bottom: 2px; color: var(--own-color-primary); }
.own-quote__intro span { display: block; font-size: 12.5px; color: var(--own-color-muted); line-height: 1.5; }
.own-quote__error {
	margin: 0;
	font-size: 12.5px;
	color: var(--own-color-featured);
	background: var(--own-color-fav-bg);
	border-radius: var(--own-radius);
	padding: 8px 10px;
}

.own-quote__form label { display: grid; gap: 5px; min-width: 0; }
.own-quote__form label > span {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--own-color-muted);
}
.own-quote__form input,
.own-quote__form select {
	font: inherit;
	font-size: 13px;
	color: var(--own-color-primary);
	padding: 10px;
	border: 1px solid var(--own-color-border-input);
	border-radius: var(--own-radius);
	background: var(--own-color-surface);
	width: 100%;
	box-sizing: border-box;
	/* Without this the native date control's intrinsic width breaks the
	   equal columns of the pair row. */
	min-width: 0;
}
.own-quote__form input:focus,
.own-quote__form select:focus { border-color: var(--own-color-accent); outline: none; }
.own-quote__form input::placeholder { color: var(--own-color-placeholder); }

.own-quote__pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }

.own-quote__response { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0; font-size: 12px; color: var(--own-color-text-2); }
.own-dotgreen { width: 7px; height: 7px; border-radius: 50%; background: var(--own-color-success); flex: none; }

.own-hp { position: absolute; left: -9999px; }

.own-quote__sent { padding: 26px 20px; display: grid; gap: 8px; justify-items: center; text-align: center; }
.own-quote__tick {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--own-color-accent-pale);
	color: var(--own-color-accent);
	display: grid;
	place-items: center;
	font-size: 18px;
}
.own-quote__sent strong { font-size: 15px; font-weight: 600; color: var(--own-color-primary); }
.own-quote__sent p { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--own-color-muted); max-width: 230px; }
.own-quote__sent a { font-size: 12.5px; font-weight: 600; margin-top: 4px; }

.own-quote__actions { padding: 0 20px 18px; display: grid; gap: 8px; }

.own-quote__meta {
	background: var(--own-color-surface-panel);
	border-top: 1px solid var(--own-color-border);
	padding: 16px 20px;
	display: grid;
	gap: 7px;
	font-size: 12.5px;
	color: var(--own-color-text-2);
}
.own-quote__meta > div { display: flex; gap: 8px; }
.own-quote__meta > div > span:first-child { color: var(--own-color-muted); width: 64px; flex: none; }
.own-quote__social {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	padding-top: 10px;
	margin-top: 3px;
	border-top: 1px solid var(--own-color-border);
	font-size: 12px;
}
.own-quote__social a { color: var(--own-color-muted); font-weight: 400; }
.own-quote__social a:hover { color: var(--own-color-accent); }

.own-claimed { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 12px 0 0; font-size: 11.5px; color: var(--own-color-muted); }
.own-claimed .own-tick { color: var(--own-color-accent); }

.own-listing__owner, .own-listing__claim { margin-top: 16px; font-size: 13px; }
.own-listing__claim { text-align: center; }

/* ---------- Buttons ----------------------------------------------------- */

.own-btn2 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	padding: 13px;
	border-radius: var(--own-radius);
	border: 0;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
}
.own-btn2--primary { background: var(--own-color-accent); color: #fff; }
.own-btn2--primary:hover { background: var(--own-color-accent-hover); color: #fff; }
.own-btn2--lg { font-size: 13.5px; padding: 15px; }
.own-btn2--outline { border: 1.5px solid var(--own-color-primary); color: var(--own-color-primary); background: transparent; }
.own-btn2--outline:hover { background: var(--own-color-surface-muted); color: var(--own-color-primary); }
.own-btn2--ghost {
	border: 1px solid var(--own-color-border);
	background: var(--own-color-surface);
	color: var(--own-color-text-2);
	font-size: 12.5px;
	font-weight: 500;
	padding: 10px;
}
.own-btn2--ghost:hover { border-color: #c9ced6; color: var(--own-color-primary); }

/* ---------- Mobile bottom action bar ------------------------------------ */

.own-bottombar { display: none; }

/* ---------- Responsive --------------------------------------------------
 * The handoff leaves tablet unspecified and covers phone separately. These
 * are its suggested breakpoints: the sidebar drops under the content, the
 * CTA becomes a fixed bottom bar, grids collapse.                           */

@media (max-width: 1100px) {
	.own-thumbs { grid-template-columns: repeat(4, 1fr); }
	.own-package__inclusions { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1000px) {
	.own-listing__layout { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-bottom: 96px; }
	.own-listing__aside { position: static; }
	.own-cards { grid-template-columns: 1fr; }
	.own-tiles { grid-template-columns: repeat(2, 1fr); }

	.own-bottombar {
		position: sticky;
		bottom: 0;
		z-index: 60;
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 10px var(--own-gutter);
		background: rgba(255, 255, 255, .92);
		backdrop-filter: blur(10px);
		border-top: 1px solid var(--own-color-border);
	}
	.own-bottombar__id { flex: 1; min-width: 0; }
	.own-bottombar__name {
		display: block;
		font-size: 13px;
		font-weight: 600;
		color: var(--own-color-primary);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.own-bottombar__rating { font-size: 12px; color: var(--own-color-muted); }
	.own-bottombar__rating .own-stars { color: var(--own-color-star); }
	.own-bottombar .own-btn2 { flex: none; min-height: 44px; padding-inline: 16px; }
}

/* Phone. The mobile handoff does not just reflow the desktop page — it swaps
 * two components: the photo mosaic becomes a full-bleed scroll-snap carousel
 * (4:3, one photo at a time, counter pill bottom-right) and the gallery grid
 * becomes a horizontal strip of 150px squares. Both are built from the same
 * markup, so the template does not branch on screen size. */

@media (max-width: 720px) {
	.own-listing__crumbs { padding-top: 12px; font-size: 12px; }

	.own-mosaic {
		display: flex;
		margin: 12px 0 0;
		border-radius: 0;
		gap: 0;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}
	.own-mosaic::-webkit-scrollbar { display: none; }
	.own-mosaic .own-mosaic__cell:nth-of-type(n + 6) { display: block; }
	.own-mosaic .own-mosaic__cell {
		flex: none;
		width: 100%;
		height: auto;
		aspect-ratio: 4 / 3;
		scroll-snap-align: start;
	}
	.own-mosaic__all {
		right: 12px;
		bottom: 12px;
		background: rgba(20, 22, 26, .7);
		color: #fff;
		font-size: 11px;
		font-weight: 500;
		padding: 5px 9px;
		border-radius: var(--own-radius-pill);
		box-shadow: none;
	}
	.own-mosaic__all:hover { background: rgba(20, 22, 26, .85); color: #fff; }

	.own-listing__layout { padding-top: 20px; gap: 28px; }
	.own-listing__header { gap: 14px; padding-bottom: 18px; }
	.own-listing__logo img { width: 64px; height: 64px; }
	.own-listing__title { font-size: 21px; margin-bottom: 6px; }
	.own-listing__rating { font-size: 13px; gap: 6px; }
	.own-listing__facts { font-size: 12.5px; }

	.own-sec { margin-bottom: 32px; }
	.own-prose { font-size: 13.5px; line-height: 1.7; }
	.own-member .own-prose, .own-detail .own-prose { font-size: 13.5px; }

	/* Gallery: a strip you swipe, not a grid that shrinks to stamps. */
	.own-thumbs {
		display: flex;
		gap: 8px;
		overflow-x: auto;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
		margin-inline: calc(var(--own-gutter) * -1);
		padding-inline: var(--own-gutter);
	}
	.own-thumbs::-webkit-scrollbar { display: none; }
	.own-thumbs img { flex: none; width: 150px; scroll-snap-align: start; }

	.own-package__row { flex-wrap: wrap; gap: 12px; padding: 14px 16px; }
	.own-package__thumb { width: 44px; height: 44px; }
	.own-package__title { font-size: 14px; }
	.own-package__price { font-size: 18px; text-align: left; }
	.own-package__inclusions { grid-template-columns: 1fr; gap: 10px; font-size: 12px; }

	.own-member { gap: 14px; }
	.own-member__photo { width: 56px; height: 56px; }

	.own-map__canvas, .own-map__canvas .geodir-map-wrap,
	.own-map__canvas iframe, .own-map__canvas > div { height: 190px !important; }
	.own-map__directions { padding: 8px; gap: 6px; }
	.own-map__directions input[type="text"] { height: 40px; font-size: 12.5px; }
	.own-map__directions .own-btn2 { height: 40px; padding: 0 14px; font-size: 12.5px; }

	.own-partners { padding: 20px 16px; }
	.own-partners__grid { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
	/* The two-up tile grid is the mobile handoff's; below ~420px the longer
	   labels ("Event liability insurance") start wrapping to three lines. */
	.own-tiles { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

/* ---------- GeoDirectory's favourite control -----------------------------
 * [gd_post_fav] does not output a bare <a>: it is a wrapper div carrying
 * `float-left mr-2` and an inner span carrying `h5`, both from AyeCode's UI
 * kit. Left alone the float breaks the sidebar's two-up row and the h5 prints
 * the heart at heading size in red. Undo those, then dress what remains as the
 * design's ghost button. The control's own click handler is untouched, so the
 * login redirect and the ajax write still work.                             */

.own-fav { display: block; min-width: 0; }
.own-fav .geodir_post_meta,
.own-fav .gd-fav-info-wrap {
	float: none !important;
	margin: 0 !important;
	display: block;
}
.own-fav .gd-list-favorite { display: block; }
.own-fav .geodir-addtofav {
	display: block;
	font-size: inherit !important;
	line-height: inherit !important;
	margin: 0 !important;
}
.own-fav .geodir-addtofav-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px;
	border: 1px solid var(--own-color-border);
	border-radius: var(--own-radius);
	font-size: 12.5px;
	font-weight: 500;
	color: var(--own-color-text-2);
	cursor: pointer;
	white-space: nowrap;
}
.own-fav .geodir-addtofav-icon:hover { border-color: #c9ced6; color: var(--own-color-primary); }
.own-fav .geodir-addtofav-icon i { font-size: 12.5px; }
.own-fav .geodir-fav-text { font-size: 12.5px; color: inherit; }

/* Favourited: the design's pink state. GD swaps the icon colour inline, so the
   container has to carry the rest. */
.own-fav .geodir-addtofav-icon:has(i[style*="e84739"]),
.own-fav .geodir-addtofav-icon.gd-fav-on {
	color: var(--own-color-featured);
	border-color: var(--own-color-featured);
	background: var(--own-color-fav-bg);
}

/* The site carries a code snippet that blanks GeoDirectory's favourite label
   and re-prints it through ::before at 20px — "Log in to favourite" when
   logged out, "Favourite"/"Unfavourite" when logged in. The wording is worth
   keeping; the size is not, and at 20px it breaks out of the 144px cell.
   Size and colour it here rather than editing the snippet, which is the live
   site's and outlives this template. */
/* The snippet's own selector is (0,3,3) and it is printed inline, after this
   file, so matching its specificity is not enough — scoping to .own-quote
   takes it to (0,4,2) and !important covers the inline ordering. This is the
   one place in the file worth an !important: the rule being beaten belongs to
   a snippet on the live site that this theme does not own. */
.own-quote .own-fav span.geodir-fav-text.gv-secondary::before {
	font-size: 12.5px !important;
	color: inherit;
}
.own-quote .own-fav span.geodir-fav-text.gv-secondary {
	color: inherit;
	font-weight: 500;
}
.own-fav .geodir-addtofav-icon { overflow: hidden; }

/* ---------- Out-specifying Elementor's global kit ------------------------
 * The kit (56713) still styles the header and footer, so it stays loaded.
 * Its `.elementor-kit-56713 button { background:#383838 }` is (0,1,1) and
 * would otherwise paint the sidebar's Request Pricing button near-black —
 * the one thing on the page the design makes blue. Scoping the theme's own
 * button classes under .own-listing takes them to (0,2,0) and settles it
 * without !important. These rules become redundant the day Elementor is
 * removed, and are harmless until then.                                    */

.own-listing .own-btn2 { background: transparent; color: inherit; }
.own-listing .own-btn2--primary { background: var(--own-color-accent); color: #fff; }
.own-listing .own-btn2--primary:hover { background: var(--own-color-accent-hover); color: #fff; }
.own-listing .own-btn2--outline { background: transparent; color: var(--own-color-primary); }
.own-listing .own-btn2--outline:hover { background: var(--own-color-surface-muted); }
.own-listing .own-btn2--ghost { background: var(--own-color-surface); color: var(--own-color-text-2); }
.own-listing .own-btn2--ghost:hover { color: var(--own-color-primary); }

/* ---------- Remembered details + Turnstile ------------------------------- */

/* `display:flex` on a class beats the UA's [hidden]{display:none}, so the note
   has to opt back out explicitly or it shows with nothing saved. */
.own-quote__saved[hidden] { display: none; }
.own-quote__saved {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 5px;
	margin: 0;
	font-size: 11.5px;
	color: var(--own-color-muted);
}
.own-quote__saved button {
	font: inherit;
	background: none;
	border: 0;
	padding: 0;
	color: var(--own-color-accent);
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
}
.own-quote__saved button:hover { color: var(--own-color-accent-hover); }

/* Cloudflare renders the widget in an iframe with its own intrinsic width;
   without this it pushes the 340px sidebar wider. */
.own-quote__form .cf-turnstile { min-width: 0; max-width: 100%; overflow: hidden; }
.own-quote__form .cf-turnstile iframe { max-width: 100% !important; }

/* ---------- Reviews on Google (inc/google-places.php) ---------------------- */
.own-greviews__summary { display: inline-flex; align-items: center; gap: 6px; }
.own-greviews__summary b { color: var(--own-color-primary); }
.own-greviews__list { display: grid; gap: 12px; }
.own-greview { padding: 16px 18px; border: 1px solid var(--own-color-border); border-radius: var(--own-radius-lg); background: var(--own-color-surface); }
.own-greview__head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.own-greview__avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; background: var(--own-color-accent-tint); }
.own-greview__avatar--initial { display: grid; place-items: center; color: var(--own-color-accent); font-weight: 600; }
.own-greview__who { display: flex; flex-direction: column; min-width: 0; }
.own-greview__name { font-weight: 600; font-size: 14px; color: var(--own-color-primary); text-decoration: none; }
.own-greview__name:hover { color: var(--own-color-accent); }
.own-greview__when { font-size: 12px; color: var(--own-color-muted); }
.own-greview__stars { margin-left: auto; color: var(--own-color-star); letter-spacing: -1px; flex: none; }
.own-greview__text { margin: 0; font-size: 14px; line-height: 1.7; color: var(--own-color-text); }
.own-greviews__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 14px 0 0; font-size: 12.5px; color: var(--own-color-muted); flex-wrap: wrap; }
.own-greviews__foot a { font-weight: 500; }

/*
 * "What Premium would add here" — preview-only, owner-only. Drawn as an
 * outline rather than a solid card so it reads as a gap in the page, which is
 * what it is, rather than as another section they already have.
 */
.own-tiergap {
	padding: var(--own-space-6);
	border: 2px dashed var(--own-color-border);
	border-radius: var(--own-radius-lg);
	background: var(--own-color-surface-muted);
}

.own-tiergap__kicker {
	margin: 0 0 var(--own-space-2);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--own-color-muted);
}

.own-tiergap__lead {
	margin: 0 0 var(--own-space-5);
	color: var(--own-color-text-2);
}

.own-tiergap__list {
	margin: 0 0 var(--own-space-5);
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--own-space-3);
}

.own-tiergap__item {
	display: grid;
	gap: 2px;
	padding-left: var(--own-space-4);
	border-left: 3px solid var(--own-color-border);
}

.own-tiergap__name {
	font-weight: 600;
	color: var(--own-color-primary);
}

.own-tiergap__why {
	font-size: .9rem;
	color: var(--own-color-text-2);
}

.own-tiergap__also {
	margin: 0 0 var(--own-space-5);
	font-size: .9rem;
	color: var(--own-color-text-2);
}
