/*
 * stranky/obory.css - rozcestnik oboru mc/obory.php (D-005).
 * Jen tokeny z pmc-tokens.css; lokalni hodnoty --ob-*. Plna sirka, 5 / 4 / 2 / 1 sloupcu.
 */
.pmc-web {
  --ob-plocha: #f4f4f4;            /* ODHAD - svetla plocha karty (shodna s vzory.css) */
  --ob-stav: #8a5a00;              /* ODHAD - "pripravujeme", shodne s vzory.css */
}

.ob-hero { padding-bottom: clamp(32px, 3.3vw, 80px); }
.ob-hero__hlavicka { margin-bottom: 0; align-items: end; }
.ob-hero__hlavicka .pmc-h1 { max-width: 11em; }
.ob-hero__text { color: var(--pmc-text-tlumeny); max-width: 36em; margin-bottom: clamp(20px, 1.6vw, 40px); }
.ob-hero__akce { margin: 0; }

.ob-seznam { padding-top: 0; }
.ob-mrizka {
  list-style: none; margin: 0; padding: 0; display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--pmc-mezera-mrizky);
}
.ob-karta {
  position: relative; display: flex; flex-direction: column; gap: clamp(8px, .7vw, 16px);
  min-height: clamp(320px, 22vw, 560px); padding: clamp(18px, 1.35vw, 34px);
  background: var(--ob-plocha); border-radius: var(--pmc-radius-karta);
  transition: background-color .2s linear, color .2s linear;
}
.ob-karta:hover, .ob-karta:focus-within { background: var(--pmc-cerna); color: var(--pmc-bila); }
.ob-karta__cislo { color: var(--pmc-text-tlumeny); font-variant-numeric: tabular-nums; }
.ob-karta:hover .ob-karta__cislo, .ob-karta:focus-within .ob-karta__cislo,
.ob-karta:hover .ob-karta__veta, .ob-karta:focus-within .ob-karta__veta { color: var(--pmc-text-tlumeny-inverz); }
.ob-karta__nazev { font-size: var(--pmc-fs-h3); }
.ob-karta__odkaz { text-decoration: none; }
/* Cela karta je klikaci (odkaz na katalog oboru), podobory maji vlastni odkazy nad nim */
.ob-karta__odkaz::after { content: ""; position: absolute; inset: 0; z-index: 0; }
.ob-karta__veta { color: var(--pmc-text-tlumeny); font-size: var(--pmc-fs-text); line-height: var(--pmc-lh-text); }
.ob-podobory { position: relative; z-index: 1; list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.ob-podobory a {
  display: inline-flex; align-items: center; min-height: 28px; padding: 4px 10px;
  border: 1px solid currentColor; border-radius: var(--pmc-radius-pill);
  font-size: 13px; line-height: 1.2; text-decoration: none; opacity: .8;
}
.ob-podobory a:hover, .ob-podobory a:focus-visible { opacity: 1; background: var(--pmc-bila); color: var(--pmc-cerna); border-color: var(--pmc-bila); }
@media (min-width: 1600px) { .ob-podobory a { font-size: 15px; min-height: 32px; } }
.ob-karta__pata { margin: auto 0 0; padding-top: 12px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.ob-karta__stav { color: var(--pmc-text-tlumeny); }
.ob-karta__stav--pripravujeme { color: var(--ob-stav); }
.ob-karta:hover .ob-karta__stav, .ob-karta:focus-within .ob-karta__stav { color: var(--pmc-text-tlumeny-inverz); }
.ob-karta__sipka { font-size: var(--pmc-fs-h3); line-height: 1; transition: transform .2s ease; }
.ob-karta:hover .ob-karta__sipka { transform: translateX(4px); }

.ob-vyzva__obsah { margin-bottom: 0; }
.ob-vyzva__text { color: var(--pmc-text-tlumeny-inverz); margin-bottom: clamp(20px, 1.6vw, 40px); max-width: 36em; }
.ob-vyzva__akce { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }

@media (max-width: 1400px) { .ob-mrizka { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .ob-mrizka { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px)  { .ob-mrizka { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  {
  .ob-mrizka { grid-template-columns: minmax(0, 1fr); }
  .ob-karta { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ob-karta, .ob-karta__sipka { transition: none; }
  .ob-karta:hover .ob-karta__sipka { transform: none; }
}

/* ==========================================================================
 * Stranka oboru a podoboru obory.php?obor=&podobor= (D-019, nalez N14).
 * Podle reference solutions-*: centrovany uvod s CTA, velky obraz, zamereni, vzory, vyzva.
 * Karty vzoru jsou vz-* z vzory.css (stejne znaceni "Pripravujeme" jako katalog).
 * ========================================================================== */
.ob-akce { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }

.od-uvod { padding-top: clamp(24px, 2.5vw, 64px); padding-bottom: clamp(32px, 3.3vw, 80px); }
.od-drobky { color: var(--pmc-text-tlumeny); margin-bottom: clamp(24px, 3vw, 72px); }
.od-drobky ol { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.od-drobky li { min-width: 0; overflow-wrap: anywhere; }
.od-drobky li + li::before { content: "/"; margin: 0 8px; color: var(--pmc-text-tlumeny); }
.od-drobky a { text-decoration: none; }
.od-drobky a:hover, .od-drobky a:focus-visible { text-decoration: underline; }
.od-drobky li[aria-current] { color: var(--pmc-cerna); }

.od-uvod__obsah { text-align: center; display: flex; flex-direction: column; align-items: center; gap: clamp(14px, 1.25vw, 32px); }
.od-uvod__nadtitulek { font-weight: var(--pmc-pismo-vaha-tucne); }
.od-uvod__nadpis { max-width: 18em; overflow-wrap: anywhere; }
.od-uvod__text { color: var(--pmc-text-tlumeny); max-width: 40em; }
.od-uvod__akce { justify-content: center; }

.od-obraz { margin: clamp(32px, 3.3vw, 88px) 0 0; overflow: hidden; border-radius: var(--pmc-radius-karta); background: var(--pmc-cerna); }
.od-obraz__foto { display: block; width: 100%; height: clamp(240px, 36vw, 860px); object-fit: cover; }

.od-podobory { padding-top: clamp(40px, 4vw, 112px); }
.od-podobory__text { color: var(--pmc-text-tlumeny); max-width: 36em; }
.od-pod-mrizka {
  list-style: none; margin: 0; padding: 0; display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--pmc-mezera-mrizky);
}
.od-pod__odkaz {
  display: flex; flex-direction: column; gap: clamp(8px, .7vw, 16px); height: 100%;
  min-height: clamp(160px, 11vw, 300px); padding: clamp(18px, 1.35vw, 34px);
  background: var(--ob-plocha); border-radius: var(--pmc-radius-karta); text-decoration: none;
  transition: background-color .2s linear, color .2s linear;
}
.od-pod__cislo { color: var(--pmc-text-tlumeny); font-variant-numeric: tabular-nums; }
.od-pod__nazev { overflow-wrap: anywhere; hyphens: auto; }
.od-pod__sipka { margin-top: auto; align-self: flex-end; font-size: var(--pmc-fs-h3); line-height: 1; transition: transform .2s ease; }
.od-pod__odkaz:hover, .od-pod__odkaz:focus-visible, .od-pod--aktivni .od-pod__odkaz { background: var(--pmc-cerna); color: var(--pmc-bila); }
.od-pod__odkaz:hover .od-pod__cislo, .od-pod__odkaz:focus-visible .od-pod__cislo,
.od-pod--aktivni .od-pod__cislo { color: var(--pmc-text-tlumeny-inverz); }
.od-pod__odkaz:hover .od-pod__sipka { transform: translateX(4px); }
.od-podobory__zpet { margin-top: clamp(20px, 1.6vw, 40px); }

.od-vzory { padding-top: 0; }
.od-vzory__hlavicka {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px 24px;
  margin-bottom: var(--pmc-nadpis-obsah);
}
.od-vzory__hlavicka .pmc-h2 { overflow-wrap: anywhere; min-width: 0; }
.od-vzory__mrizka { grid-template-columns: repeat(auto-fill, minmax(clamp(260px, 19vw, 560px), 1fr)); }
.od-vzory__dalsi { margin: clamp(40px, 3.3vw, 88px) 0 clamp(16px, 1.4vw, 32px); }
.od-prazdno { padding: clamp(24px, 2vw, 48px) 0; border-top: 1px solid var(--pmc-linka); }
.od-prazdno .pmc-text { color: var(--pmc-text-tlumeny); max-width: 40em; margin-bottom: 20px; }

.ob-404 { min-height: 60vh; display: flex; flex-direction: column; justify-content: center; gap: clamp(14px, 1.25vw, 32px); }
.ob-404__kod { color: var(--pmc-text-tlumeny); }
.ob-404__text { color: var(--pmc-text-tlumeny); max-width: 36em; }

@media (max-width: 1400px) { .od-pod-mrizka { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .od-pod-mrizka { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .od-pod__odkaz { min-height: 112px; }
  .od-vzory__mrizka { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .od-pod__odkaz, .od-pod__sipka { transition: none; }
  .od-pod__odkaz:hover .od-pod__sipka { transform: none; }
}