/*============================================================================
   99-responsive.css — JEN layout (grid sloupce, display, padding).
   Font-size sem NEPATŘÍ — typografie je fluid přes clamp tokeny.
   Breakpointy: 1024 / 980 / 700 / 640 / 480 / 400 / 380
============================================================================*/

/* ---------- 1024px — tablet: desktop nav pryč, burger + drawer ---------- */
@media (max-width: 1024px) {
	.nav { display: none; }
	.burger { display: inline-flex; }

	.footer-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- 700px — topbar: schovat e-mail ---------- */
@media (max-width: 700px) {
	.topbar .left a:not(.phone) { display: none; }
}

/* ---------- 640px — mobil ---------- */
@media (max-width: 640px) {
	/* container i Divi row drží STEJNOU metriku (quirk #28) — Divi řady jsou 92%
	   (page-hero/nj-wide/sekce), takže i .container musí být 92%, jinak hlavička
	   (jede přes .container) nesedí s obsahem v Divi řadách. */
	.container { width: 92%; }

	.topbar .container { justify-content: center; text-align: center; }

	.site-header .header-inner { padding-top: 12px; padding-bottom: 12px; }
	.logo-mark { width: 40px; height: 40px; font-size: 1.15rem; }
	.logo-text strong { font-size: 1.3rem; }

	.footer-grid { grid-template-columns: 1fr; gap: 32px; }
	.footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------- 380px — jen ikony bez popisků ---------- */
@media (max-width: 380px) {
	.burger span { display: none; }
}

/* ==========================================================================
   HERO — rezbox [tr_search]
   ========================================================================== */
@media (max-width: 1024px) {
	.hero .tr-search-form { grid-template-columns: repeat(3, 1fr); }
	.hero .tr-search-field--submit { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
	.hero .tr-search-form { grid-template-columns: 1fr 1fr; }
	.hero,
	.hero.et_pb_section { min-height: 0; }
}
/* malé telefony — vždy 1 pole na řádek (jinak inputy přetékaly vpravo) */
@media (max-width: 480px) {
	.hero .tr-search-form { grid-template-columns: 1fr; }
	.hero .tr-search-children-ages { flex-direction: column; }
	.hero .tr-child-age-field input { width: 100%; }
}


/* ==========================================================================
   PROMO — mřížka karet: 3 → 2 → 1 sloupec
   ========================================================================== */
@media (max-width: 1024px) {
	.promo-strip .promo-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.promo-strip .promo-grid { grid-template-columns: 1fr; }
	.promo-strip,
	.promo-strip.et_pb_section { margin-top: -24px !important; padding-bottom: 60px !important; }
}


/* ==========================================================================
   APARTMENTS — slider: šířka karty podle viewportu
   ========================================================================== */
@media (max-width: 1024px) {
	.apt-section .tr-rl-card { flex-basis: calc((100% - 24px) / 2); } /* přesně 2 karty */
}
@media (max-width: 640px) {
	.apt-section .tr-rl-card { flex-basis: 85%; } /* 1 karta + náznak další (swipe) */
	.apt-section .apt-arrows { display: none; } /* na mobilu jen swipe (šipky by kryly nadpis) */
	.apt-section .tr-rl-card-body { grid-template-columns: 1fr; grid-template-rows: auto auto auto; }
	.apt-section .tr-rl-card-btn { grid-column: 1; grid-row: auto; border-top: 1px dashed var(--line); padding-top: .8rem; }
}


/* ==========================================================================
   FEATURES — feat-grid 3 → 2 → 1 (platí pro variantu s jedním Code modulem;
   varianta se 3 Divi sloupci se řídí Divi responsivem)
   ========================================================================== */
@media (max-width: 1024px) {
	.feat-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.feat-grid { grid-template-columns: 1fr; }
}


/* ==========================================================================
   FOR SALE — mřížka projektů 3 → 2 → 1
   ========================================================================== */
@media (max-width: 1024px) {
	.projects-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.projects-grid { grid-template-columns: 1fr; }
}


/* ==========================================================================
   REVIEWS — šířka karty carouselu MUSÍ sedět s plugin perPage
   (Alpine: <480 → 1, <768 → 2, jinak 3). translateX(-current*100%) pak stránkuje.
   ========================================================================== */
@media (max-width: 767px) {
	.reviews-section .tr-rv-item { flex-basis: 50%; }
}
@media (max-width: 479px) {
	.reviews-section .tr-rv-item { flex-basis: 100%; }
	.reviews-section .tr-gr-box { position: static; } /* na mobilu nelepit */
}
/* na mobilu šipky pod nadpis (ne absolutně přes něj) */
@media (max-width: 640px) {
	.reviews-section .review-arrows { position: static; justify-content: flex-end; margin: .5rem 0 0; }
}


/* ==========================================================================
   NEWS + GALLERY — sloupce Novinky/Galerie stacká Divi Row sám (≤980px).
   Galerie zůstává 3 sloupce (čtvercový teaser) na všech šířkách.
   ========================================================================== */
@media (max-width: 400px) {
	/* na úzkých telefonech menší mezera dlaždic */
	.ng-section .gallery-grid { gap: 6px; }
}