/*============================================================================
   09-sections.css — per-section overrides homepage

   ŠABLONA pro novou sekci (kopíruj):

   .{sekce},
   .{sekce}.et_pb_section {
       background: var(--sand-1) !important;
       padding: 80px 0 !important;
       position: relative;
       z-index: 1;
       gap: 0 !important; column-gap: 0 !important; row-gap: 0 !important;
   }
   .{sekce} > .et_pb_row,
   .{sekce} > .et_pb_row_inner {
       max-width: var(--container) !important;
       width: 92% !important;
       padding: 0 !important;
       margin: 0 auto !important;
   }
   .{sekce} > .et_pb_row + .et_pb_row { margin-top: 38px !important; }

   KRITICKÉ: cílit jen .et_pb_section a .et_pb_row — nikdy .et_pb_column
   nebo .et_pb_module (rozbije vnořené komponenty; viz skill).
============================================================================*/

/* ==========================================================================
   HERO — úvodní sekce s rezervačním boxem [tr_search]
   Divi: Section.hero (bg obrázek přes Divi UI — editovatelný)
         → Row.hero-copy (eyebrow + H1 + popis)
         → Row.hero-rezbox (TEXT modul: [tr_search])
   ========================================================================== */
.hero,
.hero.et_pb_section {
	/* fallback gradient, dokud není v Divi nastavený bg obrázek */
	background-color: var(--navy);
	background-image: linear-gradient(135deg, var(--sea), var(--navy));
	padding: 80px 0 40px !important;
	min-height: 620px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}

/* tmavnoucí overlay + radiál dole — nad bg obrázkem, pod obsahem */
.hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at bottom, rgba(20, 57, 88, .5), transparent 70%),
		linear-gradient(180deg, rgba(20, 57, 88, .18) 0%, rgba(20, 57, 88, .40) 70%);
	pointer-events: none;
	z-index: 0;
}

.hero > .et_pb_row {
	position: relative;
	z-index: 2;
	max-width: var(--container) !important;
	width: 92% !important;
	padding: 0 !important;
	margin: 0 auto !important;
}
.hero > .et_pb_row.hero-rezbox { margin: 2.5rem auto 0 !important; }

/* --- hero copy (eyebrow + H1 + popis) --- */
.hero-copy .eyebrow { color: #ffd592; }
.hero-copy h1 {
	color: #fff;
	text-shadow: 0 2px 24px rgba(0, 0, 0, .25);
	max-width: 720px;
}
.hero-copy p {
	color: #fff;
	font-size: var(--fs-large);
	opacity: .92;
	max-width: 560px;
}

/* --- rezervační box — restyle [tr_search] (Toret Rooms) do designu --- */
.hero .tr-search-form {
	background: #fff;
	border-radius: var(--r-card);
	box-shadow: var(--shadow);
	padding: 18px;
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1.1fr .7fr .7fr auto;
	gap: 10px;
	align-items: end;
}
.hero .tr-search-field label {
	font-size: .72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: var(--muted);
	display: block;
	margin-bottom: 6px;
}
/* grid/flex prvky musí jít zúžit, jinak date/select přetékají vpravo (mobil) */
.hero .tr-search-form { max-width: 100%; }
.hero .tr-search-field { min-width: 0; }
.hero .tr-search-field select,
.hero .tr-search-field input {
	width: 100%;
	min-width: 0;
	max-width: 100%;
	height: 46px;               /* stejná výška jako tlačítko Hledat */
	box-sizing: border-box;
	border: 1px solid var(--line);
	padding: .7rem .85rem;
	border-radius: var(--r-btn);
	font-family: inherit;
	font-size: .95rem;
	color: var(--navy);
	background: #fff;
}
.hero .tr-search-field select:focus,
.hero .tr-search-field input:focus {
	outline: none;
	border-color: var(--accent);
}
.hero .tr-btn-search {
	background: var(--accent) !important;
	color: #fff !important;
	height: 46px;               /* shodná výška s inputy */
	padding: 0 1.4rem;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--r-btn);
	font-weight: 700;
	white-space: nowrap;
	border: none;
	font-size: 1rem;
	letter-spacing: .05em;
	box-shadow: 0 4px 10px rgba(251, 173, 36, .35);
	cursor: pointer;
	width: 100%;
	transition: background .2s;
}
.hero .tr-btn-search:hover { background: var(--accent-2) !important; }
.hero .tr-btn-search:disabled { opacity: .7; cursor: wait; }

/* věky dětí (objeví se po zadání počtu dětí) */
.hero .tr-search-children-ages {
	margin-top: 10px;
	background: #fff;
	border-radius: var(--r-card);
	box-shadow: var(--shadow);
	padding: 12px 18px;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.hero .tr-child-age-field label {
	font-size: .72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: var(--muted);
	display: block;
	margin-bottom: 6px;
}
.hero .tr-child-age-field input {
	width: 90px;
	border: 1px solid var(--line);
	padding: .5rem .7rem;
	border-radius: var(--r-btn);
	color: var(--navy);
}


/* ==========================================================================
   PROMO — sekce 2: Akční nabídky (promo karty)
   Divi: Section.promo-strip → Row (1 sloupec) → TEXT modul [nj_promo_cards]
   Obsah karet spravuje klient v Admin → Šablona nastavení → HP — Akční nabídky.
   Sekce přesahuje hero nahoru (-40px) a stmívá se do sand-1.
   ========================================================================== */
.promo-strip,
.promo-strip.et_pb_section {
	background: linear-gradient(180deg, rgba(20, 57, 88, 0) 0, var(--sand-1) 45%) !important;
	margin-top: -40px !important;
	padding: 0 0 90px !important;
	position: relative;
	z-index: 3;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
.promo-strip > .et_pb_row {
	max-width: var(--container) !important;
	width: 92% !important;
	padding: 0 !important;
	margin: 0 auto !important;
}

/* mřížka karet (výstup [nj_promo_cards]) */
.promo-strip .promo-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

/* karta */
.promo-strip .promo-card {
	background: #fff;
	border-radius: var(--r-card);
	overflow: hidden;
	box-shadow: var(--shadow);
	transition: transform .25s, box-shadow .25s;
	position: relative;
	display: block;
	color: inherit;
	text-decoration: none;
}
.promo-strip .promo-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-deep);
}
.promo-strip .promo-card .img {
	aspect-ratio: 16 / 10;
	background-size: cover;
	background-position: center;
	background-color: var(--sand-2); /* fallback, dokud není obrázek */
	position: relative;
}
.promo-strip .promo-badge {
	position: absolute;
	top: 14px;
	left: 14px;
	background: var(--coral); /* default; klient přebíjí inline barvou */
	color: #fff;
	font-weight: 700;
	font-size: .78rem;
	padding: .4rem .85rem;
	border-radius: var(--r-pill);
	letter-spacing: .06em;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}
.promo-strip .promo-card .body { padding: 18px 20px; }
.promo-strip .promo-card h3 {
	margin-bottom: .25rem;
	font-size: 1.25rem;
}
.promo-strip .promo-card .meta {
	color: var(--muted);
	font-size: .9rem;
}
.promo-strip .promo-card .price {
	display: flex;
	align-items: baseline;
	gap: .5rem;
	margin-top: .8rem;
}
.promo-strip .promo-card .price-now {
	font-weight: 700;
	color: var(--accent-deep);
	font-size: 1.3rem;
	font-family: var(--font-serif);
}
.promo-strip .promo-card .price-old {
	text-decoration: line-through;
	color: var(--muted);
	font-size: .9rem;
}


/* ==========================================================================
   APARTMENTS — sekce 3: Apartmány na pronájem (slider)
   Divi: Section.apt-section (bg sand-2)
         → Row 1 (TEXT modul: hlavička .apt-head s eyebrow + H2 + šipkami)
         → Row 2 (TEXT modul: [tr_rooms] — Toret Rooms výpis apartmánů)
   Výpis se restyluje do design karet a horizontálního scroll-snap slideru;
   šipky obsluhuje assets/js/apt-slider.js.
   Apartmány = CPT „Pokoje" v Toret Rooms (publikované). Badge/specs se berou
   z metaboxů pokoje (_tr_room_badge, tr_room_general, tr_room_properties, tr_room_rates).
   ========================================================================== */
.apt-section,
.apt-section.et_pb_section {
	background: var(--sand-2) !important;
	padding: 80px 0 !important;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
.apt-section > .et_pb_row {
	max-width: var(--container) !important;
	width: 92% !important;
	padding: 0 !important;
	margin: 0 auto !important;
}
.apt-section > .et_pb_row + .et_pb_row { margin-top: 1.25rem !important; }

/* --- hlavička sekce (eyebrow + H2) --- */
.apt-head h2 { margin: .2rem 0 0; }

/* šipky doplní JS do první (hlavičkové) řady → absolutně vpravo dole, na úrovni H2 */
.apt-section .apt-arrows-anchor { position: relative; }
.apt-arrows {
	position: absolute;
	right: 0;
	bottom: 0;
	display: flex;
	gap: .5rem;
	z-index: 2;
}
.apt-arrow {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--line);
	display: grid;
	place-items: center;
	color: var(--navy);
	transition: all .2s;
	cursor: pointer;
}
.apt-arrow:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.apt-arrow:disabled { opacity: .4; cursor: default; }
.apt-arrow svg { width: 16px; height: 16px; }

/* --- slider track ([tr_rooms] → .tr-rl-grid) --- */
.apt-section .tr-rl-wrap { margin: 0; }
.apt-section .tr-rl-grid {
	display: flex;
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	padding-bottom: 4px;
	scrollbar-width: none;        /* Firefox — navigace přes šipky/swipe */
	-ms-overflow-style: none;
}
.apt-section .tr-rl-grid::-webkit-scrollbar { display: none; }

/* --- karta apartmánu (restyle .tr-rl-card do podoby designu .apt-card) --- */
.apt-section .tr-rl-card {
	/* přesně 3 karty na šířku (gap 24px → 2 mezery) */
	flex: 0 0 calc((100% - 48px) / 3);
	scroll-snap-align: start;
	background: #fff;
	border-radius: var(--r-card);
	overflow: hidden;
	box-shadow: var(--shadow);
	transition: transform .25s;
	display: flex;
	flex-direction: column;
}
.apt-section .tr-rl-card:hover { transform: translateY(-4px); }

/* obrázek 4:3 + bílý štítek */
.apt-section .tr-rl-card-image {
	display: block;
	aspect-ratio: 4 / 3;
	position: relative;
	background: var(--sand-3);
	overflow: hidden;
}
.apt-section .tr-rl-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.apt-section .tr-rl-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	background: rgba(255, 255, 255, .94);
	color: var(--navy);
	padding: .3rem .75rem;
	border-radius: var(--r-pill);
	font-size: .75rem;
	font-weight: 600;
}

/* tělo karty — grid: nadpis / specs / patička (cena + tlačítko) */
.apt-section .tr-rl-card-body {
	flex: 1;
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto 1fr auto;
	column-gap: .8rem;
	row-gap: .8rem;
	align-items: center;
	padding: 22px;
}
.apt-section .tr-rl-card-title {
	grid-column: 1 / -1;
	grid-row: 1;
	margin: 0;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: 1.4rem;
	line-height: 1.15;
	text-transform: none;
}
.apt-section .tr-rl-card-title a { color: var(--navy); text-decoration: none; }
.apt-section .tr-rl-card-title a:hover { color: var(--accent-deep); }

.apt-section .tr-rl-card-props {
	grid-column: 1 / -1;
	grid-row: 2;
	align-self: start;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .4rem .8rem;
	font-size: .9rem;
	color: var(--muted);
}
.apt-section .tr-rl-prop { display: flex; align-items: baseline; }
/* design používá • v accent barvě místo ✓ */
.apt-section .tr-rl-prop-icon { font-size: 0; }
.apt-section .tr-rl-prop-icon::before {
	content: "•";
	font-size: .9rem;
	color: var(--accent);
	font-weight: 700;
	margin-right: .4rem;
}

/* patička: cena vlevo, tlačítko vpravo, oddělené čárkovaně */
.apt-section .tr-rl-card-price {
	grid-row: 3;
	grid-column: 1;
	padding-top: 1rem;
	border-top: 1px dashed var(--line);
	font-size: .8rem;
	color: var(--muted);
}
.apt-section .tr-rl-card-price strong {
	display: block;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: 1.4rem;
	color: var(--navy);
}
.apt-section .tr-rl-card-btn {
	grid-row: 3;
	grid-column: 2;
	align-self: center;
	padding-top: 1rem;
	white-space: nowrap;
	font-weight: 600;
	color: var(--accent-deep);
	text-decoration: none;
}
.apt-section .tr-rl-card-btn:hover { color: var(--navy); }


/* ==========================================================================
   FEATURES — sekce 4: Proč u nás (jen Divi moduly, OBECNÉ třídy)
   Žádný plugin/admin → není co scopovat, používáme přímo třídy z designu.
   Sázení: Section (tón .s-sand-1) → buď 1 Code modul s .feat-grid (3× .feat),
   nebo 3 sloupce, v každém Code modul s .feat. Ikona = inline SVG v Code modulu.
   ========================================================================== */

/* tóny sekcí (obecné) — dávat na Divi SECTION. !important přebíjí Divi default bg. */
.s-sand-1, .s-sand-1.et_pb_section { background-color: var(--sand-1) !important; }
.s-sand-2, .s-sand-2.et_pb_section { background-color: var(--sand-2) !important; }
.s-sand-3, .s-sand-3.et_pb_section { background-color: var(--sand-3) !important; }
.s-white,  .s-white.et_pb_section  { background-color: var(--white)  !important; }

/* mřížka feature bloků (když je celá sekce v jednom Code modulu) */
.feat-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

/* jeden feature blok (funguje i samostatně v Divi sloupci) */
.feat { text-align: center; padding: 20px; }
.feat-icon {
	width: 90px;
	height: 90px;
	margin: 0 auto 1rem;
	border-radius: 50%;
	background: #fff;
	display: grid;
	place-items: center;
	color: var(--sea);
	box-shadow: var(--shadow);
}
.feat-icon svg { width: 42px; height: 42px; }
.feat h3 { margin-bottom: .4rem; }
.feat p { color: var(--muted); font-size: .95rem; }


/* ==========================================================================
   FOR SALE — sekce 5: Apartmány na prodej (přepínač Aktuálně / Realizované)
   Divi: Section.sale-section.s-white
         → Row1: 2 TEXT moduly — [eyebrow] + [H2 + popis]  (bez mezery mezi nimi)
         → Row2: TEXT modul [nj_sales]  (vlastní shortcode: TABY + výpis projektů)
   [nj_sales] (includes/shortcodes-sale.php) čte CPT tr_sale a vykreslí design markup
   .fs-tabs + .projects-grid[data-panel]. Přepínač obsluhuje assets/js/sale-tabs.js.
   ========================================================================== */
.sale-section,
.sale-section.et_pb_section {
	padding: 80px 0 !important;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
.sale-section > .et_pb_row {
	max-width: var(--container) !important;
	width: 92% !important;
	padding: 0 !important;
	margin: 0 auto !important;
}
.sale-section > .et_pb_row + .et_pb_row { margin-top: 2rem !important; }

/* Row 1: eyebrow modul + nadpis modul jsou 2 oddělené moduly (eyebrow přepisuje
   běžný text). V Divi 5 mají sloupce flex-gap → nulujeme, ať jsou těsně u sebe. */
.sale-section > .et_pb_row:first-child .et_pb_column,
.sale-section > .et_pb_row:first-child .et_flex_column {
	gap: 0 !important;
	row-gap: 0 !important;
}
.sale-head h2 { margin-top: .2rem; }
.sale-head p { color: var(--muted); max-width: 520px; margin-top: .5rem; }

/* ---- TABY (přepínač) — generuje shortcode jako <button class="fs-tab"> ---- */
.fs-tabs { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 2rem; }
.fs-tab {
	padding: .65rem 1.15rem;
	border-radius: var(--r-btn);
	background: transparent;
	border: 1.5px solid var(--line-2);
	color: var(--muted);
	font-size: .88rem;
	font-weight: 600;
	font-family: inherit;
	cursor: pointer;
	transition: all .2s;
}
.fs-tab:hover { border-color: var(--navy); color: var(--navy); }
.fs-tab.is-active { background: var(--navy); color: #fff; border-color: var(--navy); }
.fs-tab .count { margin-left: .3rem; opacity: .75; font-weight: 500; }

/* taby přesune sale-tabs.js do hlavičkové řady → vpravo dole, na úroveň nadpisu
   (stejně jako šipky u „na pronájem"). Na mobilu zpět do toku. */
.sale-section .fs-tabs-anchor { position: relative; }
.sale-section .fs-tabs.is-anchored {
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0;
	z-index: 2;
}
@media (max-width: 980px) {
	/* hlavičková řada je flex (Divi sloupce) → necháme zalomit a taby dáme
	   přes celou šířku POD text (ne vedle něj) */
	.sale-section .et_pb_row.fs-tabs-anchor { flex-wrap: wrap; }
	.sale-section .fs-tabs.is-anchored {
		position: static;
		flex: 0 0 100%;
		width: 100%;
		margin: 1rem 0 0;
		justify-content: flex-start;
	}
}

/* ---- MŘÍŽKA PROJEKTŮ (design .projects-grid / .project-card) ---- */
.projects-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.projects-grid[hidden] { display: none; }

.project-card {
	background: #fff;
	border-radius: var(--r-card);
	overflow: hidden;
	box-shadow: var(--shadow);
	transition: transform .25s, box-shadow .25s;
	display: flex;
	flex-direction: column;
	color: inherit;
	text-decoration: none;
}
.project-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-deep); }
.project-card .img {
	aspect-ratio: 5 / 4;
	background-size: cover;
	background-position: center;
	background-color: var(--sand-2);
	position: relative;
}
.project-status {
	position: absolute;
	top: 14px;
	left: 14px;
	color: #fff;
	padding: .4rem .85rem;
	border-radius: var(--r-pill);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	backdrop-filter: blur(6px);
}
.project-status.forsale { background: rgba(251, 173, 36, .95); }   /* accent */
.project-status.sold    { background: rgba(91, 102, 114, .92); }   /* muted */

.project-card .body { padding: 22px; flex: 1; display: flex; flex-direction: column; gap: .7rem; }
.project-card h3 { margin: 0; font-size: 1.35rem; line-height: 1.2; }
.project-card .loc { font-size: .85rem; color: var(--muted); display: inline-flex; align-items: center; gap: .4rem; }
.project-stats { list-style: none !important; padding: 0; margin: .2rem 0 1rem; display: flex; flex-direction: column; gap: .45rem; }
.project-stats li { list-style: none !important; font-size: .88rem; color: var(--navy); padding-left: 1.2rem; position: relative; }
.project-stats li::before { content: ""; width: 6px; height: 6px; background: var(--accent); border-radius: 50%; position: absolute; left: 0; top: .55rem; }
.project-card .pcfoot {
	margin-top: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 1rem;
	border-top: 1px dashed var(--line);
	gap: 1rem;
}
.project-card .price { font-family: var(--font-serif); font-weight: 700; color: var(--navy); font-size: 1.15rem; line-height: 1.15; }
.project-card .arrow { color: var(--accent-deep); font-weight: 600; font-size: .88rem; letter-spacing: .05em; white-space: nowrap; }


/* ==========================================================================
   REVIEWS — sekce 6: Recenze (carousel pluginu + Google box)
   Divi: Section.reviews-section.s-white
         → Row1: 2 TEXT moduly — [eyebrow] + [H2]  (.reviews-head; bez mezery)
         → Row2: 2 sloupce (2/3 + 1/3):
                 col1 TEXT [tr_reviews show="list"]   — carousel recenzí (Alpine)
                 col2 TEXT [tr_google_reviews style="box"] — Google hodnocení
   Restyl plugin markupu (.tr-rv-* / .tr-gr-*) do podoby designu.
   Carousel (perPage 1/2/3, šipky, autorotace) řeší plugin přes Alpine — naše JS netřeba.
   ========================================================================== */
.reviews-section,
.reviews-section.et_pb_section {
	padding: 80px 0 !important;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
.reviews-section > .et_pb_row {
	max-width: var(--container) !important;
	width: 92% !important;
	padding: 0 !important;
	margin: 0 auto !important;
}
.reviews-section > .et_pb_row + .et_pb_row { margin-top: 1.25rem !important; }
/* Row 1: eyebrow modul + nadpis modul těsně (Divi 5 flex-gap pryč) */
.reviews-section > .et_pb_row:first-child .et_pb_column,
.reviews-section > .et_pb_row:first-child .et_flex_column { gap: 0 !important; row-gap: 0 !important; }
.reviews-head h2 { margin-top: .2rem; }

/* ---- carousel ([tr_reviews]) ---- */
.reviews-section .tr-rv-carousel { position: relative; overflow: hidden; }
/* nativní šipky pluginu skryté — ovládáme přes vlastní .review-arrows v hlavičce
   (proxy klik přes reviews-nav.js), aby seděly k nadpisu jako u „na pronájem". */
.reviews-section .tr-rv-carousel-nav { display: none; }
.reviews-section .tr-rv-carousel-track { display: flex; transition: transform .4s ease; }

/* naše šipky — reviews-nav.js je vloží do hlavičkové řady (vpravo dole, k nadpisu) */
.reviews-section .review-arrows-anchor { position: relative; }
.reviews-section .review-arrows {
	position: absolute;
	right: 0;
	bottom: 0;
	display: flex;
	gap: .5rem;
	z-index: 2;
}

/* karta recenze (.tr-rv-item = layout cell, vizuál na .tr-rv-item-body) */
.reviews-section .tr-rv-item { flex: 0 0 33.333%; box-sizing: border-box; padding: 0 10px; }
.reviews-section .tr-rv-item-image { display: none; } /* design má jen text + jméno */
.reviews-section .tr-rv-item-body {
	height: 100%;
	background: var(--sand-1);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	padding: 24px;
	display: flex;
	flex-direction: column;
}
.reviews-section .tr-rv-item-stars { letter-spacing: .1em; margin-bottom: .6rem; }
.reviews-section .tr-rv-star { color: var(--line-2); }
.reviews-section .tr-rv-star--active { color: var(--accent); }
.reviews-section .tr-rv-item-text { color: var(--navy); font-size: .98rem; line-height: 1.5; margin-bottom: 1.2rem; }
.reviews-section .tr-rv-item-footer {
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px dashed var(--line);
	display: flex;
	flex-direction: column;
	gap: .1rem;
}
.reviews-section .tr-rv-item-name { font-weight: 600; color: var(--navy); font-size: .95rem; }
.reviews-section .tr-rv-item-room,
.reviews-section .tr-rv-item-date { color: var(--muted); font-size: .8rem; }
.reviews-section .tr-rv-empty { color: var(--muted); }

/* ---- Google box ([tr_google_reviews style="box"]) → design .google-box ---- */
.reviews-section .tr-gr-box {
	background: linear-gradient(180deg, #fff, #fafbff);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	padding: 26px;
	text-align: center;
	box-shadow: var(--shadow);
	position: sticky;
	top: 100px;
}
.reviews-section .tr-gr-box-header { display: flex; flex-direction: column; align-items: center; gap: .25rem; }
.reviews-section .tr-gr-google-icon { margin: 0 auto 8px; }
.reviews-section .tr-gr-box-number { font-family: var(--font-serif); font-size: 3.5rem; color: var(--navy); line-height: 1; }
.reviews-section .tr-gr-box-stars { font-size: 1.2rem; letter-spacing: .15em; margin: .4rem 0; }
.reviews-section .tr-gr-star--full,
.reviews-section .tr-gr-star--half { color: var(--accent); }
.reviews-section .tr-gr-star--empty { color: var(--line-2); }
.reviews-section .tr-gr-box-count { color: var(--muted); font-size: .85rem; margin-bottom: 1.1rem; }
.reviews-section .tr-gr-box-btn {
	display: inline-flex;
	width: 100%;
	justify-content: center;
	background: var(--accent);
	color: #fff;
	padding: .85rem 1.5rem;
	border-radius: var(--r-btn);
	font-weight: 600;
	text-decoration: none;
	box-shadow: 0 4px 10px rgba(251, 173, 36, .28);
	transition: background .2s;
}
.reviews-section .tr-gr-box-btn:hover { background: var(--accent-2); }

/* ==========================================================================
   SEO CALLOUT — textová sekce (Pronájem a prodej…). NATIVNÍ Divi moduly.
   Vše přes TŘÍDU SEKCE .seo-section (padding + max-width řady + rozestupy),
   pozadí přes tón .s-sand-3. Na Section dej: `seo-section s-sand-3`.
   Row bez třídy → samostatné moduly: Text(.eyebrow) + Text(H2) + Text(odstavec) + Text(odstavec).
   ========================================================================== */
.seo-section,
.seo-section.et_pb_section {
	padding: 80px 0 !important;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
.seo-section > .et_pb_row {
	max-width: 700px !important;
	width: 92% !important;
	margin: 0 auto !important;
	padding: 0 !important;
	text-align: center;
}
/* Divi 5 dává mezi moduly flex-gap → vynulovat, rozestupy řešíme okraji modulů */
.seo-section .et_pb_column,
.seo-section .et_flex_column { gap: 0 !important; row-gap: 0 !important; }
.seo-section .et_pb_text { text-align: center; }
.seo-section h2 { margin: 0; }
.seo-section p { color: var(--ink); font-size: 1.02rem; margin: 0; }
.seo-section p strong { color: var(--navy); }
/* jednotné rozestupy mezi moduly (eyebrow / H2 / odstavce) */
.seo-section .et_pb_module { margin-bottom: 1rem !important; }
.seo-section .et_pb_module:last-child { margin-bottom: 0 !important; }


/* ==========================================================================
   NEWS + GALLERY — HP sekce 7. bg: tón .s-sand-2.
   Layout = ŘADA s 2 sloupci (1fr 1.3fr) přes třídu SEKCE .ng-section
   (= .ng-wrap z mockupu). Levý sloupec = Novinky [nj_latest_posts],
   pravý = Galerie [nj_gallery] (+ lightbox). Nadpisy/eyebrow/tlačítka =
   nativní Divi moduly (Polylang-friendly).
   Na Section dej: `ng-section s-sand-2`.
   Row: 2 sloupce (poměr je jedno, CSS vynutí 1fr 1.3fr).
   ========================================================================== */
.ng-section,
.ng-section.et_pb_section {
	padding: 80px 0 !important;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
/* Row = jen kontejner (centrování + šířka). Poměr sloupců řeší Divi Row
   (zvol layout 2/5 + 3/5 ≈ 1 : 1,3), mezeru sloupců gutter Divi řady. */
.ng-section > .et_pb_row {
	max-width: var(--container) !important;
	width: 92% !important;
	margin: 0 auto !important;
	padding: 0 !important;
}
/* Vertikální rytmus ve sloupci. Odsazení OBSAHU shortcodů (pod nadpisem
   i pod výpisem) řeší přímo třídy .news-list / .gallery-grid (níže) —
   funguje bez ohledu na to, jak klient rozdělí moduly v Divi. */
.ng-section .et_pb_column,
.ng-section .et_flex_column { gap: 0 !important; row-gap: 0 !important; }
.ng-section .et_pb_text.eyebrow { margin-bottom: .35rem !important; } /* eyebrow těsně k H2 */
.ng-section h2 { margin: 0 !important; }
/* tlačítko „Přečíst všechny novinky" zarovnané vlevo (ghost) */
.ng-section .btn-ghost { padding-left: 0 !important; }

/* ---- Novinky (levý sloupec) ---- */
/* odsazení výpisu: pod nadpisem (top) i pod výpisem před tlačítkem (bottom) */
.ng-section .news-list { margin: 1.5rem 0 1.25rem; }
.ng-section .news-item {
	display: flex;
	gap: 1rem;
	padding: 1rem 0;
	border-bottom: 1px solid var(--line);
	align-items: flex-start;
	text-decoration: none;
}
.ng-section .news-list .news-item:first-child { padding-top: 0; }
.ng-section .news-item:last-child { border-bottom: none; }
.ng-section .news-date {
	flex-shrink: 0;
	width: 70px;
	text-align: center;
	background: #fff;
	border-radius: var(--r-card);
	padding: .5rem;
	box-shadow: var(--shadow);
}
.ng-section .news-date strong {
	display: block;
	font-family: var(--font-serif);
	font-size: 1.4rem;
	color: var(--navy);
	line-height: 1;
}
.ng-section .news-date small {
	font-size: .7rem;
	text-transform: uppercase;
	color: var(--accent-deep);
	letter-spacing: .1em;
}
.ng-section .news-body { flex: 1; }
.ng-section .news-item h4 {
	margin: 0 0 .3rem;
	font-family: var(--font-sans);
	font-size: .98rem;
	color: var(--navy);
	font-weight: 600;
	line-height: 1.35;
	transition: color .2s;
}
.ng-section .news-item:hover h4 { color: var(--accent-deep); }
.ng-section .news-item p { margin: 0; font-size: .85rem; color: var(--muted); line-height: 1.5; }
.ng-section .news-tag {
	display: inline-block;
	font-size: .7rem;
	font-weight: 600;
	color: var(--accent-deep);
	text-transform: uppercase;
	letter-spacing: .1em;
	margin-top: .3rem;
}

/* ---- Galerie (pravý sloupec) ---- */
.ng-section .gallery-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	/* odsazení: pod nadpisem (top) i pod galerií před tlačítkem (bottom) */
	margin: 1.5rem 0 1.25rem;
}
.ng-section .gallery-grid .cell {
	aspect-ratio: 1 / 1;
	background-size: cover;
	background-position: center;
	border: 0;
	padding: 0;
	border-radius: 6px;
	cursor: pointer;
	transition: transform .2s;
	width: 100%;
	display: block;
}
.ng-section .gallery-grid .cell:hover { transform: scale(1.03); }
.ng-section .gallery-grid .cell:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ==========================================================================
   GALLERY LIGHTBOX — vanilla, bez pluginu (assets/js/gallery-lightbox.js)
   ========================================================================== */
.nj-lightbox {
	position: fixed;
	inset: 0;
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4vmin;
	background: rgba(20, 57, 88, .92);
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s;
}
.nj-lightbox.is-open { opacity: 1; visibility: visible; }
.nj-lightbox img {
	max-width: 92vw;
	max-height: 88vh;
	border-radius: var(--r-card);
	box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
	transform: scale(.96);
	transition: transform .25s;
}
.nj-lightbox.is-open img { transform: scale(1); }
.nj-lightbox-close {
	position: absolute;
	top: 18px;
	right: 22px;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
	color: #fff;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	transition: background .2s;
}
.nj-lightbox-close:hover { background: var(--accent); }


/* ==========================================================================
   REGIONS — HP sekce 8 (poslední). Modulová sekce, OBECNÉ třídy (jako features).
   bg: tón .s-sand-1. Hlavička VLEVO (eyebrow + H2), pod ní řada se 3 sloupci;
   každý sloupec = Image modul (kulatá fotka) + H3 + popis, vše na střed.
   Na Section dej: `regions-section s-sand-1`.
   Na každý ze 3 sloupců dej CSS Class: `region`.
   Na Image modul v každém sloupci dej CSS Class: `region-circle`.
   ========================================================================== */
.regions-section,
.regions-section.et_pb_section {
	padding: 80px 0 !important;
	position: relative;
	z-index: 1;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
}
.regions-section > .et_pb_row {
	max-width: var(--container) !important;
	width: 92% !important;
	margin: 0 auto !important;
	padding: 0 !important;
}
/* mezera mezi hlavičkou a mřížkou regionů */
.regions-section > .et_pb_row + .et_pb_row { margin-top: 2rem !important; }
/* hlavička (eyebrow těsně k H2) */
.regions-section .et_pb_text.eyebrow { margin-bottom: .35rem !important; }

/* jeden region (sloupec) — vše na střed */
.region { text-align: center; }
.region.et_pb_column,
.region.et_flex_column { gap: 0 !important; row-gap: 0 !important; }

/* kulatá fotka regionu (Divi Image modul s CSS Class region-circle) */
.region-circle { margin: 0 auto 1rem !important; text-align: center; }
.region-circle .et_pb_image_wrap { display: inline-block; }
.region-circle img {
	width: 180px !important;
	height: 180px !important;
	max-width: 100%;
	object-fit: cover;
	border-radius: 50%;
	border: 5px solid #fff;
	outline: 1px solid var(--line);
	box-shadow: var(--shadow);
	display: block;
	margin: 0 auto;
}
.regions-section h3 { margin: 0 0 .3rem !important; }
.regions-section p { color: var(--muted); font-size: .92rem; margin: 0; }