/* ==========================================================================
   atrium.cz — Rozcestníky sekcí (fáze 2, balík A)
   Předloha: https://atrium-marketing.lovable.app/domy · /zdrave-bydleni
   Rozměry změřené v předloze, barvy z design systému HP (hp-redesign.css).

   Grid dlaždic (kategorie modulu) + volitelné obsahové pásy pod ním.
   Scoped na .atr-rc-* → legacy rozcestník ostatních modulů zůstává netknutý.
   ========================================================================== */

/* --- Hlavička stránky --------------------------------------------------- */
/* Předloha: hlavička i grid leží na jednom světle modrém pruhu (#f4f7fb). */

.atr-rc-strana .obsah_vypis_podmenu_horni{
  background:#f4f7fb;
  padding:40px 0 24px;
}

.atr-rc-strana .h1_vypis_podmenu{
  font-size:60px;
  line-height:75px;
  font-weight:800;
  color:var(--atr-ink);
}

.atr-rc-eyebrow{
  font-size:12px;
  font-weight:800;
  letter-spacing:2.4px;
  line-height:16px;
  text-transform:uppercase;
  color:var(--atr-blue-l);
  text-align:center;
  margin-bottom:8px;
}

.atr-rc-strana .blok_text_nad_clanky,
.atr-rc-strana .blok_text_nad_clanky p{
  font-size:18px;
  line-height:29px;
  color:var(--atr-muted);
}

.atr-rc-strana .blok_text_nad_clanky{
  max-width:832px;
  margin:16px auto 0;
}

/* --- Grid dlaždic ------------------------------------------------------- */

.atr-rc-sekce{
  background:#f4f7fb;
  padding:24px 0 48px;
}

/* Dvě dlaždice (rozcestník O nás) — mřížka pro tři sloupce by je nechala vlevo
   s prázdným místem vpravo, proto se zúží na dva sloupce a vycentruje. */
.atr-rc-grid--dve{
  grid-template-columns:repeat(2,1fr) !important;
  max-width:880px;
}

.atr-rc-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:0 40px;
  box-sizing:border-box;
}

.atr-rc-dl{
  position:relative;
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  border-radius:10px;
  background:var(--atr-ink);
  box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);
  transition:box-shadow .3s var(--atr-ease);
  text-decoration:none;
}

.atr-rc-dl:hover{
  box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);
}

.atr-rc-dl-foto{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .7s var(--atr-ease);
}

.atr-rc-dl:hover .atr-rc-dl-foto{
  transform:scale(1.05);
}

/* tmavý gradient zdola — čitelnost bílého názvu na světlých fotkách */
.atr-rc-dl-stin{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.8) 0%,rgba(0,0,0,.3) 50%,rgba(0,0,0,0) 100%);
}

.atr-rc-dl-in{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding:24px;
  box-sizing:border-box;
}

.atr-rc-dl-nazev{
  margin:0;
  font-size:30px;
  line-height:37.5px;
  font-weight:700;
  color:#fff;
}

/* šipka = stejná jako v dlaždicích na HP („Navštivte nás") — čtvereček s rámečkem,
   ne kroužek z předlohy; hover plný modrý (legacy .sipka_vypis_podmenu) */
.atr-rc-dl-sipka{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:1px solid #fff;
  border-radius:4px;
  background:transparent;
  transition:background-color .2s var(--atr-ease),border-color .2s var(--atr-ease);
}

.atr-rc-dl-sipka::after{
  content:"";
  width:16px;
  height:16px;
  background:#fff;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat;
}

.atr-rc-dl:hover .atr-rc-dl-sipka{
  background:#1170B8;
  border-color:#1170B8;
}

/* --- Obsahové pásy pod gridem (Katalog domů) ---------------------------- */

.atr-rc-pasy{
  background:#fff;
  padding:64px 0;
}

.atr-rc-pas{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:center;
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:0 40px;
  box-sizing:border-box;
}

.atr-rc-pas + .atr-rc-pas{
  margin-top:128px;
}

/* liché pásy: text vlevo, foto vpravo (default) · sudé: prohozeno */
.atr-rc-pas--obr-vlevo .atr-rc-pas-text{ order:2; }
.atr-rc-pas--obr-vlevo .atr-rc-pas-obr{ order:1; }

.atr-rc-pas-eyebrow{
  display:block;
  font-size:12px;
  font-weight:800;
  letter-spacing:2.4px;
  line-height:16px;
  text-transform:uppercase;
  color:var(--atr-blue-l);
}

.atr-rc-pas-nadpis{
  margin:12px 0 0;
  font-size:36px;
  line-height:45px;
  font-weight:800;
  color:var(--atr-ink);
}

.atr-rc-pas-perex{
  margin-top:16px;
}

.atr-rc-pas-perex,
.atr-rc-pas-perex p{
  font-size:16px;
  line-height:26px;
  color:var(--atr-muted);
}

.atr-rc-pas-perex p{ margin:0; }
.atr-rc-pas-perex p + p{ margin-top:12px; }

.atr-rc-pas-tl{
  height:44px;
  padding:0 24px;
  margin-top:24px;
}

.atr-rc-pas-obr img{
  display:block;
  width:100%;
  height:auto;
  border-radius:10px;
  box-shadow:var(--atr-shadow-lg);
}

/* --- Scroll reveal (stejná mechanika jako .atr-kb-blok) ----------------- */

.atr-rc-dl[data-atr-reveal],
.atr-rc-pas[data-atr-reveal]{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .6s var(--atr-ease),transform .6s var(--atr-ease);
}

.atr-rc-dl.is-revealed,
.atr-rc-pas.is-revealed{
  opacity:1;
  transform:none;
}

@media (prefers-reduced-motion:reduce){
  .atr-rc-dl[data-atr-reveal],
  .atr-rc-pas[data-atr-reveal]{opacity:1;transform:none;transition:none}
}

/* --- Responzivita -------------------------------------------------------- */

@media (max-width:1100px){
  .atr-rc-strana .h1_vypis_podmenu{font-size:44px;line-height:54px}
  .atr-rc-pas-nadpis{font-size:30px;line-height:38px}
  .atr-rc-dl-nazev{font-size:24px;line-height:30px}
}

@media (max-width:900px){
  .atr-rc-grid{grid-template-columns:repeat(2,1fr);padding:0 24px}
  .atr-rc-pas{grid-template-columns:1fr;gap:28px;padding:0 24px}
  .atr-rc-pas + .atr-rc-pas{margin-top:64px}
  /* foto na mobilu vždy nad textem (obě varianty pásu) */
  .atr-rc-pas .atr-rc-pas-obr{order:1}
  .atr-rc-pas .atr-rc-pas-text{order:2}
  .atr-rc-pasy{padding:48px 0}
}

@media (max-width:600px){
  .atr-rc-strana .obsah_vypis_podmenu_horni{padding:28px 0 20px}
  .atr-rc-strana .h1_vypis_podmenu{font-size:34px;line-height:42px}
  .atr-rc-strana .blok_text_nad_clanky,
  .atr-rc-strana .blok_text_nad_clanky p{font-size:16px;line-height:26px}
  .atr-rc-grid{grid-template-columns:1fr;gap:14px}
  .atr-rc-dl-in{padding:18px}
  .atr-rc-dl-nazev{font-size:22px;line-height:28px}
  .atr-rc-dl-sipka{width:28px;height:28px}
  .atr-rc-pas-nadpis{font-size:26px;line-height:34px}
}

/* --- Rozestupy mezi bloky (korektura klientky 8/2026) --------------------
   Klientka chtěla stránky kompaktnější, ale ne natlačené — Zdravé bydlení,
   Technologie, Stavební proces, Proto ATRIUM. Legacy hodnoty ze styly.css
   (70 px nad i pod spodní sekcí, 48 px pod dlaždicemi) tady zmenšujeme
   o zhruba čtvrtinu. Přebíjí se jen na stránkách rozcestníku (.atr-rc-strana),
   takže se zbytku webu ani legacy stránek nic netýká. */

.atr-rc-strana .atr-rc-sekce{ padding-bottom:36px; }

.atr-rc-strana .obsah_vypis_podmenu_dolni{
  padding-top:52px;
  padding-bottom:52px;
}

/* Prázdný blok se nemá projevit ani odsazením — bez obsahu nezbude po sekci mezera. */
.atr-rc-strana .obsah_vypis_podmenu_dolni:empty,
.atr-rc-strana .blok_duvody_vypis_podmenu:empty{ display:none; }

@media screen and (max-width: 1000px){
  .atr-rc-strana .obsah_vypis_podmenu_dolni{ padding-top:40px; padding-bottom:40px; }
  .atr-rc-strana .atr-rc-sekce{ padding-bottom:28px; }
}

/* --- Sjednocení modrých podkladů (korektura klientky 8/2026) -------------
   Na rozcestnících se potkávaly tři odstíny: #F4F7FB (hlavička + grid dlaždic),
   #EEF3FB (podklad celé stránky ze styly.css) a #EAF1F8 (blok „6 důvodů proč
   ATRIUM"). Klientka chtěla jeden, a to ten nejsvětlejší. Přebíjí se jen uvnitř
   .atr-rc-strana — homepage ani legacy stránky si svoje odstíny nechávají. */

.obsah.atr-rc-strana{ background-color:#f4f7fb; }
.atr-rc-strana .blok_proc_atrium_home{ background-color:#f4f7fb; }