/* =================================================================
 * Travelisto Hotel Layout — V2 Sectioned Template
 *
 * Mobile-first. All classes prefixed `.thv2-` to avoid theme/legacy
 * collisions. Designed to look correct under any active WordPress theme.
 *
 * Layout (top → bottom):
 *   - Hero image with title overlay
 *   - Slim highlights band (black on cream, scrollable on mobile)
 *   - Sections, all closed by default
 *   - Tab nav (fixed bottom, above CTA bar)
 *   - Two CTA buttons (yellow, fixed very bottom)
 * ================================================================= */

.thv2 {
	/* Brand tokens — aligned with Travelisto holidays + tailormade-holiday templates.
	   Previously this file used terracotta + Fraunces serif; switched to the
	   Travelisto yellow + Montserrat/Cabin in v3.1.0 (2026-05-11) for visual
	   consistency across the holiday-content templates. */
	--ya:         #FFCC05;
	--ya-deep:    #E8B800;
	--ya-soft:    #FFFBEA;
	--ink:        #111;
	--ink-soft:   #2a2a2a;
	--muted:      #6b6b6b;
	--paper:      #FAFAF7;
	--paper-soft: #F3EDE1;
	--cream:      #F3EDE1;
	--surface:    #FFFFFF;
	--line:       #E6E0D4;
	/* Legacy aliases kept to avoid touching every rule downstream */
	--accent:        var(--ya-deep);
	--accent-ink:    var(--ink);
	--accent-soft:   var(--ya-soft);
	--cta-yellow:    var(--ya);
	--cta-yellow-hi: #FFD83D;
	--font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--font-body:    'Cabin', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--radius:    10px;
	--radius-lg: 18px;
	--shadow-sm: 0 1px 2px rgba(17,17,17,.06), 0 4px 16px rgba(17,17,17,.04);
	--container: 1240px;
	/* --pad-x bumped in v3.1.1: previous clamp(1.25rem, 5vw, 2rem) capped
	   horizontal padding at 32px which felt tight against the hero title
	   on medium viewports. New range gives 24-56px so content breathes. */
	--pad-x:     clamp(1.5rem, 5vw, 3.5rem);
	--ease: cubic-bezier(.2, .7, .2, 1);

	font-family: var(--font-body);
	color: var(--ink);
	background: var(--paper);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	/* v3.1.3: dropped the negative-margin "break out of theme container"
	   trick — on mobile (viewport < container max-width) the negative
	   margin exactly cancelled out the inner padding, leaving content
	   flush against the viewport edge (0px effective left padding).
	   Sections that still want a viewport-wide colored background now
	   use the 100vw breakout pattern below. */
	margin: 0;
	font-size: 16px;
}

/* Full-bleed sections — break out to viewport width so their colored
   backgrounds extend edge-to-edge while their inner content stays
   constrained to var(--container). Safe on mobile (viewport width is
   the maximum so they just span full width) AND desktop (50%-50vw
   pulls them out to the viewport boundaries). */
.thv2 .thv2-hero,
.thv2 .thv2-highlights,
.thv2 .thv2-cta-bar,
.thv2 .thv2-facts {
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
}

/* Sticky-top mode: no bottom padding needed.
 * (Old bottom-fixed mode reserved viewport space at the bottom — obsolete.) */
.thv2 {
	padding-bottom: 0;
}

.thv2 *, .thv2 *::before, .thv2 *::after { box-sizing: border-box; }
.thv2 img { max-width: 100%; height: auto; display: block; }
.thv2 a { color: var(--accent); text-decoration: underline; text-underline-offset: .18em; }
.thv2 a:hover { color: var(--accent-ink); }
.thv2 strong { font-weight: 600; color: var(--ink); }
.thv2 em { font-style: italic; }
.thv2 p { margin: 0 0 1em; }
.thv2 p:last-child { margin-bottom: 0; }

/* ───────────────────────────────────────────────────
 * HERO (image with title overlay — shown ONCE)
 *
 * Defensive CSS: theme containers may strip our positioning,
 * so we use !important on the critical layout properties to
 * defend the overlay treatment under any active theme.
 * ─────────────────────────────────────────────────── */
.thv2 .thv2-hero {
	position: relative !important;
	background: linear-gradient(135deg, #1a2945, #0e1626);
	overflow: hidden;
	margin: 0;
	padding: 0;
	min-height: 58vh;
	display: flex !important;
	align-items: flex-end !important;
}
@media (min-width: 768px) {
	.thv2 .thv2-hero { min-height: 70vh; }
}
.thv2 .thv2-hero__media {
	position: absolute !important;
	inset: 0 !important;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	z-index: 0;
}
.thv2 .thv2-hero__media img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
	max-width: none !important;
	margin: 0 !important;
}
.thv2 .thv2-hero__media::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,.1) 0%, rgba(14,22,38,.45) 50%, rgba(14,22,38,.85) 100%);
	pointer-events: none;
	z-index: 1;
}
.thv2 .thv2-hero__content {
	position: relative !important;
	width: 100% !important;
	padding: calc(var(--header-h, 72px) + 2.5rem) var(--pad-x) clamp(1.5rem, 3vw, 2.5rem) !important;
	color: white !important;
	max-width: var(--container);
	margin-inline: auto;
	z-index: 2;
}
@media (min-width: 768px) {
	.thv2 .thv2-hero__content {
		padding: calc(var(--header-h, 72px) + 4rem) var(--pad-x) clamp(2rem, 4vw, 3rem) !important;
	}
}
.thv2 .thv2-hero__title {
	font-family: var(--font-display) !important;
	font-style: normal !important;
	font-weight: 800 !important;
	font-size: clamp(2rem, 6vw, 3.8rem) !important;
	line-height: 1.05 !important;
	letter-spacing: -0.02em;
	margin: 0 0 .5rem !important;
	color: white !important;
	text-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.thv2 .thv2-hero__meta {
	display: flex !important;
	flex-wrap: wrap;
	gap: .5rem .9rem;
	align-items: center;
	font-size: .9rem;
	opacity: .92;
	color: white !important;
}
.thv2 .thv2-hero__meta span {
	color: white !important;
}
.thv2 .thv2-hero__stars {
	color: #ffb340 !important;
	letter-spacing: -.05em;
	font-size: 1.05rem;
}

/* ───────────────────────────────────────────────────
 * HIGHLIGHTS BAND — wrapping paragraph, max 5 lines, no scroll
 * ─────────────────────────────────────────────────── */
.thv2 .thv2-highlights {
	background: var(--paper-soft);
	border-bottom: 1px solid var(--line);
}
.thv2 .thv2-highlights__inner {
	max-width: var(--container);
	margin-inline: auto;
	padding: 1rem var(--pad-x) !important;
	box-sizing: border-box;
	color: var(--ink);
	font-size: .88rem;
	line-height: 1.5;
	font-weight: 500;
	letter-spacing: -0.005em;
	/* Cap at 5 visible lines, ellipsize anything beyond */
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
	line-clamp: 5;
	overflow: hidden;
}
/* Inline items separated by ✦ — wraps naturally */
.thv2 .thv2-highlights__item {
	display: inline;
}
.thv2 .thv2-highlights__item + .thv2-highlights__item::before {
	content: " ✦ ";
	color: var(--ya-deep);
	font-weight: 700;
	margin: 0 .15rem;
	white-space: pre;
}
@media (min-width: 768px) {
	.thv2 .thv2-highlights__inner { font-size: .92rem; padding: 1.15rem var(--pad-x) !important; }
}

/* ───────────────────────────────────────────────────
 * MAIN + SECTIONS (all closed by default)
 * ─────────────────────────────────────────────────── */
.thv2 .thv2-main {
	max-width: var(--container);
	margin-inline: auto;
	padding: 0 var(--pad-x) !important;
	box-sizing: border-box;
}

.thv2-section {
	border-top: 1px solid var(--line);
	scroll-margin-top: 8px;
}
.thv2-section:first-of-type { border-top: 0; }
.thv2-section + .thv2-section { /* visual separation when collapsed */ }

.thv2-section > summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.1rem 0;
	user-select: none;
}
.thv2-section > summary::-webkit-details-marker { display: none; }
.thv2-section > summary::after {
	content: "";
	width: 11px;
	height: 11px;
	border-right: 2px solid var(--ink);
	border-bottom: 2px solid var(--ink);
	transform: rotate(45deg);
	transition: transform .25s;
	flex-shrink: 0;
	margin-right: .25rem;
}
.thv2-section[open] > summary::after {
	transform: rotate(-135deg);
	margin-top: .35rem;
}

.thv2-section__title {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: clamp(1.35rem, 3vw, 1.85rem);
	letter-spacing: -0.015em;
	margin: 0;
	color: var(--ink);
	line-height: 1.15;
}

.thv2-section[open] > .thv2-section__inner {
	padding: 0 0 1.75rem;
	animation: thv2-fade .25s ease;
}
@keyframes thv2-fade {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}
.thv2-section__inner > * + * { margin-top: 1rem; }

/* ───────────────────────────────────────────────────
 * TEXT
 * ─────────────────────────────────────────────────── */
.thv2-text {
	color: var(--ink-soft);
}
.thv2-text p { margin: 0 0 1em; }
.thv2-text p:last-child { margin-bottom: 0; }
.thv2-text ul, .thv2-text ol { padding-left: 1.25rem; margin: 0 0 1em; }
.thv2-text li { margin-bottom: .35em; }
.thv2-text h3, .thv2-text h4 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 1.2rem;
	color: var(--ink);
	margin: 1.5em 0 .5em;
}

/* ───────────────────────────────────────────────────
 * COLUMNS
 * ─────────────────────────────────────────────────── */
.thv2-cols {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: 1fr;
}
@media (min-width: 768px) {
	.thv2-cols--2    { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
	.thv2-cols--side { grid-template-columns: 1.1fr .9fr; gap: 2.5rem; }
}
.thv2-subblock h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 1.2rem;
	margin: 0 0 .5rem;
	color: var(--ink);
	letter-spacing: -.005em;
}

/* ───────────────────────────────────────────────────
 * FACTS STRIP
 * ─────────────────────────────────────────────────── */
.thv2-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: .5rem;
}
.thv2-fact {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: .75rem .9rem;
}
.thv2-fact__label {
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--muted);
	font-weight: 700;
	margin-bottom: .15rem;
}
.thv2-fact__value {
	font-family: var(--font-display);
	font-size: 1.05rem;
	font-weight: 500;
	color: var(--ink);
}

/* ───────────────────────────────────────────────────
 * DISTANCE LIST
 * ─────────────────────────────────────────────────── */
.thv2-dist {
	margin: 0; padding: 0;
	list-style: none;
	display: grid;
	gap: .15rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: .5rem 1rem;
}
.thv2-dist li {
	display: flex; justify-content: space-between; gap: 1rem;
	padding: .65rem 0;
	border-bottom: 1px dashed var(--line);
	font-size: .92rem;
}
.thv2-dist li:last-child { border-bottom: 0; }
.thv2-dist li strong { font-weight: 500; color: var(--ink-soft); }
.thv2-dist li span { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }

/* ───────────────────────────────────────────────────
 * GALLERY — compact thumbnail grid (square aspect)
 * ─────────────────────────────────────────────────── */
.thv2-gal {
	display: grid;
	gap: .5rem;
	grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 500px)  { .thv2-gal { grid-template-columns: repeat(3, 1fr); gap: .65rem; } }
@media (min-width: 800px)  { .thv2-gal { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1100px) { .thv2-gal { grid-template-columns: repeat(5, 1fr); } }
.thv2-gal__item {
	border: 0;
	background: var(--paper-soft);
	padding: 0;
	cursor: zoom-in;
	border-radius: var(--radius);
	overflow: hidden;
	aspect-ratio: 1 / 1;
}
.thv2-gal__item img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .3s ease;
}
.thv2-gal__item:hover img,
.thv2-gal__item:focus-visible img { transform: scale(1.04); }
.thv2-gal__item:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}
.thv2-gal__count {
	font-size: .75rem;
	color: var(--muted);
	margin: .75rem 0 0;
	font-weight: 500;
}

/* ───────────────────────────────────────────────────
 * FAQ
 * ─────────────────────────────────────────────────── */
.thv2-faqs { display: grid; gap: 0; }
.thv2-faq {
	border-top: 1px solid var(--line);
}
.thv2-faq:last-child { border-bottom: 1px solid var(--line); }
.thv2-faq summary {
	list-style: none;
	cursor: pointer;
	padding: 1rem 0;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	font-weight: 600;
	font-size: .98rem;
	color: var(--ink);
}
.thv2-faq summary::-webkit-details-marker { display: none; }
.thv2-faq summary::after {
	content: "+";
	font-size: 1.5rem;
	font-weight: 300;
	color: var(--accent);
	transition: transform .2s;
	flex-shrink: 0;
	line-height: 1;
}
.thv2-faq[open] summary::after { transform: rotate(45deg); }
.thv2-faq__body {
	padding: 0 0 1.25rem;
	color: var(--ink-soft);
	font-size: .95rem;
}
.thv2-faq__body p:last-child { margin-bottom: 0; }

/* ───────────────────────────────────────────────────
 * INLINE CTA BAND — heading + two yellow buttons
 *
 * Was previously a fixed-bottom sticky CTA bar with companion
 * sticky tab nav; both removed in v3.1.0 per UX feedback ("sticky
 * navigation, not needed"). Now renders as a regular section
 * after the highlights band so booking CTAs stay visible without
 * occupying viewport real-estate.
 * ─────────────────────────────────────────────────── */
.thv2 .thv2-cta-bar {
	background: var(--surface);
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	padding: 1.25rem var(--pad-x);
	display: flex;
	flex-direction: column;
	gap: .75rem;
	align-items: center;
	box-sizing: border-box;
}
@media (min-width: 768px) {
	.thv2 .thv2-cta-bar {
		flex-direction: row;
		justify-content: center;
		gap: 1.25rem;
		padding: 1.5rem var(--pad-x);
	}
}
.thv2 .thv2-cta-bar__heading {
	font-family: var(--font-display);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	text-align: center;
	line-height: 1.2;
	margin: 0;
}
.thv2 .thv2-cta-bar__buttons {
	display: flex;
	gap: .65rem;
	align-items: stretch;
	width: 100%;
	max-width: 520px;
	flex-wrap: wrap;
	justify-content: center;
}
@media (min-width: 768px) {
	.thv2 .thv2-cta-bar__buttons { flex-wrap: nowrap; }
}
.thv2 .thv2-cta-bar__btn {
	flex: 1 1 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	background: var(--ya) !important;
	color: var(--ink) !important;
	text-decoration: none !important;
	padding: .95rem 1.4rem;
	border-radius: 999px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: .98rem;
	text-align: center;
	border: 0;
	cursor: pointer;
	transition: background .2s var(--ease), transform .2s var(--ease);
	line-height: 1.15;
	letter-spacing: 0;
	white-space: nowrap;
}
.thv2 .thv2-cta-bar__btn:hover,
.thv2 .thv2-cta-bar__btn:focus-visible {
	background: var(--ya-deep) !important;
	transform: translateY(-2px);
}
.thv2 .thv2-cta-bar__btn:active { transform: scale(.985); }
.thv2 .thv2-cta-bar__btn--package {
	background: var(--ink) !important;
	color: var(--ya) !important;
}
.thv2 .thv2-cta-bar__btn--package:hover,
.thv2 .thv2-cta-bar__btn--package:focus-visible {
	background: var(--ink-soft) !important;
	color: var(--ya) !important;
}

/* ───────────────────────────────────────────────────
 * LIGHTBOX
 * ─────────────────────────────────────────────────── */
.thv2-lightbox {
	border: 0;
	padding: 0;
	background: transparent;
	width: min(96vw, 1400px);
	max-width: none;
	max-height: 96vh;
	color: white;
	font-family: var(--font-body);
}
.thv2-lightbox::backdrop {
	background: rgba(10, 8, 6, 0.94);
	backdrop-filter: blur(8px);
}
.thv2-lightbox__img {
	width: 100%; height: auto; max-height: 90vh; object-fit: contain;
	display: block;
	border-radius: var(--radius-lg);
	background: #0e0c0a;
}
.thv2-lightbox__close,
.thv2-lightbox__prev,
.thv2-lightbox__next {
	position: fixed;
	background: rgba(255,255,255,.08);
	color: white;
	border: 1px solid rgba(255,255,255,.18);
	border-radius: 999px;
	width: 48px; height: 48px;
	font-size: 1.5rem; line-height: 1;
	cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	backdrop-filter: blur(10px);
	transition: background .2s, transform .2s;
	font-family: inherit;
}
.thv2-lightbox__close:hover,
.thv2-lightbox__prev:hover,
.thv2-lightbox__next:hover { background: rgba(255,255,255,.18); }
.thv2-lightbox__close { top: 1.25rem; right: 1.25rem; }
.thv2-lightbox__prev  { left: 1.25rem;  top: 50%; transform: translateY(-50%); }
.thv2-lightbox__next  { right: 1.25rem; top: 50%; transform: translateY(-50%); }
.thv2-lightbox__counter {
	position: fixed;
	bottom: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0,0,0,.55);
	padding: .5rem 1rem;
	border-radius: 999px;
	font-size: .8125rem;
	letter-spacing: .05em;
	font-variant-numeric: tabular-nums;
	backdrop-filter: blur(10px);
	color: white;
}

/* ───────────────────────────────────────────────────
 * BREADCRUMB — discreet, single line, secondary
 * ─────────────────────────────────────────────────── */
.thv2 .thv2-crumb {
	background: var(--paper);
	border-bottom: 1px solid var(--line);
	padding: .55rem 0;
	font-size: .78rem;
}
.thv2 .thv2-crumb__list {
	max-width: var(--container);
	margin-inline: auto;
	padding: 0 var(--pad-x);
	display: flex;
	flex-wrap: nowrap;
	gap: .35rem;
	align-items: center;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	white-space: nowrap;
}
.thv2 .thv2-crumb__list::-webkit-scrollbar { display: none; }
.thv2 .thv2-crumb__item {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	color: var(--muted);
	flex-shrink: 0;
}
.thv2 .thv2-crumb__item a {
	color: var(--ink-soft) !important;
	text-decoration: none !important;
	font-weight: 500;
	transition: color .15s;
}
.thv2 .thv2-crumb__item a:hover {
	color: var(--accent) !important;
	text-decoration: underline !important;
}
.thv2 .thv2-crumb__item span[aria-current="page"] {
	color: var(--ink);
	font-weight: 600;
}
.thv2 .thv2-crumb__sep {
	color: var(--muted);
	font-size: .9rem;
	line-height: 1;
	opacity: .6;
}

/* ───────────────────────────────────────────────────
 * RELATED INTERNAL LINKS — small block above tab nav
 * ─────────────────────────────────────────────────── */
.thv2 .thv2-related {
	background: var(--paper-soft);
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	padding: 1.5rem 0;
	margin-top: 1rem;
}
.thv2 .thv2-related__inner {
	max-width: var(--container);
	margin-inline: auto;
	padding: 0 var(--pad-x);
}
.thv2 .thv2-related__label {
	display: block;
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: var(--muted);
	font-weight: 700;
	margin-bottom: .85rem;
}
.thv2 .thv2-related__list {
	list-style: none;
	margin: 0; padding: 0;
	display: grid;
	gap: .4rem;
	grid-template-columns: 1fr;
}
@media (min-width: 600px) {
	.thv2 .thv2-related__list { grid-template-columns: repeat(3, 1fr); gap: .65rem; }
}
.thv2 .thv2-related__item {
	margin: 0;
}
.thv2 .thv2-related__item a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5rem;
	padding: .85rem 1rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	color: var(--ink) !important;
	text-decoration: none !important;
	font-size: .92rem;
	font-weight: 500;
	transition: border-color .15s, transform .1s, color .15s;
}
.thv2 .thv2-related__item a:hover,
.thv2 .thv2-related__item a:focus-visible {
	border-color: var(--accent);
	color: var(--accent) !important;
}
.thv2 .thv2-related__item a:active { transform: scale(.99); }
.thv2 .thv2-related__item a > span {
	color: var(--accent);
	font-weight: 600;
	transition: transform .15s;
}
.thv2 .thv2-related__item a:hover > span {
	transform: translateX(3px);
}

/* ───────────────────────────────────────────────────
 * REDUCED MOTION
 * ─────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	.thv2 *,
	.thv2 *::before,
	.thv2 *::after {
		transition: none !important;
		animation: none !important;
	}
}

/* =================================================================
 * V2 OVERRIDES — wireframe changes
 *
 * - Breadcrumb moved below hero
 * - Sticky nav+CTA replacing bottom-fixed bars
 * - Facts panel as horizontal-scroll cards before sections
 * - Gallery as constrained thumbnail grid
 * - Map iframe styling
 * - Room sub-collapsibles
 * ================================================================= */

/* ─── BREADCRUMB (positioned after hero) ─── */
.thv2 .thv2-crumb {
	background: var(--paper);
	padding: .55rem 0;
	font-size: .78rem;
	border-bottom: 1px solid var(--line);
}

/* (Removed in v3.1.0: sticky-top tab nav + fixed-bottom CTA bar wrapper.
 * Tab nav was removed entirely; the CTA bar is now a non-sticky inline
 * section rendered after the highlights band. See `.thv2-cta-bar` rules
 * above for the new inline styling.) */

/* ─── FACTS PANEL (cards row) ─── */
.thv2 .thv2-facts {
	background: var(--paper);
	padding: 1rem 0 1.25rem;
	border-bottom: 1px solid var(--line);
}
.thv2 .thv2-facts__inner {
	max-width: var(--container);
	margin-inline: auto;
	padding: 0 var(--pad-x);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: .65rem;
}
@media (min-width: 600px) {
	.thv2 .thv2-facts__inner {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (min-width: 900px) {
	.thv2 .thv2-facts__inner {
		grid-template-columns: repeat(6, 1fr);
		gap: .75rem;
	}
}
.thv2 .thv2-fact {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	padding: .7rem .85rem;
	display: flex;
	flex-direction: column;
	gap: .15rem;
	min-width: 0;
}
.thv2 .thv2-fact__label {
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	line-height: 1.2;
}
.thv2 .thv2-fact__value {
	font-size: .92rem;
	font-weight: 600;
	color: var(--ink);
	line-height: 1.3;
}
.thv2 .thv2-fact__value--stars {
	color: #ffb340;
	letter-spacing: -.05em;
	font-size: 1.05rem;
}

/* ─── GALLERY (compact thumbnail grid) ─── */
.thv2 .thv2-gallery {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: .5rem;
	margin: 0;
	padding: 0;
}
@media (min-width: 500px) {
	.thv2 .thv2-gallery { grid-template-columns: repeat(3, 1fr); gap: .65rem; }
}
@media (min-width: 800px) {
	.thv2 .thv2-gallery { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1100px) {
	.thv2 .thv2-gallery { grid-template-columns: repeat(5, 1fr); }
}
.thv2 .thv2-gallery__item {
	margin: 0;
	overflow: hidden;
	border-radius: var(--radius);
	aspect-ratio: 1 / 1;
	cursor: pointer;
	background: var(--paper-soft);
}
.thv2 .thv2-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s;
}
.thv2 .thv2-gallery__item:hover img {
	transform: scale(1.04);
}

/* ─── MAP IFRAME ─── */
.thv2 .thv2-map {
	border-radius: var(--radius);
	overflow: hidden;
	margin: 0 0 1rem;
	border: 1px solid var(--line);
	background: var(--paper-soft);
}
.thv2 .thv2-map iframe {
	display: block;
	width: 100%;
	border: 0;
	min-height: 260px;
}
@media (min-width: 768px) {
	.thv2 .thv2-map iframe { min-height: 380px; }
}

/* ─── ROOM TYPE SUB-COLLAPSIBLES ─── */
.thv2 .thv2-room {
	border-top: 1px solid var(--line);
	padding: 0;
	margin: 0;
}
.thv2 .thv2-room:first-of-type {
	border-top: 1px solid var(--line);
	margin-top: 1rem;
}
.thv2 .thv2-room > summary {
	list-style: none;
	cursor: pointer;
	padding: .85rem 2rem .85rem 0;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1rem;
	align-items: baseline;
	justify-content: space-between;
	position: relative;
	user-select: none;
}
.thv2 .thv2-room > summary::-webkit-details-marker { display: none; }
.thv2 .thv2-room > summary::after {
	content: "";
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--ink-soft);
	border-bottom: 2px solid var(--ink-soft);
	transform: rotate(45deg);
	transition: transform .2s;
	position: absolute;
	right: .25rem;
	top: 50%;
	margin-top: -7px;
}
.thv2 .thv2-room[open] > summary::after {
	transform: rotate(-135deg);
	margin-top: -3px;
}
.thv2 .thv2-room__title {
	font-weight: 700;
	font-size: 1rem;
	color: var(--ink);
}
.thv2 .thv2-room__sleeps {
	font-size: .82rem;
	color: var(--muted);
	font-weight: 500;
}
.thv2 .thv2-room__body {
	padding: 0 0 1rem;
}
.thv2 .thv2-room__body p {
	margin: 0;
	color: var(--ink-soft);
	font-size: .92rem;
	line-height: 1.6;
}