/* ===========================================================
   ONÓRA Auto Listings — Noir & Gold theme
   =========================================================== */

.onora-feed-section, .onora-listing-page {
	--background:        oklch(0.155 0 0);
	--card:              oklch(0.195 0.003 85);
	--post-card-bg:      oklch(0.155 0 0);
	--foreground:        oklch(0.955 0.006 85);
	--muted-foreground:  oklch(0.705 0.008 85);
	--gold:              oklch(0.78 0.105 85);
	--gold-soft:         oklch(0.88 0.082 88);
	--gold-foreground:   oklch(0.145 0 0);
	--border:            oklch(0.295 0.006 85);
	--font-display: "Libre Baskerville", Georgia, serif;
	--font-body:    "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
}

.onora-feed-section *, .onora-listing-page * { box-sizing: border-box; }

.onora-container { max-width: 1280px; width: 100%; margin: 0 auto; padding: 0 24px; }

/* ---------- Feed / Auto Listing Posts section ---------- */

.onora-feed-section {
	background: transparent;
	border: 0;
	padding: 0;
	font-family: var(--font-body);
	max-width: 100%;
	overflow-x: clip;
}

.onora-feed-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; }

.onora-eyebrow {
	font-size: 0.6875rem;
	font-weight: 400;
	color: var(--gold);
	text-transform: uppercase;
	letter-spacing: 0.22em;
	margin-bottom: 12px;
}

.onora-feed-title {
	font-family: var(--font-display);
	font-size: 36px;
	font-weight: 400;
	color: var(--foreground);
	line-height: 1.15;
	letter-spacing: -0.02em;
	margin: 0;
}
@media (min-width: 640px) { .onora-feed-title { font-size: 48px; } }

.onora-feed-intro {
	font-size: 14px;
	color: var(--muted-foreground);
	line-height: 1.6;
	max-width: 384px;
	margin: 0;
}

.onora-rail {
	display: flex;
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	margin-top: 48px;
	scroll-padding-inline: 0;
	padding-bottom: 8px;
	scrollbar-width: thin;
	scrollbar-color: var(--border) transparent;
}
.onora-rail:first-child { margin-top: 0; }
.onora-rail::-webkit-scrollbar { height: 6px; }
.onora-rail::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }

/* ---------- The ONÓRA listing card ---------- */

.onora-listing-card {
	width: 320px;
	max-width: 100%;
	flex-shrink: 0;
	scroll-snap-align: start;
	border: 1px solid var(--border);
	background: var(--post-card-bg);
	padding: 10px;
	transition: border-color 0.3s ease;
}
@media (min-width: 640px) { .onora-listing-card { width: 360px; } }
.onora-listing-card:hover { border-color: color-mix(in oklch, var(--gold) 55%, transparent); }

/* inside a grid the card fills its cell instead of the fixed rail width */
.onora-card-grid .onora-listing-card { width: 100%; }

.onora-lc-link {
	display: block;
	text-decoration: none;
	color: var(--foreground);
}

.onora-lc-media { height: 185px; overflow: hidden; background: var(--card); }
.onora-lc-media img {
	width: 100%; height: 100%;
	object-fit: cover; display: block;
	transition: transform 700ms ease;
}
.onora-listing-card:hover .onora-lc-media img { transform: scale(1.04); }

.onora-lc-body { padding: 22px 0 4px; }

.onora-lc-price {
	font-family: var(--font-display);
	font-size: 26px;
	font-weight: 400;
	color: var(--gold);
	line-height: 1.15;
	margin: 0 0 14px;
}
.onora-lc-slash { color: var(--gold); }
.onora-lc-period {
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 600;
	color: var(--foreground);
	letter-spacing: 0.01em;
}

.onora-lc-title {
	font-family: var(--font-display);
	font-size: 19px;
	font-weight: 700;
	color: #FFFFFF;
	line-height: 1.3;
	margin: 0 0 8px;
}

.onora-lc-location {
	font-size: 14px;
	color: var(--muted-foreground);
	line-height: 1.5;
	margin: 0 0 20px;
}

.onora-lc-divider { height: 1px; background: var(--border); margin: 0 0 16px; }

.onora-lc-specs {
	font-size: 13.5px;
	color: var(--muted-foreground);
	margin: 0 0 24px;
}

.onora-lc-cta {
	display: block;
	text-align: center;
	border: 1px solid var(--gold);
	color: var(--gold);
	padding: 15px 10px;
	font-size: 11.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	transition: background 0.25s ease, color 0.25s ease;
}
.onora-listing-card:hover .onora-lc-cta { background: var(--gold); color: var(--gold-foreground); }

.onora-empty { padding: 40px; text-align: center; color: var(--muted-foreground); }

/* the gold monogram — map placeholder and the advisor card */
.onora-avatar {
	width: 40px; height: 40px; border-radius: 50%;
	border: 1px solid var(--gold);
	display: flex; align-items: center; justify-content: center;
	font-family: var(--font-display); font-size: 18px; color: var(--gold);
	flex-shrink: 0;
}

/* ===========================================================
   Single listing page
   =========================================================== */

.onora-listing-page {
	background: var(--background);
	color: var(--foreground);
	font-family: var(--font-body);
	padding-bottom: 80px;
}

.onora-breadcrumb-row { padding-top: 24px; }
.onora-back-link { color: var(--muted-foreground); font-size: 13px; text-decoration: none; }
.onora-back-link:hover { color: var(--gold); }

.onora-listing-title {
	font-family: var(--font-display); font-weight: 400;
	font-size: 30px; line-height: 1.2; letter-spacing: -0.01em;
	color: #FFFFFF;
	margin: 20px 0 8px;
}
@media (min-width: 640px) { .onora-listing-title { font-size: 40px; } }

.onora-listing-subline { color: var(--muted-foreground); font-size: 14px; margin-bottom: 24px; }
.onora-dot { margin: 0 6px; }
.onora-star { color: var(--gold); }

.onora-mosaic {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(2, 180px);
	gap: 8px;
	border-radius: 4px;
	overflow: hidden;
	margin-bottom: 40px;
}
@media (min-width: 768px) { .onora-mosaic { grid-template-rows: repeat(2, 220px); } }
.onora-mosaic-cell { border: 0; padding: 0; margin: 0; cursor: pointer; overflow: hidden; background: var(--card); }
.onora-mosaic-cell img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 500ms ease; }
.onora-mosaic-cell:hover img { transform: scale(1.05); }
.onora-mosaic-cell-0 { grid-column: 1 / 3; grid-row: 1 / 3; }
.onora-mosaic-cell-1 { grid-column: 3 / 4; grid-row: 1 / 2; }
.onora-mosaic-cell-2 { grid-column: 4 / 5; grid-row: 1 / 2; }
.onora-mosaic-cell-3 { grid-column: 3 / 4; grid-row: 2 / 3; }
.onora-mosaic-cell-4 { grid-column: 4 / 5; grid-row: 2 / 3; }

.onora-layout { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: start; }
@media (min-width: 1024px) { .onora-layout { grid-template-columns: 1.7fr 1fr; } }

.onora-main-col > div { border-bottom: 1px solid var(--border); padding: 32px 0; }
.onora-main-col > div:first-child { padding-top: 0; }

.onora-verified-strip h2 { font-family: var(--font-display); font-weight: 400; font-size: 22px; margin: 0 0 8px; }
.onora-specs-line { color: var(--muted-foreground); font-size: 14px; margin: 0 0 24px; }

.onora-highlights-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px) { .onora-highlights-grid { grid-template-columns: repeat(3, 1fr); } }
.onora-highlight-card { }
.onora-highlight-mark { font-family: var(--font-display); color: var(--gold); font-size: 20px; margin-bottom: 8px; }
.onora-highlight-card h3 { font-size: 15px; font-weight: 600; margin: 0 0 6px; }
.onora-highlight-card p { font-size: 13px; color: var(--muted-foreground); line-height: 1.6; margin: 0; }

.onora-description { font-size: 15px; line-height: 1.8; color: color-mix(in oklch, var(--foreground) 92%, transparent); }
.onora-description p { margin: 0 0 16px; }

.onora-amenities-section h2, .onora-location-section h2, .onora-reviews-section h2 {
	font-family: var(--font-display); font-weight: 400; font-size: 22px; margin: 0 0 24px;
}
.onora-amenities-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px) { .onora-amenities-grid { grid-template-columns: 1fr 1fr; } }
.onora-amenity { display: flex; gap: 14px; align-items: flex-start; }
.onora-amenity svg { color: var(--gold); flex-shrink: 0; margin-top: 2px; }
.onora-amenity strong { display: block; font-size: 14px; font-weight: 600; }
.onora-amenity span { display: block; font-size: 13px; color: var(--muted-foreground); margin-top: 2px; }

.onora-location-name { color: var(--muted-foreground); font-size: 14px; margin: 0 0 16px; }
.onora-location-map-placeholder {
	background: var(--card); border: 1px solid var(--border);
	height: 180px; border-radius: 4px;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
	color: var(--muted-foreground); font-size: 13px; margin-bottom: 20px;
}
.onora-avatar-lg { width: 48px; height: 48px; font-size: 20px; }
.onora-location-points { list-style: none; margin: 0; padding: 0; }
.onora-location-points li { display: flex; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--border); font-size: 14px; }
.onora-location-points li:first-child { border-top: 0; }
.onora-point-distance { color: var(--muted-foreground); }

.onora-review-scores { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-bottom: 28px; max-width: 360px; }
@media (min-width: 640px) { .onora-review-scores { grid-template-columns: repeat(4,1fr); } }
.onora-review-scores div { display: flex; flex-direction: column; gap: 4px; }
.onora-review-scores span { font-size: 12px; color: var(--muted-foreground); }
.onora-review-scores strong { font-family: var(--font-display); font-size: 20px; font-weight: 400; }

.onora-review-quotes { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 768px) { .onora-review-quotes { grid-template-columns: 1fr 1fr; } }
.onora-review-quotes blockquote { margin: 0; padding: 0; }
.onora-review-quotes p { font-size: 14px; line-height: 1.6; font-style: italic; margin: 0 0 10px; }
.onora-review-quotes cite { font-style: normal; font-size: 13px; font-weight: 600; }
.onora-review-quotes cite span { display: block; font-weight: 400; color: var(--muted-foreground); font-size: 12px; margin-top: 2px; }

/* Booking / enquiry sticky card */
.onora-side-col { position: relative; }
.onora-booking-card {
	position: sticky; top: 24px;
	border: 1px solid var(--border);
	background: var(--card);
	border-radius: 8px;
	padding: 24px;
}
.onora-booking-notice { font-size: 13px; padding: 12px; border-radius: 4px; margin-bottom: 16px; line-height: 1.5; }
.onora-booking-success { background: color-mix(in oklch, var(--gold) 18%, transparent); border: 1px solid var(--gold); color: var(--gold-soft); }
.onora-booking-error { background: color-mix(in oklch, #b23b3b 18%, transparent); border: 1px solid #b23b3b; color: #e6a3a3; }

.onora-booking-price-row { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 20px; }
.onora-booking-price { font-family: var(--font-display); font-size: 22px; }
.onora-booking-price-unit { font-family: var(--font-body); font-size: 13px; color: var(--muted-foreground); }
.onora-booking-rating { font-size: 13px; color: var(--muted-foreground); }

.onora-booking-form { display: flex; flex-direction: column; gap: 14px; }
.onora-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.onora-booking-form label { display: flex; flex-direction: column; gap: 6px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted-foreground); }
.onora-booking-form input, .onora-booking-form select, .onora-booking-form textarea {
	background: var(--background) !important; border: 1px solid var(--border) !important; color: var(--foreground) !important;
	padding: 10px 12px; border-radius: 4px; font-family: var(--font-body); font-size: 13px;
	letter-spacing: normal; text-transform: none;
}
.onora-booking-form input:focus, .onora-booking-form select:focus, .onora-booking-form textarea:focus {
	outline: none; border-color: var(--gold) !important;
}
.onora-form-full { grid-column: 1 / -1; }

.onora-reserve-btn {
	background: var(--gold); color: var(--gold-foreground); border: 0;
	padding: 13px; border-radius: 4px; font-size: 13px; font-weight: 600;
	text-transform: uppercase; letter-spacing: 0.08em; cursor: pointer;
	transition: background 0.2s ease;
}
.onora-reserve-btn:hover { background: var(--gold-soft); }

.onora-booking-fine { text-align: center; font-size: 11px; color: var(--muted-foreground); margin: 4px 0 0; }
.onora-annual-note { font-size: 12px; color: var(--muted-foreground); margin-top: 16px; border-top: 1px solid var(--border); padding-top: 16px; }

/* Similar properties */
.onora-similar-section { padding-top: 56px; }
.onora-similar-section h2 { font-family: var(--font-display); font-weight: 400; font-size: 26px; margin-bottom: 24px; }
.onora-similar-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 768px) { .onora-similar-grid { grid-template-columns: repeat(3, 1fr); } }
.onora-similar-card { display: block; text-decoration: none; color: var(--foreground); border: 1px solid var(--border); transition: border-color 0.2s ease; }
.onora-similar-card:hover { border-color: color-mix(in oklch, var(--gold) 50%, transparent); }
.onora-similar-img-wrap { position: relative; height: 200px; overflow: hidden; }
.onora-similar-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 500ms ease; }
.onora-similar-card:hover .onora-similar-img-wrap img { transform: scale(1.04); }
.onora-similar-body { padding: 16px; }
.onora-similar-price { font-size: 15px; font-weight: 600; margin: 0 0 4px; }
.onora-similar-price span { font-weight: 400; color: var(--muted-foreground); font-size: 12px; }
.onora-similar-body h3 { font-size: 15px; font-weight: 400; font-family: var(--font-display); margin: 0 0 4px; }
.onora-similar-location { font-size: 12px; color: var(--muted-foreground); margin: 0 0 6px; }
.onora-similar-specs { font-size: 12px; color: var(--muted-foreground); margin: 0 0 10px; }

/* Contact CTA */
.onora-contact-cta { text-align: center; padding-top: 64px; border-top: 1px solid var(--border); margin-top: 56px; }
.onora-contact-cta h2 { font-family: var(--font-display); font-weight: 400; font-size: 26px; margin: 0 0 8px; }
.onora-contact-cta p { color: var(--muted-foreground); font-size: 14px; margin: 0 0 24px; }
.onora-cta-btn {
	display: inline-block; background: var(--gold); color: var(--gold-foreground);
	padding: 12px 28px; border-radius: 4px; text-decoration: none;
	font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
}
.onora-cta-btn:hover { background: var(--gold-soft); }

/* Lightbox */
.onora-lightbox {
	position: fixed; inset: 0; background: rgba(0,0,0,0.92); z-index: 9999;
	display: none; align-items: center; justify-content: center;
}
.onora-lightbox.is-open { display: flex; }
.onora-lightbox img { max-width: 90vw; max-height: 85vh; object-fit: contain; }
.onora-lightbox-close, .onora-lightbox-prev, .onora-lightbox-next {
	position: absolute; background: transparent; border: 0; color: #F2F0EC;
	font-size: 28px; cursor: pointer; padding: 12px;
}
.onora-lightbox-close { top: 16px; right: 24px; }
.onora-lightbox-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.onora-lightbox-next { right: 16px; top: 50%; transform: translateY(-50%); }

@media (max-width: 767px) {
	.onora-mosaic { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, 160px); }
	.onora-mosaic-cell-0 { grid-column: 1 / 3; grid-row: 1 / 2; }
	.onora-mosaic-cell-1 { grid-column: 1 / 2; grid-row: 2 / 3; }
	.onora-mosaic-cell-2 { grid-column: 2 / 3; grid-row: 2 / 3; }
	.onora-mosaic-cell-3 { grid-column: 1 / 2; grid-row: 3 / 4; }
	.onora-mosaic-cell-4 { grid-column: 2 / 3; grid-row: 3 / 4; }
	.onora-booking-card { position: static; }
}

/* ===========================================================
   Additions — grid shortcode, details, map, review stars,
   advisor card, archive. Same Noir & Gold tokens as above.
   =========================================================== */

/* ---------- Card grid ([onora_grid] / [onora_listing]) ---------- */

.onora-card-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	margin-top: 48px;
}
.onora-feed-header + .onora-card-grid { margin-top: 48px; }
.onora-card-grid:first-child { margin-top: 0; }

/* a lone card shouldn't stretch the full width of the page */
.onora-card-grid.onora-cols-1 { grid-template-columns: 1fr; max-width: 400px; }

@media (min-width: 640px) {
	.onora-card-grid.onora-cols-2,
	.onora-card-grid.onora-cols-3,
	.onora-card-grid.onora-cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
	.onora-card-grid.onora-cols-3 { grid-template-columns: repeat(3, 1fr); }
	.onora-card-grid.onora-cols-4 { grid-template-columns: repeat(4, 1fr); }
}


.onora-single-card-section { padding: 0; }
.onora-single-card-section .onora-card-grid { margin-top: 0; }
.onora-grid-section, .onora-single-card-section { padding: 0; border: 0; background: transparent; }

/* ---------- Mosaic: "show all photos" ---------- */

.onora-mosaic { position: relative; }
.onora-mosaic-more {
	position: absolute; right: 16px; bottom: 16px; z-index: 3;
	background: var(--background); color: var(--foreground);
	border: 1px solid var(--border);
	padding: 9px 16px; border-radius: 4px; cursor: pointer;
	font-family: var(--font-body); font-size: 12px;
	letter-spacing: 0.06em; text-transform: uppercase;
	transition: border-color .2s ease, color .2s ease;
}
.onora-mosaic-more:hover { border-color: var(--gold); color: var(--gold); }

/* ---------- Property details table ---------- */

.onora-details-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	margin: 0;
}
@media (min-width: 640px) { .onora-details-grid { grid-template-columns: 1fr 1fr; column-gap: 40px; } }
.onora-detail-item {
	display: flex; justify-content: space-between; gap: 16px;
	padding: 11px 0; border-bottom: 1px solid var(--border);
}
.onora-detail-item dt { font-size: 13px; color: var(--muted-foreground); margin: 0; }
.onora-detail-item dd { font-size: 14px; margin: 0; text-align: right; }
.onora-details-section h2 { font-family: var(--font-display); font-weight: 400; font-size: 22px; margin: 0 0 20px; }

/* ---------- Status flag in the subline ---------- */

.onora-status-flag {
	display: inline-block; border: 1px solid var(--gold); color: var(--gold);
	font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em;
	padding: 2px 9px; border-radius: 2px; vertical-align: middle;
}

/* ---------- Google Map ---------- */

.onora-map-embed {
	border: 1px solid var(--border);
	border-radius: 4px;
	overflow: hidden;
	margin-bottom: 12px;
	line-height: 0;
	filter: saturate(0.75) contrast(1.05) brightness(0.94);
}
.onora-map-embed iframe { display: block; width: 100%; }
.onora-map-link { margin: 0 0 20px; }
.onora-map-link a { color: var(--gold); font-size: 13px; text-decoration: none; }
.onora-map-link a:hover { color: var(--gold-soft); }

/* ---------- Review stars + date ---------- */

.onora-review-stars { color: var(--gold); font-size: 13px; letter-spacing: 0.12em; margin-bottom: 8px; }
.onora-review-stars-off { color: var(--border); }

/* ---------- Advisor card in the booking panel ---------- */

.onora-agent-card {
	display: flex; align-items: center; gap: 12px;
	margin-top: 20px; padding-top: 18px;
	border-top: 1px solid var(--border);
}
.onora-agent-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.onora-agent-body strong { font-size: 13px; font-weight: 600; }
.onora-agent-body a { font-size: 12px; color: var(--muted-foreground); text-decoration: none; }
.onora-agent-body a:hover { color: var(--gold); }

/* ---------- Lightbox counter ---------- */

.onora-lightbox-counter {
	position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
	color: var(--muted-foreground); font-family: var(--font-body);
	font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
}

/* ---------- Archive ---------- */

.onora-archive-page { padding-top: 8px; }
.onora-archive-header { padding-top: 48px; padding-bottom: 8px; }
.onora-archive-header .onora-feed-intro { max-width: 520px; }
.onora-archive-page .onora-card-grid { margin-top: 40px; }
.onora-archive-pagination { margin: 48px 0 0; text-align: center; }
.onora-archive-pagination .page-numbers {
	display: inline-block; padding: 8px 14px; margin: 0 3px;
	border: 1px solid var(--border); color: var(--muted-foreground);
	text-decoration: none; font-size: 13px; border-radius: 3px;
}
.onora-archive-pagination .page-numbers:hover,
.onora-archive-pagination .page-numbers.current {
	border-color: var(--gold); color: var(--gold);
}
.onora-archive-page .onora-listing-card,
.onora-card-grid .onora-listing-card { height: 100%; }


/* ===========================================================
   Mobile — smaller cards, one per row, nothing clipped
   =========================================================== */

@media (max-width: 639px) {
	.onora-container { padding: 0 16px; }

	/* --- carousel: one card at a time with a peek of the next --- */
	.onora-rail {
		gap: 12px;
		margin-top: 28px;
		padding-bottom: 0;
		/* Snapping was what pushed card 1 off the left edge on load. */
		scroll-snap-type: none;
		/* No chunky scroll track on a phone — the peeking card is the affordance. */
		scrollbar-width: none;
		-ms-overflow-style: none;
		-webkit-overflow-scrolling: touch;
	}
	.onora-rail::-webkit-scrollbar { height: 0; width: 0; display: none; }
	/* Full-width cards: wide and short, the same proportion as the grid.
	   One card per swipe, no half-card peeking in from the side. */
	.onora-rail .onora-listing-card { width: 100%; max-width: none; flex: 0 0 100%; scroll-snap-align: none; }

	/* Keep the swipe short — 4 cards on a phone instead of the whole set, so the
	   scroll track stays tiny. Change it with mobile_count="2|3|4|5|6|all". */
	.onora-rail:not([class*="onora-mobile-"]) .onora-listing-card:nth-child(n + 5) { display: none; }
	.onora-rail.onora-mobile-2 .onora-listing-card:nth-child(n + 3) { display: none; }
	.onora-rail.onora-mobile-3 .onora-listing-card:nth-child(n + 4) { display: none; }
	.onora-rail.onora-mobile-4 .onora-listing-card:nth-child(n + 5) { display: none; }
	.onora-rail.onora-mobile-5 .onora-listing-card:nth-child(n + 6) { display: none; }
	.onora-rail.onora-mobile-6 .onora-listing-card:nth-child(n + 7) { display: none; }

	/* --- grid: always a single full-width column --- */
	.onora-card-grid,
	.onora-card-grid.onora-cols-1,
	.onora-card-grid.onora-cols-2,
	.onora-card-grid.onora-cols-3,
	.onora-card-grid.onora-cols-4 {
		grid-template-columns: 1fr;
		gap: 16px;
		max-width: none;
	}
	.onora-card-grid .onora-listing-card { width: 100%; max-width: 100%; }

	/* --- the card itself, scaled down --- */
	.onora-listing-card { padding: 8px; }
	.onora-lc-media { height: 190px; }
	.onora-lc-body { padding: 16px 0 2px; }
	.onora-lc-price { font-size: 21px; margin-bottom: 10px; }
	.onora-lc-period { font-size: 12px; }
	.onora-lc-title { font-size: 16px; margin-bottom: 6px; }
	.onora-lc-location { font-size: 13px; margin-bottom: 14px; }
	.onora-lc-divider { margin-bottom: 12px; }
	.onora-lc-specs { font-size: 12.5px; margin-bottom: 16px; }
	.onora-lc-cta { padding: 12px 8px; font-size: 10.5px; letter-spacing: 0.14em; }
}

/* very small phones */
@media (max-width: 380px) {
	.onora-lc-media { height: 165px; }
	.onora-lc-price { font-size: 19px; }
	.onora-lc-title { font-size: 15px; }
	.onora-lc-cta { font-size: 10px; letter-spacing: 0.12em; }
}


/* ===========================================================
   Section headings on the listing page — pure white, same as
   the listing title, so they don't sink into the background.
   =========================================================== */

.onora-listing-page .onora-verified-strip h2,
.onora-listing-page .onora-details-section h2,
.onora-listing-page .onora-amenities-section h2,
.onora-listing-page .onora-location-section h2,
.onora-listing-page .onora-reviews-section h2,
.onora-listing-page .onora-similar-section h2,
.onora-listing-page .onora-contact-cta h2,
.onora-listing-page .onora-archive-header h1,
.onora-listing-page h2 {
	color: #FFFFFF;
}

/* the gold star in "★ 4.8 · 0 verified reviews" stays gold */
.onora-listing-page h2 .onora-star { color: var(--gold); }

/* ===========================================================
   Reservation card — guests, availability, live total
   =========================================================== */

/* highlights: white title, icon instead of the plain "O" */
.onora-listing-page .onora-highlight-card h3 { color: #FFFFFF; }
.onora-listing-page .onora-highlight-card p { color: color-mix(in oklch, var(--foreground) 72%, transparent); }
.onora-highlight-mark { color: var(--gold); line-height: 0; margin-bottom: 10px; }
.onora-highlight-mark svg { display: block; }

/* --- guest picker --- */
.onora-guest-picker { position: relative; }

.onora-guest-toggle {
	width: 100%;
	display: flex; align-items: center; gap: 8px;
	background: var(--background);
	border: 1px solid var(--border);
	border-radius: 4px;
	padding: 10px 12px;
	cursor: pointer;
	text-align: left;
	font-family: var(--font-body);
	color: var(--foreground);
	transition: border-color .2s ease;
}
.onora-guest-toggle:hover { border-color: var(--gold); }
.onora-guest-label {
	font-size: 11px; text-transform: uppercase; letter-spacing: .1em;
	color: var(--muted-foreground);
}
.onora-guest-summary { font-size: 13px; margin-left: auto; }
.onora-guest-chevron { color: var(--muted-foreground); flex-shrink: 0; transition: transform .2s ease; }
.onora-guests-open .onora-guest-chevron { transform: rotate(180deg); }

.onora-guest-panel {
	position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px);
	background: var(--card);
	border: 1px solid var(--border);
	border-radius: 6px;
	padding: 6px 16px 14px;
	box-shadow: 0 18px 40px rgba(0,0,0,.55);
}
.onora-guest-panel[hidden] { display: none; }

.onora-guest-row {
	display: flex; align-items: center; gap: 12px;
	padding: 14px 0;
	border-bottom: 1px solid var(--border);
}
.onora-guest-row:last-of-type { border-bottom: 0; }
.onora-guest-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.onora-guest-text strong { font-size: 14px; font-weight: 600; color: #FFFFFF; }
.onora-guest-text span { font-size: 12px; color: var(--muted-foreground); }

.onora-stepper { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.onora-step {
	width: 30px; height: 30px; border-radius: 50%;
	border: 1px solid var(--border); background: transparent;
	color: var(--foreground); font-size: 16px; line-height: 1;
	cursor: pointer; padding: 0;
	display: flex; align-items: center; justify-content: center;
	transition: border-color .2s ease, color .2s ease, opacity .2s ease;
}
.onora-step:hover:not(:disabled) { border-color: var(--gold); color: var(--gold); }
.onora-step:disabled { opacity: .3; cursor: not-allowed; }
.onora-step-value { font-size: 14px; min-width: 16px; text-align: center; font-variant-numeric: tabular-nums; }

.onora-guest-note { font-size: 11.5px; color: var(--muted-foreground); line-height: 1.5; margin: 12px 0 0; }
.onora-guest-close {
	display: block; margin: 12px 0 0 auto;
	background: transparent; border: 0; padding: 4px;
	color: var(--foreground); font-family: var(--font-body);
	font-size: 13px; font-weight: 600; cursor: pointer;
	text-decoration: underline;
}
.onora-guest-close:hover { color: var(--gold); }

/* --- availability alert --- */
.onora-booking-alert {
	background: color-mix(in oklch, #b23b3b 16%, transparent);
	border: 1px solid #b23b3b;
	color: #e8b0b0;
	border-radius: 4px;
	padding: 11px 12px;
	font-size: 12.5px;
	line-height: 1.5;
}
.onora-booking-alert[hidden] { display: none; }

/* --- live price breakdown --- */
.onora-price-breakdown {
	border-top: 1px solid var(--border);
	padding-top: 14px;
	display: flex; flex-direction: column; gap: 10px;
}
.onora-price-breakdown[hidden] { display: none; }
.onora-price-line {
	display: flex; justify-content: space-between; gap: 12px;
	font-size: 13px; color: var(--muted-foreground);
}
.onora-price-line span:last-child { color: var(--foreground); white-space: nowrap; }
.onora-price-total {
	border-top: 1px solid var(--border);
	padding-top: 12px;
	font-size: 15px;
}
.onora-price-total span { color: #FFFFFF; font-weight: 600; }

.onora-reserve-btn:disabled { opacity: .45; cursor: not-allowed; }
.onora-reserve-btn:disabled:hover { background: var(--gold); }

/* --- already-reserved list --- */
.onora-booked-dates {
	margin-top: 18px; padding-top: 16px;
	border-top: 1px solid var(--border);
}
.onora-booked-dates strong {
	display: block; font-size: 11px; text-transform: uppercase;
	letter-spacing: .14em; color: var(--muted-foreground); margin-bottom: 8px;
}
.onora-booked-dates ul { list-style: none; margin: 0; padding: 0; }
.onora-booked-dates li {
	font-size: 12.5px; color: var(--foreground);
	padding: 4px 0 4px 16px; position: relative;
}
.onora-booked-dates li::before {
	content: ''; position: absolute; left: 0; top: 10px;
	width: 6px; height: 6px; border-radius: 50%; background: #b23b3b;
}

@media (max-width: 639px) {
	.onora-guest-panel { position: static; box-shadow: none; margin-top: 8px; }
}

/* ===========================================================
   Property video — mosaic tile + full-screen player
   =========================================================== */

.onora-mosaic-cell.onora-mosaic-video { position: relative; }
.onora-mosaic-video img { filter: brightness(0.62); transition: filter .3s ease, transform 500ms ease; }
.onora-mosaic-video:hover img { filter: brightness(0.5); }

.onora-video-overlay {
	position: absolute; inset: 0;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center; gap: 10px;
	pointer-events: none;
}
.onora-video-play {
	width: 58px; height: 58px; border-radius: 50%;
	background: var(--gold); color: var(--gold-foreground);
	display: flex; align-items: center; justify-content: center;
	padding-left: 3px;
	box-shadow: 0 8px 24px rgba(0,0,0,.45);
	transition: transform .25s ease;
}
.onora-mosaic-video:hover .onora-video-play { transform: scale(1.08); }
.onora-video-caption {
	font-family: var(--font-body);
	font-size: 11px; color: #FFFFFF;
	text-transform: uppercase; letter-spacing: .18em;
	text-shadow: 0 2px 8px rgba(0,0,0,.7);
}

.onora-video-modal {
	position: fixed; inset: 0; z-index: 10000;
	background: rgba(0,0,0,.94);
	display: none; align-items: center; justify-content: center;
	padding: 24px;
}
.onora-video-modal.is-open { display: flex; }
.onora-video-frame {
	width: min(1100px, 94vw);
	aspect-ratio: 16 / 9;
	background: #000;
	border: 1px solid var(--border);
}
.onora-video-frame iframe,
.onora-video-frame video { width: 100%; height: 100%; display: block; border: 0; }
.onora-video-close {
	position: absolute; top: 16px; right: 24px;
	background: transparent; border: 0; color: #F2F0EC;
	font-size: 34px; line-height: 1; cursor: pointer; padding: 8px;
}
.onora-video-close:hover { color: var(--gold); }

@media (max-width: 639px) {
	.onora-video-play { width: 46px; height: 46px; }
	.onora-video-caption { font-size: 9.5px; letter-spacing: .14em; }
}

/* ===========================================================
   Review polish
   =========================================================== */

/* the quote text was sitting flush against its rule */
.onora-listing-page .onora-review-quotes blockquote {
	margin: 0;
	padding: 0 0 0 10px;
	border-left: 2px solid var(--border);
}
.onora-listing-page .onora-review-quotes blockquote:hover { border-left-color: color-mix(in oklch, var(--gold) 45%, transparent); }

/* the score row sizes itself to however many scores were filled in */
.onora-review-scores.onora-scores-1 { grid-template-columns: 1fr; }
.onora-review-scores.onora-scores-2 { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) {
	.onora-review-scores.onora-scores-1 { grid-template-columns: repeat(1, 1fr); max-width: 120px; }
	.onora-review-scores.onora-scores-2 { grid-template-columns: repeat(2, 1fr); max-width: 200px; }
	.onora-review-scores.onora-scores-3 { grid-template-columns: repeat(3, 1fr); max-width: 290px; }
}

/* breathing room above the two bottom headings */
.onora-listing-page .onora-contact-cta h2 { padding-top: 20px; }
.onora-listing-page .onora-similar-section h2 { padding-top: 30px; }
