/* ==========================================================================
 *  STYLE.CSS – jednotný stylopis webu
 *  Bootstrap 5.3.8 · Bootstrap Icons 1.13.1 · písmo Poppins
 *  --------------------------------------------------------------------------
 *  Sloučeno ze souborů: site.css → katalog.css → full-site.css
 *  (v tomto pořadí se mají načítat i původní soubory)
 *
 *  Jednotky: všechny px hodnoty jsou převedeny na rem (1rem = 16px).
 *  Ponechány v px: 1px hairline linky (border-bottom, border-top).
 *
 *  Breakpointy (v rem, 1rem = 16px):
 *    Desktop  ≥ 1200px  →  min-width: 75rem
 *    Tablet   768–1199px →  min-width: 48rem  and  max-width: 74.9375rem
 *    ≤ 1199px            →  max-width: 74.9375rem  (tablet + mobil)
 *    Mobil    ≤ 767px    →  max-width: 47.9375rem
 *    Malý     ≤ 359px    →  max-width: 22.4375rem
 *
 *  Pro SCSS: bloky @media níže lze nahradit mixiny
 *    @include desktop { … }  @include tablet { … }  @include mobile { … }
 *
 *  OBSAH
 *  01  Proměnné (:root)
 *  02  Základ a typografie
 *  03  Rozvržení (content-width)
 *  04  Hlavička a navigace
 *  05  Hero (titulní fotografie)
 *  06  Dlaždice služeb (service-grid)
 *  07  Úvodní text (intro)
 *  08  Tlačítka (dark-button)
 *  09  Rychlé odkazy (quick-row)
 *  10  Výpis nabídek (listing)
 *  11  Patička
 *  12  Přístupnost a pohyb
 *  13  Katalog – obalové prvky (catalog-*)
 *  14  Podstránka: titulní foto, úvod, seznam, panely
 *  15  Detail pronájmu
 *  16  Stránka O nás
 *  17  Stránka Naše služby
 *  18  Kontakty a mapa
 *  19  Pravidla dražby
 *  20  Rozcestník cyklostezek
 *  21  Seznam dokumentů
 *  22  Karta pracovního místa
 *  23  Detail pracovní pozice
 *  24  Odkazy na objekty
 *  25  Katalog – výjimky pro hlavní stránku
 *  26  Šablona stránky (.page-main)
 *  ========================================================================== */


/* ==========================================================================
 *  01  PROMĚNNÉ
 *  ========================================================================== */

:root {
    /* Barvy */
    --brand-dark: #212121;
    --brand-tile: #49484e;
    --brand-blue: #000dff;
    --brand-light: #f2f2f2;

    /* Rozměry */
    --content-width: 61.5625rem;   /* 985px */
    --control-height: 3.25rem;     /* 52px */
    --card-padding: 1.125rem;      /* 18px */

    /* Velikosti písma – desktop */
    --font-body: 1rem;             /* 16px */
    --font-section: 1.75rem;       /* 28px */
    --font-card: 1.25rem;          /* 20px */
    --font-service: 1.5rem;        /* 24px */
    --font-quick: 1.125rem;        /* 18px */
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    :root {
        --font-body: 0.875rem;       /* 14px */
        --font-section: 1.53125rem;  /* 24.5px */
        --font-card: 1.09375rem;     /* 17.5px */
        --font-service: 1.3125rem;   /* 21px */
        --font-quick: 0.984375rem;   /* 15.75px */
        --control-height: 2.875rem;  /* 46px */
        --card-padding: 1rem;        /* 16px */
        --content-width: 53.875rem;  /* 862px */
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    :root {
        --font-body: 0.75rem;        /* 12px */
        --font-section: 1.3125rem;   /* 21px */
        --font-card: 0.9375rem;      /* 15px */
        --font-service: 1.125rem;    /* 18px */
        --font-quick: 0.84375rem;    /* 13.5px */
        --control-height: 2.75rem;   /* 44px */
        --card-padding: 0.84375rem;  /* 13.5px */
    }
}


/* ==========================================================================
 *  02  ZÁKLAD A TYPOGRAFIE
 *  ========================================================================== */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 7rem;
}

body {
    font-family: Poppins, Arial, sans-serif;
    font-size: var(--font-body);
    color: #111;
    background: #fff;
}

button,
a {
    touch-action: manipulation;
}

a:focus-visible,
button:focus-visible {
    outline: 0.1875rem solid var(--brand-blue);
    outline-offset: 0.25rem;
    box-shadow: none;
}

/* Odkaz „přeskočit na obsah“ */
.skip-link {
    position: absolute;
    left: 0.75rem;
    top: -6.25rem;
    z-index: 10000;
    background: #fff;
    color: #111;
    padding: 0.75rem 1rem;
}

.skip-link:focus {
    top: 0.75rem;
}

@media (max-width: 47.9375rem) {
    html {
        scroll-padding-top: 5rem;
    }
}


/* ==========================================================================
 *  03  ROZVRŽENÍ
 *  ========================================================================== */

.content-width {
    max-width: var(--content-width);
    margin-inline: auto;
}

@media (max-width: 74.9375rem) {
    .content-width {
        margin-inline: 1.5rem;
    }
}

@media (max-width: 47.9375rem) {
    .content-width {
        margin-inline: 1.25rem;
    }
}


/* ==========================================================================
 *  04  HLAVIČKA A NAVIGACE
 *  ========================================================================== */

.site-header {
    position: absolute;
    inset: 0 0 auto;
    z-index: 10;
    min-height: 5.75rem;
    background: rgb(33 33 33 / 75%);
}

.site-header .navbar {
    min-height: 5.75rem;
    max-width: 77.25rem;
    margin: auto;
    padding: 0;
}

.site-header .navbar-brand {
    padding: 0;
    margin: 0;
}

.site-logo {
    display: block;
    width: 15.875rem;
    height: auto;
}

.site-header .nav-link {
    font-size: var(--font-body);
    font-weight: 400;
    color: #fff;
    padding: 0.8125rem 1rem !important;
    white-space: nowrap;
}

.site-header .nav-link:hover,
.site-header .nav-link:focus-visible {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 0.3125rem;
}

/* Tlačítko mobilního menu (zobrazuje se jen na mobilu) */
.site-header .navbar-toggler {
    display: none;
    width: 3rem;
    height: 3rem;
    border: 0;
    color: #fff;
    justify-content: center;
    align-items: center;
    padding: 0;
    box-shadow: none;
}

.site-header .navbar-toggler:focus {
    box-shadow: none;
}

.site-header .navbar-toggler i {
    font-size: 1.8125rem;
    line-height: 1;
}

.site-header .navbar-toggler[aria-expanded="true"] .bi-list,
.site-header .navbar-toggler[aria-expanded="false"] .bi-x-lg {
    display: none;
}

/* Desktop */
@media (min-width: 75rem) {
    .site-header .navbar-collapse {
        padding-right: 1.125rem;
    }

    .site-header .navbar-nav {
        gap: 0.3125rem;
    }
}

/* ≤ 1199px */
@media (max-width: 74.9375rem) {
    .site-header .navbar {
        margin-inline: 1.5rem;
    }
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .site-header,
    .site-header .navbar {
        min-height: 5.0625rem;
    }

    .site-logo {
        width: 13.9375rem;
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    .site-header,
    .site-header .navbar {
        min-height: 5rem;
    }

    .site-header .navbar {
        padding-inline: 1.25rem;
        margin: 0;
    }

    .site-logo {
        width: 13.75rem;
    }

    .site-header .navbar-toggler {
        display: flex;
    }

    .site-header .navbar-collapse {
        position: absolute;
        top: 5rem;
        left: 0;
        right: 0;
        background: rgb(33 33 33 / 96%);
        padding: 0.5rem 1.5rem 1.25rem;
    }

    .site-header .navbar-nav {
        gap: 0;
    }

    .site-header .nav-link {
        min-height: 3.75rem;
        display: flex;
        align-items: center;
        padding: 0.875rem 0 !important;
    }

    .site-header .nav-item + .nav-item {
        border-top: 1px solid rgb(255 255 255 / 20%);
    }
}

/* Malý mobil */
@media (max-width: 22.4375rem) {
    .site-logo {
        width: 12.5rem;
    }
}


/* ==========================================================================
 *  05  HERO
 *  ========================================================================== */

.hero {
    position: relative;
    height: 39.375rem;
    background: center 48% / cover no-repeat url("../assets/hero.jpg");
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .hero {
        height: 34.5rem;
    }
}

@media (max-width: 47.9375rem) {
    .hero {
        height: 18.75rem;
        background-position: 57% center;
    }
}


/* ==========================================================================
 *  06  DLAŽDICE SLUŽEB
 *  ========================================================================== */

.service-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 80.875rem;
    margin: 2.125rem auto 0;
}

/* Jeden odkaz = dvě dlaždice (fotka + popisek) */
.service-link {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    aspect-ratio: 486 / 183;
    min-width: 0;
    background: var(--brand-tile);
    color: #fff;
    text-decoration: none;
}

.service-link:hover,
.service-link:focus-visible {
    color: #fff;
}

.service-photo {
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    object-fit: cover;
}

.service-label {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 0.75rem;
    text-align: center;
    font-size: var(--font-service);
    font-weight: 700;
    line-height: 1.2;
}

/* Starší varianta dlaždic (.tile-cell) – ponecháno kvůli kompatibilitě */
.tile-cell {
    position: relative;
    display: block;
    aspect-ratio: 243 / 183;
    min-width: 0;
    overflow: hidden;
    background: var(--brand-tile);
    color: #fff;
    text-decoration: none;
}

.tile-cell:hover,
.tile-cell:focus-visible {
    color: #fff;
}

.tile-cell .tile-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tile-cell .tile-label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
}

.tile-cell.tile-image .tile-label,
.tile-cell.tile-text .tile-photo {
    display: none;
}

/* Desktop */
@media (min-width: 75rem) {
    .service-grid {
        max-width: 71.875rem;
        margin-top: 1.875rem;
    }
}

/* ≤ 1199px */
@media (max-width: 74.9375rem) {
    .tile-cell .tile-label {
        font-size: 1.5rem;
    }
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .service-grid {
        margin: 1.625rem 1.5rem 0;
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    .service-grid {
        grid-template-columns: 1fr;
        margin: 1.25rem 1.25rem 0;
    }

    .service-manage .service-photo {
        order: 2;
    }

    .service-cycle .service-photo {
        order: 0;
    }

    .service-cycle .service-label {
        order: 2;
    }

    .tile-cell .tile-label {
        font-size: 1.25rem;
    }

    .tile-manage-label { order: 3; }
    .tile-manage-photo { order: 4; }
    .tile-cycle-photo  { order: 5; }
    .tile-cycle-label  { order: 6; }
    .tile-rent-label   { order: 7; }
    .tile-rent-photo   { order: 8; }
}

/* Malý mobil */
@media (max-width: 22.4375rem) {
    .tile-cell .tile-label {
        font-size: 1.0625rem;
    }

    .service-cycle .service-label {
        font-size: 1.0625rem;
    }
}


/* ==========================================================================
 *  07  ÚVODNÍ TEXT
 *  ========================================================================== */

.intro {
    margin-top: 4.4375rem;
    text-align: center;
}

.intro p {
    font-size: var(--font-body);
    line-height: 1.5;
    margin: 0;
}

.intro .dark-button {
    margin-top: 4rem;
}

@media (min-width: 75rem) {
    .intro .dark-button {
        min-width: 0;
    }
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .intro {
        margin-top: 3.875rem;
    }
}

@media (max-width: 47.9375rem) {
    .intro {
        margin-top: 2.25rem;
    }

    .intro .dark-button {
        margin-top: 1.75rem;
    }
}


/* ==========================================================================
 *  08  TLAČÍTKA
 *  ========================================================================== */

.dark-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--control-height);
    padding: 0.625rem 1.25rem;
    border: 0;
    border-radius: 0.1875rem;
    background: var(--brand-dark);
    color: #fff;
    font-size: var(--font-body);
    text-align: center;
    text-decoration: none;
}

.dark-button:hover,
.dark-button:focus-visible {
    background: #111;
    color: #fff;
}

@media (min-width: 75rem) {
    .section-action .dark-button {
        min-width: 0;
    }
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .dark-button {
        width: max-content;
        max-width: 100%;
        min-width: 0;
        padding: 0.5625rem 1.125rem;
    }
}

@media (max-width: 47.9375rem) {
    .dark-button {
        padding: 0.5625rem 1rem;
    }

    .section-action .dark-button {
        width: auto;
        min-width: 0;
        max-width: 100%;
    }
}


/* ==========================================================================
 *  09  RYCHLÉ ODKAZY
 *  ========================================================================== */

.quick-row {
    display: grid;
    grid-template-columns: 1.13fr 1fr 1fr;
    gap: 2.625rem;
    margin: 6.375rem auto 0;
}

.quick-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 6rem;
    padding: 1.125rem 1.5rem;
    border-radius: 0.75rem;
    background: #f3f3f3;
    color: var(--brand-blue);
    font-size: var(--font-quick);
    font-weight: 700;
    text-decoration: none;
}

.quick-link:hover,
.quick-link:focus-visible {
    background: #ececec;
    color: var(--brand-blue);
}

.quick-link i {
    font-size: 1.9375rem;
    line-height: 1;
    color: #212121;
    font-weight: 400;
}

/* Ikony v odkazech */
.quick-icon {
    display: block;
    flex: none;
    height: auto;
}

.quick-icon-icon-hand   { width: 3.25rem; }
.quick-icon-icon-doc    { width: 2rem; }
.quick-icon-icon-search { width: 2.625rem; }

@media (min-width: 75rem) {
    .quick-row {
        max-width: 59.6875rem;
    }
}

@media (max-width: 74.9375rem) {
    .quick-link i {
        font-size: 1.6875rem;
    }
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .quick-row {
        gap: 1.5rem;
        margin-top: 5.5625rem;
    }

    .quick-link {
        min-height: 5.25rem;
        padding: 1rem 1.25rem;
    }
}

@media (max-width: 47.9375rem) {
    .quick-row {
        grid-template-columns: 1fr;
        gap: 1rem;
        margin-top: 2.5rem;
    }

    .quick-link {
        min-height: 4.5rem;
        padding: 0.875rem 1.125rem;
    }

    .quick-icon-icon-hand   { width: 2.625rem; }
    .quick-icon-icon-doc    { width: 1.75rem; }
    .quick-icon-icon-search { width: 2.125rem; }
}


/* ==========================================================================
 *  10  VÝPIS NABÍDEK (listing)
 *  ========================================================================== */

/* --- Sekce --- */
.listing-section {
    margin-top: 8.875rem;
}

.listing-section + .listing-section {
    margin-top: 10.625rem;
}

.listing-section h2 {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 2.125rem;
}

.section-action {
    text-align: center;
    margin-top: 4rem;
}

.listing-section:last-of-type .section-action {
    margin-bottom: 8.375rem;
}

/* --- Karta --- */
.listing-card {
    display: grid;
    grid-template-columns: 29.3125rem minmax(0, 1fr);
    gap: 2.625rem;
    align-items: center;
    min-height: 20rem;
    margin-bottom: 1.5rem;
    padding: var(--card-padding);
    border-radius: 0.1875rem;
    background: var(--brand-light);
}

.listing-image {
    display: block;
    width: 100%;
    aspect-ratio: 396 / 239;
    object-fit: cover;
}

.listing-content h3 {
    font-size: var(--font-card);
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
    margin: 0 0 2.75rem;
}

.listing-content dl {
    margin: 0;
}

.listing-detail {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    font-size: var(--font-body);
    line-height: 1.4;
    margin-top: 0.5rem;
}

.listing-detail dt {
    font-weight: 300;
    white-space: nowrap;
}

.listing-detail dd {
    font-weight: 700;
    margin: 0;
}

.listing-price {
    color: var(--brand-blue);
}

/* Desktop – sekce mírně posunuta doprava (kvůli zarovnání dle návrhu) */
@media (min-width: 75rem) {
    .listing-section {
        position: relative;
        left: 0.625rem;
    }
}

/* Tablet a mobil – karta v jednom sloupci / užší sloupec obrázku */
@media (max-width: 74.9375rem) {
    .listing-card {
        grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.86fr);
        gap: 1.875rem;
    }

    .listing-detail dd {
        margin-top: 0.125rem;
    }
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .listing-section {
        margin-top: 7.75rem;
    }

    .listing-section + .listing-section {
        margin-top: 9.3125rem;
    }

    .listing-section h2 {
        margin-bottom: 5rem;
    }

    .section-action {
        margin-top: 3.5rem;
    }

    .listing-section:last-of-type .section-action {
        margin-bottom: 7.3125rem;
    }

    .listing-card {
        min-height: 17.5rem;
    }

    .listing-detail {
        display: block;
        margin-top: 0.625rem;
    }

    .listing-detail dt {
        display: block;
        white-space: normal;
    }

    .listing-detail dd {
        display: block;
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    .listing-section,
    .listing-section + .listing-section {
        margin-top: 4rem;
    }

    .listing-section h2 {
        margin-bottom: 2rem;
    }

    .section-action {
        margin-top: 1.75rem;
    }

    .listing-section:last-of-type .section-action {
        margin-bottom: 3.5rem;
    }

    .listing-card {
        grid-template-columns: 1fr;
        gap: 1.25rem;
        min-height: 0;
        margin-bottom: 1.5rem;
    }

    .listing-image {
        aspect-ratio: 1.6;
    }

    .listing-content {
        padding: 0 0.25rem 0.625rem;
    }

    .listing-detail {
        display: block;
        margin-top: 0.75rem;
    }

    .listing-detail dt {
        white-space: normal;
    }
}


/* ==========================================================================
 *  11  PATIČKA
 *  ========================================================================== */

.site-footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 35.3125rem;
    padding-top: 7.125rem;
    color: #fff;
}

/* Rozostřená fotografie na pozadí */
.site-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: center / cover no-repeat url("../assets/footer-photo.jpg");
/*     filter: blur(0.25rem); */
}

.footer-panel {
    position: relative;
    z-index: 1;
    min-height: 21.8125rem;
    padding: 3.375rem 1.25rem;
    background: rgb(33 33 33 / 75%);
    backdrop-filter: blur(3px);

}

.footer-links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.125rem 2.25rem;
}

.footer-links a {
    color: #fff;
    font-size: var(--font-body);
    padding: 0.4375rem 0.125rem;
    text-decoration: underline;
    text-underline-offset: 0.1875rem;
}

.footer-body {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 9.3125rem;
    max-width: 55.875rem;
    margin: 3.875rem auto 0;
}

.footer-logo {
    display: block;
    width: 23.75rem;
    max-width: 48%;
    height: auto;
}

.footer-body address {
    font-size: var(--font-body);
    font-style: normal;
    line-height: 1.5;
    margin: 0;
}

.footer-body address a {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 0.1875rem;
}

.site-footer a:focus-visible,
.site-header a:focus-visible,
.site-header button:focus-visible,
.tile-cell:focus-visible {
    outline-color: #fff;
}

/* ≤ 1199px */
@media (max-width: 74.9375rem) {
    .site-footer .footer-body {
        margin-inline: 2.5rem;
    }
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .site-footer {
        min-height: 30.9375rem;
        padding-top: 6.25rem;
    }

    .footer-panel {
        min-height: 19.125rem;
        padding: 2.9375rem 1.25rem;
    }

    .footer-body {
        justify-content: space-between;
        gap: 3.125rem;
        max-width: 62.875rem;
        margin-top: 3.375rem;
    }

    .footer-logo {
        width: 20.8125rem;
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    .site-footer {
        display: flex;
        align-items: center;
        min-height: 25.625rem;
        padding: 0;
    }

    .site-footer::before {
        background-position: center 52%;
    }

    .footer-panel {
        width: 100%;
        min-height: 0;
        padding: 1.5rem 1.25rem;
    }

    .footer-links {
        justify-content: center;
        gap: 0.125rem 1.375rem;
        text-align: center;
    }

    .footer-links a {
        display: inline-flex;
        align-items: center;
        min-height: 2.75rem;
    }

    .footer-body {
        display: block;
        max-width: 62.875rem;
        margin: 1.25rem auto 0 !important;
        text-align: center;
    }

    .footer-logo {
        width: 16.25rem;
        max-width: 100%;
        margin: 0 auto 1.125rem;
    }

    .footer-body address {
        text-align: center;
    }
}


/* ==========================================================================
 *  12  PŘÍSTUPNOST A POHYB
 *  ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}


/* ==========================================================================
 *  13  KATALOG – OBALOVÉ PRVKY
 *  (stránka s katalogem komponent; na ostrém webu se nemusí používat)
 *  ========================================================================== */

.catalog-wrap {
    max-width: 69.25rem;
    margin-inline: auto;
}

.catalog-header {
    background: #f2f2f2;
    padding: 2.625rem 1.5rem 2.125rem;
}

.catalog-kicker,
.catalog-id {
    font-size: 0.875rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #555;
    margin: 0 0 0.5rem;
}

.catalog-header h1 {
    font-size: 2rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
}

.catalog-header p:last-child {
    font-size: var(--font-body);
    line-height: 1.5;
    max-width: 46.875rem;
    margin: 0;
}

/* Přehled stránek */
.catalog-pages {
    padding: 1.5rem;
    background: #fff;
    border-bottom: 1px solid #ddd;
}

.catalog-pages > .catalog-wrap > p:first-child {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 0.875rem;
}

.catalog-pages ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.catalog-pages a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0.5rem 0.875rem;
    border-radius: 0.1875rem;
    background: #f2f2f2;
    color: #111;
    font-size: var(--font-body);
    text-decoration: none;
}

.catalog-pages a:hover,
.catalog-pages a:focus-visible {
    background: #e3e3e3;
    color: #000dff;
}

.catalog-pages-note {
    font-size: var(--font-body);
    line-height: 1.5;
    color: #555;
    margin: 0.875rem 0 0;
}

/* Položka katalogu */
.catalog-entry h2[id] {
    scroll-margin-top: 1.25rem;
}

.catalog-entry {
    padding: 4.375rem 0;
    border-bottom: 1px solid #ddd;
}

.catalog-entry-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 2.5rem;
    margin-bottom: 1.75rem;
}

.catalog-entry-head h2 {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
}

.catalog-entry-head > p {
    max-width: 23.125rem;
    font-size: var(--font-body);
    line-height: 1.5;
    margin: 0;
}

.catalog-full-preview {
    width: 100%;
}

.catalog-preview {
    padding: 0;
}

.catalog-note {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #555;
    margin-top: 1.125rem;
    margin-bottom: 0;
}

.catalog-footer {
    background: #f2f2f2;
    padding: 2.125rem 1.5rem;
}

.catalog-footer p {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.5;
}

/* Hlavní komponenty uvnitř položky katalogu */
.catalog-entry .hero {
    width: 100%;
}

.catalog-entry .service-grid {
    margin-top: 0;
}

.catalog-entry .intro {
    margin-top: 0;
}

.catalog-entry .quick-row {
    margin-top: 0;
}

@media (max-width: 74.9375rem) {
    .catalog-wrap,
    .catalog-preview {
        margin-inline: 1.5rem;
    }
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .catalog-header h1 {
        font-size: 1.75rem;
    }

    .catalog-entry-head h2 {
        font-size: 1.3125rem;
    }

    .catalog-note,
    .catalog-footer p {
        font-size: 0.75rem;
    }
}

@media (max-width: 47.9375rem) {
    .catalog-header {
        padding: 1.75rem 1.25rem;
    }

    .catalog-header h1 {
        font-size: 1.5rem;
    }

    .catalog-pages {
        padding: 1.25rem;
    }

    .catalog-pages > .catalog-wrap > p:first-child {
        font-size: 1.125rem;
    }

    .catalog-entry {
        padding: 3rem 0;
    }

    .catalog-wrap,
    .catalog-preview {
        margin-inline: 1.25rem;
    }

    .catalog-entry-head {
        display: block;
        margin-bottom: 1.375rem;
    }

    .catalog-entry-head h2 {
        font-size: 1.125rem;
    }

    .catalog-entry-head > p {
        margin-top: 0.625rem;
    }

    .catalog-note,
    .catalog-footer p,
    .catalog-id,
    .catalog-kicker {
        font-size: 0.75rem;
    }
}


/* ==========================================================================
 *  14  PODSTRÁNKA: TITULNÍ FOTO, ÚVOD, SEZNAM, PANELY
 *  ========================================================================== */

/* --- 14.1 Titulní fotografie podstránky --- */
.subpage-hero {
    position: relative;
    height: 25rem;
    background: center top / cover no-repeat url("../assets/hero.jpg");
}

.subpage-hero-title {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    min-height: 9.4375rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(33 33 33 / 75%);
    color: #fff;
}

.subpage-hero-title h2 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
    margin: 0;
    text-align: center;
}

/* --- 14.2 Úvodní text --- */
.subpage-intro {
    font-size: var(--font-body);
    line-height: 1.7;
}

.subpage-intro p {
    margin: 0;
}

/* --- 14.3 Seznam (využívá kartu .listing-card z hlavní stránky) --- */
.auction-feed h3 {
    font-size: 1.75rem;
    font-weight: 300;
    margin: 0 0 3rem;
}

.auction-feed .listing-card {
    position: static;
    left: auto;
}

.auction-feed .listing-content h4 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
    margin: 0 0 3.25rem;
}

.auction-feed .listing-card[hidden] {
    display: none !important;
}

.load-more {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
    min-height: 3.5rem;
    margin: 3.75rem auto 0;
    padding: 0.625rem 1.375rem;
    border: 0;
    background: transparent;
    color: #111;
    font: inherit;
    font-size: var(--font-body);
}

.load-more i {
    font-size: 1.3125rem;
    line-height: 1;
}

.load-more:hover {
    text-decoration: underline;
    text-underline-offset: 0.25rem;
}

/* --- 14.4 Šedý informační panel --- */
.auction-info {
    background: #f2f2f2;
    padding: 4rem 1.5rem;
    color: #111;
}

.auction-info p {
    font-size: var(--font-body);
    line-height: 1.7;
    margin: 0 0 1.5rem;
}

.auction-info .dark-button {
    margin-top: 1.75rem;
    min-width: 0;
}

/* --- 14.5 Externí odkaz --- */
.external-callout {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 3.5rem;
    align-items: center;
    padding: 1.75rem 0;
}

.external-callout p {
    font-size: var(--font-body);
    line-height: 1.7;
    max-width: 31.875rem;
    margin: 0;
}

.external-callout-link {
    min-height: 3.25rem;
    padding: 0.625rem 1.25rem;
    border: 0;
    border-radius: 0.1875rem;
    background: #000dff;
    color: #fff;
    font: inherit;
    font-size: var(--font-body);
    text-align: center;
}

.external-callout-link:hover,
.external-callout-link:focus-visible {
    background: #0000cf;
    color: #fff;
}

/* ≤ 1199px */
@media (max-width: 74.9375rem) {
    .subpage-hero .site-header .navbar {
        margin-inline: 1.5rem;
    }

    .auction-feed .listing-card {
        gap: 1.875rem;
    }
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .subpage-hero {
        height: 21.875rem;
    }

    .subpage-hero .site-header,
    .subpage-hero .site-header .navbar {
        min-height: 5.6875rem;
    }

    .subpage-hero .site-logo {
        width: 15.625rem;
    }

    .subpage-hero-title {
        min-height: 8.25rem;
    }

    .subpage-hero-title h2 {
        font-size: 2.1875rem;
    }

    .subpage-intro,
    .auction-info p,
    .external-callout p {
        line-height: 1.65;
    }

    .auction-feed h3 {
        font-size: 1.53125rem;
    }

    .auction-feed .listing-content h4 {
        font-size: 1.09375rem;
    }

    .load-more {
        min-height: 2.875rem;
    }

    .auction-info {
        padding-block: 3.5rem;
    }

    .auction-info .dark-button {
        margin-top: 1.5rem;
        width: max-content;
        max-width: 100%;
        min-width: 0;
    }

    .external-callout {
        gap: 3.0625rem;
    }

    .external-callout-link {
        min-height: 2.875rem;
        padding: 0.5625rem 1.125rem;
        width: max-content;
        max-width: 100%;
        min-width: 0;
        justify-self: start;
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    .subpage-hero {
        height: 18.75rem;
        background-position: 57% top;
    }

    .subpage-hero .site-header .navbar {
        margin: 0;
    }

    .subpage-hero-title {
        min-height: 7rem;
    }

    .subpage-hero-title h2 {
        font-size: 1.875rem;
    }

    .subpage-intro {
        line-height: 1.6;
    }

    .auction-feed h3 {
        font-size: 1.3125rem;
        margin-bottom: 1.875rem;
    }

    .auction-feed .listing-content h4 {
        font-size: 0.9375rem;
        margin-bottom: 1.25rem;
    }

    .auction-feed .listing-card {
        gap: 1.25rem;
    }

    .load-more {
        min-height: 2.75rem;
        margin-top: 1.75rem;
    }

    .auction-info {
        padding: 3rem 1.25rem;
    }

    .auction-info .content-width {
        margin: 0;
    }

    .auction-info p {
        line-height: 1.6;
        margin-bottom: 1.25rem;
    }

    .auction-info .dark-button {
        margin-top: 1.25rem;
        width: auto;
        max-width: 100%;
        min-width: 0;
    }

    .external-callout {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 0.75rem 0;
    }

    .external-callout p {
        line-height: 1.6;
    }

    .external-callout-link {
        justify-self: start;
        width: auto;
        max-width: 100%;
        min-height: 2.75rem;
        padding: 0.5625rem 1rem;
    }
}


/* ==========================================================================
 *  15  DETAIL PRONÁJMU
 *  ========================================================================== */

/* Tlačítko CTA (varianta informačního panelu pro pronájmy) */
.rental-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    max-width: 100%;
    min-height: 3.25rem;
    margin-top: 1.75rem;
    padding: 0.625rem 1.25rem;
    border: 0;
    border-radius: 0.1875rem;
    background: #000dff;
    color: #fff;
    font: inherit;
    font-size: var(--font-body);
    line-height: 1.35;
    text-align: center;
}

.rental-cta:hover,
.rental-cta:focus-visible {
    background: #0000cf;
    color: #fff;
}

/* Galerie */
.detail-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.375rem;
}

.detail-gallery-item {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1.72;
    overflow: hidden;
    padding: 0;
    border: 0;
    background: #eee;
    cursor: pointer;
}

.detail-gallery-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-gallery-item:hover img {
    filter: brightness(0.82);
}

.detail-play {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 2.625rem;
    text-shadow: 0 0.0625rem 0.5rem #000;
}

.detail-count {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgb(0 0 0 / 48%);
    color: #fff;
    font-size: 2rem;
}

.detail-photo-full {
    display: block;
    max-width: 100%;
    height: auto;
    margin: auto;
}

/* Popis */
.detail-description {
    max-width: 61.5625rem;
}

.detail-description h3 {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 1.875rem;
}

.detail-description p,
.detail-description li {
    font-size: var(--font-body);
    line-height: 1.6;
}

.detail-description p {
    margin: 0 0 1.5rem;
}

.detail-description h4 {
    font-size: var(--font-body);
    font-weight: 600;
    margin: 0 0 0.625rem;
}

.detail-description ul {
    margin: 0;
    padding-left: 1.3em;
}

/* Soubory ke stažení */
.detail-files {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem 3.75rem;
}

.detail-file {
    display: inline-flex;
    align-items: center;
    gap: 1.125rem;
    min-height: 4rem;
    padding: 0.25rem;
    border: 0;
    background: transparent;
    color: #111;
    text-align: left;
    font-size: var(--font-body);
}

.detail-file:hover strong {
    text-decoration: underline;
}

.detail-file i {
    font-size: 3.375rem;
    line-height: 1;
}

.detail-file span {
    display: grid;
    gap: 0.25rem;
}

.detail-file strong {
    font-weight: 400;
}

.detail-file small {
    font-size: var(--font-body);
}

/* Časová razítka a akce */
.detail-timestamps {
    margin: 3.4375rem 0 0;
    font-size: var(--font-body);
    line-height: 1.6;
}

.detail-timestamps div {
    display: flex;
    gap: 0.5rem;
}

.detail-timestamps dt {
    font-weight: 400;
}

.detail-timestamps dd {
    margin: 0;
}

.detail-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.125rem;
}

.detail-actions .rental-cta {
    margin: 0;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .rental-cta {
        min-height: 2.875rem;
        margin-top: 1.5rem;
        padding: 0.5625rem 1.125rem;
    }

    .detail-description h3 {
        margin-bottom: 1.625rem;
    }

    .detail-description p {
        margin-bottom: 1.3125rem;
    }

    .detail-files {
        gap: 1.75rem 3.25rem;
    }

    .detail-file i {
        font-size: 2.9375rem;
    }

    .detail-timestamps {
        margin-top: 3rem;
    }
}

@media (max-width: 47.9375rem) {
    .rental-cta {
        min-height: 2.75rem;
        margin-top: 1.25rem;
        padding: 0.5625rem 1rem;
    }

    .detail-gallery {
        gap: 0.25rem;
    }

    .detail-gallery-item {
        aspect-ratio: 1.1;
    }

    .detail-play {
        font-size: 1.875rem;
    }

    .detail-count {
        font-size: 1.4375rem;
    }

    .detail-description h3 {
        margin-bottom: 1.3125rem;
    }

    .detail-description p {
        margin-bottom: 1.125rem;
    }

    .detail-files {
        gap: 1.125rem 1.5rem;
    }

    .detail-file {
        gap: 0.625rem;
        min-height: 3.25rem;
    }

    .detail-file i {
        font-size: 2.375rem;
    }

    .detail-timestamps {
        margin-top: 2rem;
    }

    .detail-actions {
        gap: 0.75rem;
    }
}


/* ==========================================================================
 *  16  STRÁNKA O NÁS (také základ pro fotografické odkazy .about-link)
 *  ========================================================================== */

.about-intro h3,
.about-history h3 {
    font-size: 1.5rem;
    line-height: 1.35;
    font-weight: 700;
    color: #000dff;
    margin: 0 0 1.5rem;
}

.about-intro p,
.about-history p,
.about-pair p {
    font-size: var(--font-body);
    line-height: 1.55;
    margin: 0 0 1.25rem;
}

.about-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3.75rem;
    margin-top: 3.875rem;
}

.about-pair h4 {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 1.5rem;
}

.about-pair p {
    margin: 0;
}

.about-history {
    background: #f2f2f2;
    padding: 3.5rem 1.5rem;
}

.about-history h3 {
    margin-bottom: 1.375rem;
}

.about-history p {
    max-width: 56.25rem;
    margin: 0;
}

/* Fotografické odkazy s popiskem (použito i na stránkách 20 a 24) */
.about-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.about-link {
    position: relative;
    display: block;
    aspect-ratio: 1.84;
    overflow: hidden;
    padding: 0;
    border: 0;
    background: #eee;
    color: #fff;
    cursor: pointer;
}

.about-link img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.2s ease;
}

.about-link:hover img {
    transform: scale(1.03);
}

.about-link span {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    place-items: center;
    min-height: 3.25rem;
    padding: 0.625rem 1.125rem;
    background: rgb(33 33 33 / 75%);
    font-size: var(--font-quick);
    line-height: 1.25;
    text-align: center;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .about-intro h3,
    .about-history h3 {
        font-size: 1.3125rem;
        margin-bottom: 1.3125rem;
    }

    .about-pair {
        gap: 3rem;
        margin-top: 3.375rem;
    }

    .about-pair h4 {
        margin-bottom: 1.3125rem;
    }

    .about-history {
        padding-block: 3.0625rem;
    }

    .about-links {
        gap: 1.3125rem;
    }

    .about-link span {
        min-height: 2.875rem;
    }
}

@media (max-width: 47.9375rem) {
    .about-intro h3,
    .about-history h3 {
        font-size: 1.125rem;
        margin-bottom: 1.125rem;
    }

    .about-intro p,
    .about-history p {
        margin-bottom: 1rem;
    }

    .about-pair {
        grid-template-columns: 1fr;
        gap: 1.75rem;
        margin-top: 2.375rem;
    }

    .about-pair h4 {
        margin-bottom: 1rem;
    }

    .about-history {
        padding: 2.625rem 1.25rem;
    }

    .about-links {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .about-link span {
        min-height: 2.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-link img {
        transition: none;
    }
}


/* ==========================================================================
 *  17  STRÁNKA NAŠE SLUŽBY
 *  ========================================================================== */

.services-list p,
.services-list li {
    font-size: var(--font-body);
    line-height: 1.55;
}

.services-list p {
    margin: 0 0 2.75rem;
}

.services-list h3,
.services-feature h3 {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 1.75rem;
}

.services-list ul {
    margin: 0;
    padding-left: 1.15em;
}

.services-list li {
    padding-left: 0.125rem;
}

.services-feature .listing-card {
    margin-bottom: 3rem;
}

.services-feature .listing-content h4 {
    font-size: var(--font-card);
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
    margin: 0 0 2.75rem;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .services-list p {
        margin-bottom: 2.375rem;
    }

    .services-list h3,
    .services-feature h3 {
        margin-bottom: 1.5rem;
    }

    .services-feature .listing-card {
        margin-bottom: 2.625rem;
    }

    .services-feature .listing-content h4 {
        margin-bottom: 2.375rem;
    }
}

@media (max-width: 47.9375rem) {
    .services-list p {
        margin-bottom: 1.75rem;
    }

    .services-list h3,
    .services-feature h3 {
        margin-bottom: 1.125rem;
    }

    .services-feature .listing-card {
        margin-bottom: 1.75rem;
    }

    .services-feature .listing-content h4 {
        margin-bottom: 1.25rem;
    }
}


/* ==========================================================================
 *  18  KONTAKTY A MAPA
 *  (nadpisy sdílí i stránka 19 Pravidla dražby)
 *  ========================================================================== */

.contact-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4rem;
}

.contact-columns h3,
.contact-people h3,
.conditions-columns h3,
.conditions-deposit h3 {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 2rem;
}

.contact-columns address,
.contact-columns p,
.contact-person,
.conditions-intro p,
.conditions-columns p,
.conditions-deposit p {
    font-size: var(--font-body);
    font-style: normal;
    line-height: 1.55;
}

.contact-columns address {
    margin: 0 0 1.75rem;
}

.contact-columns p {
    margin: 0;
}

.contact-columns a,
.contact-person a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 0.125rem;
}

.contact-map {
    margin: 0;
}

.contact-map img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 26.25rem;
    object-fit: cover;
}

.contact-people-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 4.375rem;
    row-gap: 4.5rem;
}

.contact-person {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    min-width: 0;
}

.contact-person h4 {
    font: inherit;
    font-weight: 500;
    margin: 0;
}

.contact-person p {
    margin: 0;
}

.contact-person p:last-child {
    margin-top: 0.125rem;
}

.contact-person a {
    overflow-wrap: anywhere;
}

.contact-person i {
    display: grid;
    place-items: center;
    flex: 0 0 4.5rem;
    width: 4.5rem;
    height: 4.5rem;
    border: 2px solid #333;
    border-radius: 50%;
    font-size: 2.375rem;
    line-height: 1;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .contact-columns {
        gap: 3.5rem;
    }

    .contact-columns h3,
    .contact-people h3,
    .conditions-columns h3 {
        margin-bottom: 1.75rem;
    }

    .contact-people-grid {
        gap: 3.875rem 3.125rem;
    }

    .contact-person i {
        flex-basis: 3.875rem;
        width: 3.875rem;
        height: 3.875rem;
        font-size: 2rem;
    }
}

@media (max-width: 47.9375rem) {
    .contact-columns {
        grid-template-columns: 1fr;
        gap: 2.375rem;
    }

    .contact-columns h3,
    .contact-people h3,
    .conditions-columns h3 {
        margin-bottom: 1.25rem;
    }

    .contact-columns address {
        margin-bottom: 1.25rem;
    }

    .contact-map img {
        min-height: 13.75rem;
        object-fit: cover;
    }

    .contact-people-grid {
        grid-template-columns: 1fr;
        gap: 1.75rem;
    }

    .contact-person i {
        flex-basis: 3.25rem;
        width: 3.25rem;
        height: 3.25rem;
        font-size: 1.6875rem;
    }
}


/* ==========================================================================
 *  19  PRAVIDLA DRAŽBY
 *  ========================================================================== */

.conditions-intro > p {
    margin: 0 0 4rem;
}

.conditions-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4rem;
}

.conditions-columns p {
    margin: 0 0 1.5rem;
}

.conditions-columns p:last-child {
    margin-bottom: 0;
}

.conditions-deposit {
    background: #f2f2f2;
    padding: 3.5rem 1.5rem;
}

.conditions-deposit h3 {
    margin-bottom: 1.5rem;
}

.conditions-deposit p {
    margin: 0 0 1.5rem;
}

.conditions-deposit p:last-child {
    margin: 0;
}

/* Odkaz uvnitř textu (tlačítko vypadající jako odkaz) */
.inline-link {
    display: inline;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 0.125rem;
    cursor: pointer;
}

.inline-link:hover {
    color: #000dff;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .conditions-columns {
        gap: 3.5rem;
    }

    .conditions-intro > p {
        margin-bottom: 3.5rem;
    }

    .conditions-deposit {
        padding-block: 3.0625rem;
    }
}

@media (max-width: 47.9375rem) {
    .conditions-columns {
        grid-template-columns: 1fr;
        gap: 2.375rem;
    }

    .conditions-intro > p {
        margin-bottom: 2.625rem;
    }

    .conditions-columns p {
        margin-bottom: 1.125rem;
    }

    .conditions-deposit {
        padding: 2.625rem 1.25rem;
    }

    .conditions-deposit h3 {
        margin-bottom: 1.125rem;
    }

    .conditions-deposit p {
        margin-bottom: 1.125rem;
    }
}


/* ==========================================================================
 *  20  ROZCESTNÍK KRAJSKÝCH CYKLOSTEZEK
 *  ========================================================================== */

.cycle-routes > p {
    font-size: var(--font-body);
    line-height: 1.55;
    margin: 0 0 4.5rem;
}

.cycle-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem 2.625rem;
}

.cycle-links .about-link {
    aspect-ratio: 1.65;
}

.cycle-links .about-link span {
    font-size: 1.5rem;
    min-height: 3.5rem;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .cycle-routes > p {
        margin-bottom: 3.9375rem;
    }

    .cycle-links {
        gap: 2.625rem 2.3125rem;
    }

    .cycle-links .about-link span {
        font-size: 1.3125rem;
        min-height: 3.0625rem;
    }
}

@media (max-width: 47.9375rem) {
    .cycle-routes > p {
        margin-bottom: 2.25rem;
    }

    .cycle-links {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .cycle-links .about-link span {
        font-size: 1.125rem;
        min-height: 2.75rem;
    }
}


/* ==========================================================================
 *  21  SEZNAM DOKUMENTŮ
 *  ========================================================================== */

.documents-index ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.documents-index li + li {
    margin-top: 1.375rem;
}

.documents-index button {
    display: inline;
    padding: 0;
    border: 0;
    background: none;
    color: #333;
    font: inherit;
    font-size: var(--font-body);
    line-height: 1.5;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 0.125rem;
    overflow-wrap: anywhere;
    cursor: pointer;
}

.documents-index button:hover {
    color: #000dff;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .documents-index li + li {
        margin-top: 1.1875rem;
    }
}

@media (max-width: 47.9375rem) {
    .documents-index li + li {
        margin-top: 1rem;
    }
}


/* ==========================================================================
 *  22  KARTA PRACOVNÍHO MÍSTA
 *  ========================================================================== */

.job-card {
    width: min(100%, 28.75rem);
    min-height: 20rem;
    padding: 2rem;
    background: #f2f2f2;
    border-radius: 0.1875rem;
}

.job-card h3 {
    margin: 0 0 1.875rem;
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: 700;
}

.job-card h3 button {
    padding: 0;
    border: 0;
    background: none;
    color: #000dff;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.job-card h3 button:hover {
    text-decoration: underline;
    text-underline-offset: 0.1875rem;
}

.job-facts {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem;
    font-size: var(--font-body);
    line-height: 1.45;
    font-weight: 700;
}

.job-card p {
    font-size: var(--font-body);
    line-height: 1.55;
    margin: 0;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .job-card {
        max-width: 25.125rem;
        min-height: 17.5rem;
        padding: 1.75rem;
    }

    .job-card h3 {
        font-size: 1.3125rem;
        margin-bottom: 1.625rem;
    }

    .job-facts {
        margin-bottom: 1.75rem;
    }
}

@media (max-width: 47.9375rem) {
    .job-card {
        width: 100%;
        min-height: 0;
        padding: 1.5rem;
    }

    .job-card h3 {
        font-size: 1.125rem;
        margin-bottom: 1.25rem;
    }

    .job-facts {
        margin-bottom: 1.375rem;
    }
}


/* ==========================================================================
 *  23  DETAIL PRACOVNÍ POZICE
 *  ========================================================================== */

.job-detail h3 {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 2.25rem;
}

.job-detail h4,
.job-apply h3 {
    font-size: var(--font-card);
    font-weight: 400;
    line-height: 1.35;
    margin: 0 0 1.625rem;
}

.job-detail section + section {
    margin-top: 2.25rem;
}

.job-detail ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.job-detail li,
.job-apply p,
.job-apply dl,
.job-facts-panel dl {
    font-size: var(--font-body);
    line-height: 1.55;
}

.job-facts-panel {
    background: #f2f2f2;
    padding: 3.625rem 1.5rem;
}

.job-facts-panel h3 {
    font-size: var(--font-card);
    font-weight: 700;
    color: #000dff;
    margin: 0 0 1.875rem;
}

.job-facts-panel dl {
    margin: 0;
}

.job-facts-panel dl div,
.job-apply dl div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3125rem;
}

.job-facts-panel dt,
.job-apply dt {
    font-weight: 400;
}

.job-facts-panel dd,
.job-apply dd {
    margin: 0;
}

.job-apply h3 {
    margin-bottom: 2rem;
}

.job-apply p {
    margin: 0 0 1.875rem;
}

.job-apply dl {
    margin: 0 0 1.875rem;
}

.job-apply p:last-child {
    margin: 0;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .job-detail h3 {
        margin-bottom: 1.9375rem;
    }

    .job-detail h4,
    .job-apply h3 {
        margin-bottom: 1.4375rem;
    }

    .job-detail section + section {
        margin-top: 1.9375rem;
    }

    .job-facts-panel {
        padding-block: 3.1875rem;
    }

    .job-facts-panel h3 {
        margin-bottom: 1.625rem;
    }

    .job-apply p,
    .job-apply dl {
        margin-bottom: 1.625rem;
    }
}

@media (max-width: 47.9375rem) {
    .job-detail h3 {
        margin-bottom: 1.4375rem;
    }

    .job-detail h4,
    .job-apply h3 {
        margin-bottom: 1.125rem;
    }

    .job-detail section + section {
        margin-top: 1.5rem;
    }

    .job-facts-panel {
        padding: 2.5rem 1.25rem;
    }

    .job-facts-panel h3 {
        margin-bottom: 1.25rem;
    }

    .job-apply p,
    .job-apply dl {
        margin-bottom: 1.25rem;
    }
}


/* ==========================================================================
 *  24  ODKAZY NA OBJEKTY (dlouhé názvy ve fotografické mřížce .about-link)
 *  ========================================================================== */

.asset-links .about-link span {
    font-size: var(--font-body);
    min-height: 3.25rem;
    padding-inline: 0.75rem;
}

@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .asset-links .about-link span {
        min-height: 2.875rem;
    }
}

@media (max-width: 47.9375rem) {
    .asset-links .about-link span {
        min-height: 2.75rem;
    }
}


/* ==========================================================================
 *  25  KATALOG – VÝJIMKY PRO VÝPIS NA HLAVNÍ STRÁNCE
 *  ========================================================================== */

.catalog-home-listing .listing-section,
.catalog-home-listing .listing-section + .listing-section {
    margin-top: 0;
}

.catalog-home-listing .listing-section + .listing-section {
    margin-top: 4rem;
}

.catalog-home-listing .listing-section:last-of-type .section-action {
    margin-bottom: 0;
}

@media (max-width: 47.9375rem) {
    .catalog-home-listing .listing-section + .listing-section {
        margin-top: 3rem;
    }
}


/* ==========================================================================
 *  26  ŠABLONA STRÁNKY (.page-main)
 *  Pořadí pravidel je zachováno z původního souboru – záleží na něm
 *  kaskáda u prvků s více třídami (např. .page-section.page-band).
 *  ========================================================================== */

.page-main .subpage-hero-title h1 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
    margin: 0;
    text-align: center;
}

.page-main > .page-section {
    margin-top: 4rem;
    margin-bottom: 4rem;
}

.page-main > .page-band {
    margin-top: 4.5rem;
    margin-bottom: 4.5rem;
}

.page-main > .subpage-hero + .page-section {
    margin-top: 4.375rem;
}

.page-main .subpage-intro p {
    margin: 0 0 1.5rem;
}

.page-main .subpage-intro p:last-child {
    margin-bottom: 0;
}

.page-main .listing-list-heading {
    font-size: var(--font-section);
    font-weight: 300;
    line-height: 1.3;
    margin: 0 0 2rem;
}

.page-main .listing-content h3 a,
.listing-content h3 a {
    color: inherit;
    text-decoration: none;
}

.page-main .listing-content h3 a:hover,
.page-main .listing-content h3 a:focus-visible,
.listing-content h3 a:hover,
.listing-content h3 a:focus-visible {
    color: #000dff;
    text-decoration: underline;
}

.page-main .property-list .listing-card:last-child {
    margin-bottom: 0;
}

.page-main .page-actions {
    display: flex;
    justify-content: center;
}

.page-main .page-service-links .service-grid {
    margin-top: 0;
}

.page-main .page-section.content-width {
    margin-inline: auto;
}

.page-main .page-section.page-band {
    width: 100%;
}

.page-main .job-card h3 a {
    color: #000dff;
    text-decoration: none;
}

.page-main .job-card h3 a:hover,
.page-main .job-card h3 a:focus-visible {
    text-decoration: underline;
}

.page-main .jobs-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.page-main .jobs-grid > .visually-hidden {
    position: absolute;
}

/* Tablet */
@media (min-width: 48rem) and (max-width: 74.9375rem) {
    .page-main .subpage-hero-title h1 {
        font-size: 2.1875rem;
    }

    .page-main > .page-section {
        margin-block: 3.5rem;
    }

    .page-main > .page-section.content-width {
        margin-inline: 1.5rem;
    }
}

/* Mobil */
@media (max-width: 47.9375rem) {
    .page-main .subpage-hero-title h1 {
        font-size: 1.875rem;
    }

    .page-main > .page-section {
        margin-block: 2.75rem;
    }

    .page-main > .page-section.content-width {
        margin-inline: 1.25rem;
    }

    .page-main .page-service-links .service-grid {
        margin-inline: 1.25rem;
    }

    .page-main .jobs-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
}
