/* Detail projektu v portfoliu — navazuje na sluzba.css (lišta, patička, formulář, zástupné plochy, rozestupy).
   Vychází z návrhu detailu z 2026-08-24, bez půdorysu (Jakubova poznámka 2026-09-11).
   ⚠️ Bez tabulkového vzhledu a šipek, těsnější rozestupy (Ondřej 2026-09-11). 🔴 Nic pod 13 px. */

/* ── úvodní fotka v šířce bloku ────────────────────── */
.pr-hero { width: min(100% - 2.5rem, 1320px); margin: clamp(1.25rem, 3vw, 2rem) auto 0; }
.pr-hero img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; }
@media (max-width: 700px) { .pr-hero img { aspect-ratio: 3 / 2; } }

/* ── úvod: název a údaje vlevo, text vpravo ────────── */
main .pr-uvod { padding-block: clamp(1.5rem, 4vw, 2.75rem) clamp(.5rem, 2vw, 1rem); }
.pr-info { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); margin-top: 1.3rem; }
@media (min-width: 900px) { .pr-info { grid-template-columns: 1fr 1fr; gap: 4rem; align-items: start; } }
.pr-info > * { min-width: 0; }
.pr-info h1 { font-family: var(--f-display); font-weight: 200; font-size: var(--a-4); line-height: 1.05; color: var(--navy-deep); text-wrap: balance; }
.pr-udaje { display: flex; flex-wrap: wrap; gap: 1rem 2.6rem; margin: 1.6rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--navy-deep); }
.pr-udaje dt { font-size: var(--a--1); text-transform: uppercase; letter-spacing: .1em; color: var(--faint); }
.pr-udaje dd { margin: .3rem 0 0; font-family: var(--f-display); font-weight: 300; font-size: var(--a-1); color: var(--navy-deep); }
.pr-text p { color: var(--on-light-soft); }
.pr-text p + p { margin-top: 1.1rem; }

/* ── galerie: řady fotek ───────────────────────────────
   Fotky jsou skoro všechny na šířku, mozaika s výškami a čtverci by je ořezala.
   V řadě dostane každá fotka šířku podle svého poměru stran, takže mají stejnou
   výšku a nic se neořízne. Poměr nese inline --w a --h. Na mobilu pod sebou. */
.pr-fotky, .pr-rada { display: grid; gap: 1rem; }
.pr-rada figure { margin: 0; min-width: 0; aspect-ratio: var(--w) / var(--h); }
.pr-rada img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 700px) {
  .pr-fotky, .pr-rada { gap: 1.1rem; }
  .pr-rada { display: flex; }
  .pr-rada figure { flex: calc(var(--w) / var(--h)) 1 0; }
}

/* ── zvýrazněný mezititulek a text ─────────────────── */
.pr-zvyrazneni { text-align: center; }
/* nadpisové písmo jako ostatní nadpisy na webu (Ondřej 2026-09-11), ne verzálky ze šablony */
.pr-zvyrazneni h2 { margin: 0 auto; max-width: 28ch; font-family: var(--f-display); font-weight: 200; font-size: var(--a-3);
                    line-height: 1.1; color: var(--navy-deep); text-wrap: balance; }
.pr-zvyrazneni p { margin: 1.3rem auto 0; max-width: 66ch; color: var(--on-light-soft); }
.pr-zvyrazneni h2 + p { margin-top: 1.4rem; }
.pr-zvyrazneni p + p { margin-top: 1rem; }
.pr-zvyrazneni--bez-nadpisu p:first-child { margin-top: 0; }

/* ── designér pod galerií ──────────────────────────── */
.pr-designer { display: flex; align-items: center; gap: 1.4rem; padding-top: 1.3rem; border-top: 1px solid var(--on-light-line); }
.pr-designer img { flex: none; width: 6.5rem; aspect-ratio: 4 / 5; height: auto; object-fit: cover; display: block; }
.pr-designer .caps { display: block; color: var(--faint); }
.pr-designer strong { display: block; margin-top: .25rem; font-family: var(--f-display); font-weight: 300; font-size: var(--a-2); line-height: 1.2; color: var(--navy-deep); }

/* ── další projekty ────────────────────────────────── */
.pr-dalsi h2 { font-family: var(--f-display); font-weight: 200; font-size: var(--a-2); color: var(--navy-deep); }
.pr-dalsi ul { list-style: none; padding: 0; margin: 1.4rem 0 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem 1.1rem; }
@media (min-width: 900px) { .pr-dalsi ul { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .pr-dalsi ul { grid-template-columns: repeat(5, 1fr); } }
.pr-dalsi li { min-width: 0; }
.pr-dalsi a { display: block; text-decoration: none; color: inherit; }
/* titulní fotky z portfolia na homepage, stejné přiblížení při najetí */
.pr-dalsi figure { margin: 0; overflow: hidden; aspect-ratio: 4 / 5; }
.pr-dalsi img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s cubic-bezier(0.15, 0.75, 0.5, 1); }
.pr-dalsi a:hover img, .pr-dalsi a:focus-visible img { transform: scale(1.13); }
@media (prefers-reduced-motion: reduce) { .pr-dalsi img { transition: none; } .pr-dalsi a:hover img, .pr-dalsi a:focus-visible img { transform: none; } }
.pr-dalsi h3 { font-family: var(--f-body); font-weight: 500; font-size: var(--a-0); line-height: 1.3; color: var(--navy); margin-top: .8rem; }
.pr-dalsi .misto { display: block; font-size: var(--a--1); color: var(--faint); margin-top: .2rem; }