/* ==========================================================================
   atrium.cz — Kontakty → Odborní poradci (fáze 2, balík E — redesign)
   Předloha: https://atrium-marketing.lovable.app/kontakty/odborni-poradci
   Rozměry změřené v předloze, barvy z design systému HP (hp-redesign.css).

   Hlavička je vlastní — tmavě modrý pruh s bílým textem vlevo, přesně jak
   má předloha u poradců (ostatní kontaktní stránky mají světlý pruh).
   ========================================================================== */

.atr-pd{
  background:#fff;
}

/* --- Hlavička stránky ---------------------------------------------------- */

.atr-pd-hlavicka{
  background:var(--atr-blue);
  padding:64px 0;
}

.atr-pd-hlavicka .blok_sirky_webu{
  width:100%;
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
  padding-left:40px;
  padding-right:40px;
  box-sizing:border-box;
  text-align:left;
}

.atr-pd-eyebrow{
  font-size:14px;
  line-height:20px;
  font-weight:700;
  letter-spacing:1.4px;
  text-transform:uppercase;
  color:rgba(255,255,255,.7);
}

.atr-pd-h1{
  margin:12px 0 0;
  font-size:48px;
  line-height:48px;
  font-weight:800;
  color:#fff;
}

.atr-pd-perex{
  max-width:672px;
  margin-top:16px;
}

.atr-pd-perex,
.atr-pd-perex p{
  font-size:18px;
  line-height:28px;
  color:rgba(255,255,255,.9);
}

.atr-pd-perex p{ margin:0 0 10px; }
.atr-pd-perex p:last-child{ margin-bottom:0; }

/* --- Mapa + vyhledání podle PSČ ----------------------------------------- */
/* Předloha: bílá sekce, 2 sloupce 576+576 s gap 48 v kontejneru 1280. */

.atr-pd-mapa-sekce{
  background:#fff;
  padding:64px 0;
}

.atr-pd-mapa-sekce .blok_sirky_webu{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  /* start, ne center: náhled poradce vpravo mění výšku a při centrování by se
     mapa posouvala pod kurzorem — najetím na značku by se rovnou vybrala jiná */
  align-items:start;
  width:100%;
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
  padding-left:40px;
  padding-right:40px;
  box-sizing:border-box;
}

.atr-pd-mapa-sekce .blok_sirky_webu > .spacer{ display:none; }

/* mapa je sdílený blok s HP — tam ji tvaruje .blok_poradci_home_mapa */
.atr-pd-mapa .atr-mapa-cr{
  position:relative;
  width:100%;
}

.atr-pd-mapa .atr-mapa-cr-bg{
  display:block;
  width:100%;
  height:auto;
  max-height:none;   /* přebít legacy img{max-height:290} */
}

.atr-pd-mapa .atr-mapa-legenda{
  justify-content:flex-start;
  max-width:none;
  margin:14px auto 0 0;
}

.atr-pd-psc-nadpis{
  margin:0;
  font-size:30px;
  line-height:36px;
  font-weight:800;
  letter-spacing:-.75px;
  color:var(--atr-ink);
}

.atr-pd-psc-text{
  margin:12px 0 0;
  font-size:16px;
  line-height:24px;
  color:var(--atr-muted);
}

.atr-pd-psc-form{
  display:flex;
  gap:12px;
  margin-top:24px;
}

.atr-pd-psc-pole{
  position:relative;
  flex:1 1 auto;
  min-width:0;
}

.atr-pd-psc-pole svg{
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(11,26,43,.45);
  pointer-events:none;
}

.atr-pd-psc-pole input{
  width:100%;
  height:48px;
  padding:0 16px 0 46px;
  box-sizing:border-box;
  font-size:16px;
  font-weight:600;
  color:var(--atr-ink);
  background:#fff;
  border:2px solid rgba(17,90,158,.3);
  border-radius:8px;
  outline:none;
  transition:border-color .2s var(--atr-ease);
}

.atr-pd-psc-pole input:focus{
  border-color:var(--atr-blue-l);
}

.atr-pd-psc-tl{
  flex:0 0 auto;
  height:48px;
  padding:0 32px;
  font-size:14px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
  color:#fff;
  background:var(--atr-blue-l);
  border:0;
  border-radius:8px;
  cursor:pointer;
  transition:background-color .2s var(--atr-ease);
}

.atr-pd-psc-tl:hover{ background:var(--atr-blue); }

/* --- Výsledek hledání podle PSČ ------------------------------------------
   Karta nalezeného poradce hned pod formulářem (zadání: „výrazná výsledková
   karta"), plus zvýraznění téhož poradce dole v seznamu. */

.atr-pd-psc-vysledek{ margin-top:24px }

/* Náhled při najetí na mapu jde mimo tok — jinak by delší karta natáhla sekci
   a všechno pod ní by při přejíždění mezi kraji poskakovalo. Výsledek hledání
   podle PSČ tuhle třídu nemá a v toku zůstává (má stránku posunout). */
.atr-pd-psc{ position:relative }
.atr-pd-psc-vysledek.is-nahled{
  position:absolute;
  left:0;
  right:0;
  z-index:5;
}

.atr-pd-psc-vysledek-nadpis{
  margin:0 0 12px;
  font-size:13px;
  font-weight:800;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--atr-blue-l);
}

.atr-pd-psc-vysledek .atr-pd-karta{
  border:2px solid var(--atr-blue-l);
  box-shadow:0 14px 34px rgba(0,108,176,.16);
}

.atr-pd-psc-vysledek .atr-pd-detail{ display:block }

/* poznámka pod náhledem kraje, kde působí víc poradců */
.atr-pd-mapa-dalsi{
  margin:10px 0 0;
  font-size:13px;
  color:rgba(11,26,43,.6);
}

.atr-pd-psc-chyba{
  margin:0;
  padding:14px 18px;
  font-size:15px;
  line-height:22px;
  color:#8a4b12;
  background:#fff6ec;
  border:1px solid #f0d3b0;
  border-radius:8px;
}

.atr-pd-psc-chyba a{ color:var(--atr-blue-l); font-weight:700 }

.atr-pd-psc-zpet{
  margin-top:12px;
  padding:0;
  font-size:14px;
  font-weight:700;
  color:var(--atr-blue-l);
  background:none;
  border:0;
  text-decoration:underline;
  cursor:pointer;
}

/* nalezený poradce v seznamu dole */
.atr-pd-karta.is-nalezen{
  border-color:var(--atr-blue-l);
  box-shadow:0 14px 34px rgba(0,108,176,.16);
}

/* --- Seznam poradců ------------------------------------------------------ */

.atr-pd-seznam{
  background:#f4f7fb;
  padding:80px 0;
}

.atr-pd-seznam .blok_sirky_webu{
  width:100%;
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
  padding-left:40px;
  padding-right:40px;
  box-sizing:border-box;
}

.atr-pd-seznam-nadpis{
  margin:0;
  font-size:36px;
  line-height:40px;
  font-weight:800;
  letter-spacing:-.9px;
  color:var(--atr-ink);
}

.atr-pd-seznam-text{
  margin:12px 0 0;
  font-size:16px;
  line-height:24px;
  color:var(--atr-muted);
}

/* Karty se nenatahují na výšku řádku — rozbalená roste sama a sousední zůstane
   zavřená bez prázdného místa. Že jsou zavřené karty přesto stejně vysoké
   (a tlačítko „Zobrazit více" u všech ve stejné výšce) řeší jednotná výška
   hlaviček, kterou dopočítá hp-redesign.js. Kdyby JS neběžel, karty se prostě
   přizpůsobí svému obsahu. */
.atr-pd-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
  align-items:start;
  margin-top:32px;
}

.atr-pd-karta{
  display:flex;
  flex-direction:column;
  background:#fff;
  border:2px solid transparent;
  border-radius:10px;
  box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);
  overflow:hidden;
  transition:border-color .2s var(--atr-ease),box-shadow .2s var(--atr-ease);
}

.atr-pd-karta:hover{
  border-color:rgba(17,112,184,.35);
  box-shadow:0 10px 20px -8px rgba(16,45,80,.18);
}

/* hlavička roste, aby „Zobrazit více" drželo u spodní hrany i v nižší kartě */
.atr-pd-karta-hl{
  flex:1 1 auto;
  display:flex;
  align-items:flex-start;
  gap:16px;
  padding:24px;
  box-sizing:border-box;   /* bez toho by se k dopočítané min-height přičetl padding (48 px navíc) */
}

.atr-pd-foto{
  flex:0 0 80px;
  display:grid;
  place-items:center;
  width:80px;
  height:80px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(17,112,184,.1);
  color:var(--atr-blue-l);
}

.atr-pd-foto img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;   /* portréty — ať se neuřízne obličej */
}

.atr-pd-foto svg{ width:40px;height:40px; }

.atr-pd-info{
  min-width:0;
  flex:1 1 auto;
}

.atr-pd-jmeno{
  margin:0;
  font-size:20px;
  line-height:28px;
  font-weight:800;
  color:var(--atr-ink);
}

.atr-pd-jmeno a:link,
.atr-pd-jmeno a:visited{
  color:var(--atr-ink);
  text-decoration:none;
  transition:color .2s var(--atr-ease);
}

.atr-pd-jmeno a:hover{ color:var(--atr-blue-l); }

/* region = seznam okresů → v přehledu jen 2 řádky, celý je v detailu */
.atr-pd-region{
  display:flex;
  align-items:flex-start;
  gap:6px;
  margin:4px 0 0;
  font-size:14px;
  line-height:20px;
  font-weight:600;
  color:rgba(11,26,43,.7);
}

.atr-pd-region svg{
  flex:0 0 16px;
  margin-top:2px;
  color:#006cb0;
}

.atr-pd-region span{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.atr-pd-kontakty{
  display:flex;
  flex-wrap:wrap;
  gap:6px 20px;
  margin-top:12px;
  font-size:14px;
  line-height:20px;
  font-weight:600;
}

.atr-pd-kontakty a:link,
.atr-pd-kontakty a:visited{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--atr-ink);
  text-decoration:none;
  transition:color .2s var(--atr-ease);
}

.atr-pd-kontakty a:hover{ color:var(--atr-blue-l); }
.atr-pd-kontakty svg{ flex:0 0 16px;color:#006cb0; }

/* Tlačítko „Domluvit schůzku" v hlavičce karty — korektura 31. 8. 2026.
   Stojí pod lokací (na místě, kde se dřív ukazoval e-mail poradce) a míří
   u všech poradců na jednu společnou adresu. */
.atr-pd-hl-tl{
  margin-top:14px;
}

.atr-pd-hl-tl .atr-pd-cta{
  height:40px;
  padding:0 20px;
  font-size:13px;
}

/* --- Rozbalovací detail --------------------------------------------------- */

.atr-pd-vic{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  margin-top:auto;   /* vždy na spodní hraně karty, ať je u všech ve stejné výšce */
  padding:12px 24px;
  font-size:14px;
  font-weight:700;
  color:var(--atr-blue-l);
  background:transparent;
  border:0;
  border-top:1px solid rgba(11,26,43,.1);
  cursor:pointer;
  transition:background-color .2s var(--atr-ease);
}

.atr-pd-vic:hover{ background:rgba(17,112,184,.05); }

.atr-pd-vic svg{ transition:transform .25s var(--atr-ease); }
.atr-pd-vic[aria-expanded="true"] svg{ transform:rotate(180deg); }

.atr-pd-detail{
  padding:20px 24px 24px;
  border-top:1px solid rgba(11,26,43,.1);
}

.atr-pd-detail[hidden]{ display:none; }

.atr-pd-detail-nadpis{
  margin:0;
  font-size:12px;
  font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:rgba(11,26,43,.6);
}

.atr-pd-okresy{
  margin:8px 0 0;
  font-size:14px;
  line-height:23px;
  color:rgba(11,26,43,.8);
}

.atr-pd-detail-nadpis + .atr-pd-okresy + .atr-pd-detail-nadpis{ margin-top:16px; }

/* odstup dalšího nadpisu, když nad ním končí dlaždičky */
.atr-pd-realizace + .atr-pd-detail-nadpis{ margin-top:20px; }

.atr-pd-detail-tl{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 24px;
  margin-top:20px;
}

.atr-pd-cta{
  height:44px;
  padding:0 24px;
  gap:8px;
  text-transform:uppercase;   /* dle předlohy; base .atr-btn má text-transform:none */
}

/* Krátký popis působení ve firmě — první věc v rozbaleném detailu (dle předlohy). */

.atr-pd-popis,
.atr-pd-popis p{
  margin:0;
  font-size:14px;
  line-height:23px;
  color:rgba(11,26,43,.8);
}

.atr-pd-popis p + p{ margin-top:10px; }

.atr-pd-popis + .atr-pd-detail-nadpis{ margin-top:20px; }

/* Vybrané realizace — dlaždičky s odkazem do katalogu (rozměry měřené v předloze:
   radius 8, padding 8/12, 14/20, dva sloupce s mezerou 8, bledě modré pozadí). */

/* dvě třídy kvůli specificitě — globální „.obsah ul" tlačí margin-left:20px
   a dlaždičky by se rozešly s nadpisem i tlačítkem nad/pod nimi */
.atr-pd-detail .atr-pd-realizace{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:12px 0 0;
  padding:0;
  list-style:none;
}

/* globální „.obsah ul li:before“ vkládá bitmapovou odrážku (ic-odrazka.png) —
   tady ji přebíjíme, dlaždička je sama o sobě čitelná */
.atr-pd-detail .atr-pd-realizace li:before{ content:""; display:none; }

.atr-pd-realizace a:link,
.atr-pd-realizace a:visited{
  display:block;
  padding:8px 12px;
  font-size:14px;
  line-height:20px;
  color:rgba(11,26,43,.85);
  text-decoration:none;
  background:rgba(26,115,196,.05);
  border-radius:8px;
  transition:background-color .2s var(--atr-ease), color .2s var(--atr-ease);
}

.atr-pd-realizace a:hover{
  color:var(--atr-blue-l);
  background:rgba(26,115,196,.1);
}

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

.atr-pd-karta[data-atr-reveal]{
  opacity:0;
  transform:translateY(20px);
  transition:opacity .5s var(--atr-ease),transform .5s var(--atr-ease),border-color .2s var(--atr-ease),box-shadow .2s var(--atr-ease);
}

.atr-pd-karta.is-revealed{
  opacity:1;
  transform:none;
}

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

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

@media (max-width:1100px){
  .atr-pd-h1{font-size:40px;line-height:44px}
  .atr-pd-psc-nadpis{font-size:26px;line-height:32px}
  .atr-pd-seznam-nadpis{font-size:30px;line-height:36px}
}

@media (max-width:900px){
  .atr-pd-hlavicka{padding:40px 0}
  .atr-pd-hlavicka .blok_sirky_webu{padding-left:24px;padding-right:24px}
  .atr-pd-mapa-sekce{padding:40px 0}
  .atr-pd-mapa-sekce .blok_sirky_webu{grid-template-columns:1fr;gap:32px;padding-left:24px;padding-right:24px}
  .atr-pd-mapa .atr-mapa-cr{max-width:560px;margin:0 auto}
  .atr-pd-mapa .atr-mapa-legenda{justify-content:center;margin-left:auto;margin-right:auto}
  .atr-pd-seznam{padding:48px 0}
  .atr-pd-seznam .blok_sirky_webu{padding-left:24px;padding-right:24px}
  .atr-pd-grid{grid-template-columns:1fr;gap:16px}
  /* jeden sloupec: náhled patří zpátky do toku (a na dotyku stejně nevzniká) */
  .atr-pd-psc-vysledek.is-nahled{position:static}
}

@media (max-width:600px){
  .atr-pd-hlavicka{padding:28px 0 32px}
  .atr-pd-h1{font-size:32px;line-height:38px}
  .atr-pd-perex,.atr-pd-perex p{font-size:16px;line-height:26px}
  .atr-pd-seznam-nadpis{font-size:26px;line-height:32px}
  .atr-pd-psc-form{flex-wrap:wrap}
  .atr-pd-psc-pole{flex:1 1 100%}
  .atr-pd-psc-tl{flex:1 1 100%}
  .atr-pd-karta-hl{gap:14px;padding:18px}
  .atr-pd-foto{flex:0 0 64px;width:64px;height:64px}
  .atr-pd-foto svg{width:32px;height:32px}
  .atr-pd-jmeno{font-size:18px;line-height:24px}
  .atr-pd-vic{padding:12px 18px}
  .atr-pd-detail{padding:18px}
  .atr-pd-realizace{grid-template-columns:1fr}   /* na mobilu dlaždičky pod sebe */
  .atr-pd-detail-tl{gap:12px}
  .atr-pd-cta{width:100%;justify-content:center}
  /* na úzkém displeji se popisek tlačítka zalomí — ať má výšku podle textu
     a neleze přes okraj (korektura 31. 8. 2026) */
  .atr-pd-hl-tl .atr-pd-cta{height:auto;min-height:40px;padding:9px 14px;line-height:1.25;text-align:center}
}