/* ==========================================================================
   Shop Garage – Moje garáž (F5-35): motorka zákazníka, tachometr do servisu,
   připomínky servisu a STK, servisní historie, produkty, které na motorku sedí.
   Vše pod kořenem .esh-gz, třídy s prefixem .esh-gz-, nic globálního.
   Barvy a písmo přebírá z účtu zákazníka (--pf-*, F5-01) včetně tmavého
   motivu; mimo účet platí stejné výchozí hodnoty. Mobil od 390 px první,
   plná šířka, fotky celé (contain). Animace jen při
   prefers-reduced-motion: no-preference a až když je prvek vidět (garaz.js).
   Globální pravidla webu (svg{width:20px;fill:none;stroke}, p{margin:0},
   a{color:inherit}, velikosti nadpisů) se přebíjejí specifičtějšími selektory.
   ========================================================================== */

.esh-gz {
    --gz-ink: var(--pf-ink, #191a1c);
    --gz-muted: var(--pf-muted, #625f59);
    --gz-bg: var(--pf-bg, #f4f1eb);
    --gz-surface: var(--pf-surface, #fffefb);
    --gz-surface-2: var(--pf-surface-2, #ece8e0);
    --gz-line: var(--pf-line, #dcd8d1);
    --gz-line-strong: var(--pf-line-strong, #b9b4ab);
    --gz-red: var(--pf-red, #c92d26);
    --gz-red-hover: var(--pf-red-hover, #ad211c);
    --gz-red-text: var(--pf-red-text, #b3261f);
    --gz-red-soft: var(--pf-red-soft, #f7e3e1);
    --gz-brass: var(--pf-brass, #a8834a);
    --gz-brass-text: var(--pf-brass-text, #7a5a2a);
    --gz-ok-text: var(--pf-ok, #1d6b35);
    --gz-ok-bg: var(--pf-ok-bg, #e2f0e5);
    --gz-warn-text: var(--pf-warn, #7f4c00);
    --gz-warn-bg: var(--pf-warn-bg, #fbeed6);
    --gz-info-text: var(--pf-info, #245080);
    --gz-info-bg: var(--pf-info-bg, #e3ecf6);
    --gz-focus: var(--pf-focus, #b3261f);
    --gz-input-bg: var(--pf-input-bg, #fff);
    --gz-night: var(--pf-night, #111214);
    --gz-radius: var(--pf-radius, 10px);
    --gz-radius-s: var(--pf-radius-s, 6px);
    --gz-ease: var(--pf-ease, cubic-bezier(.2, .65, .25, 1));
    --gz-shadow: var(--pf-shadow, 0 1px 2px rgba(17, 18, 20, .05), 0 18px 40px -26px rgba(17, 18, 20, .35));
    --gz-shadow-hover: var(--pf-shadow-hover, 0 2px 4px rgba(17, 18, 20, .06), 0 26px 50px -26px rgba(17, 18, 20, .45));
    /* signální barvy přístrojů: dost kontrastní na tmavé scéně i na papíře */
    --gz-sig-ok: #3fb068;
    --gz-sig-brzy: #f2a31b;
    --gz-sig-po: #ec4a3f;
    --gz-sig-nezname: #8d8a84;
    --gz-mezera: clamp(16px, 2.2vw, 32px);

    display: grid;
    gap: var(--gz-mezera);
    width: 100%;
    min-width: 0;
    color: var(--gz-ink);
    font-family: inherit;
    line-height: 1.55;
}

.esh-gz *,
.esh-gz *::before,
.esh-gz *::after {
    box-sizing: border-box;
}

.esh-gz p,
.esh-gz h2,
.esh-gz h3,
.esh-gz h4,
.esh-gz ul,
.esh-gz ol,
.esh-gz dl,
.esh-gz dd,
.esh-gz figure,
.esh-gz fieldset {
    margin: 0;
}

.esh-gz ul,
.esh-gz ol {
    padding: 0;
    list-style: none;
}

.esh-gz fieldset {
    min-width: 0;
    padding: 0;
    border: 0;
}

.esh-gz img {
    display: block;
    max-width: 100%;
    height: auto;
}

.esh-gz svg.esh-gz-ikona {
    flex: none;
    width: 1.25em;
    height: 1.25em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.esh-gz a {
    color: inherit;
}

.esh-gz :focus-visible {
    outline: 3px solid var(--gz-focus);
    outline-offset: 3px;
    border-radius: 4px;
}

/* ---------- Nadtitulek, štítky, stav ---------- */

.esh-gz .esh-gz-nadtitulek {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    color: var(--gz-red-text);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.esh-gz .esh-gz-nadtitulek::before {
    content: "";
    width: 26px;
    height: 2px;
    background: currentColor;
}

.esh-gz .esh-gz-nadtitulek--svetly {
    color: #ff8a7f;
}

.esh-gz .esh-gz-stitek {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .03em;
    line-height: 1.4;
    text-transform: none;
    white-space: normal;
}

.esh-gz .esh-gz-stitek--ukazka {
    color: #5c3b00;
    background: #ffd98a;
    border: 1px dashed #9a6400;
}

.esh-gz .esh-gz-stitek--dealer {
    color: var(--gz-brass-text);
    background: color-mix(in srgb, var(--gz-brass) 16%, transparent);
}

.esh-gz .esh-gz-stitek--vlastni {
    color: var(--gz-info-text);
    background: var(--gz-info-bg);
}

.esh-gz .esh-gz-stitek--sedi {
    color: var(--gz-ok-text);
    background: var(--gz-ok-bg);
}

.esh-gz .esh-gz-stav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 800;
}

.esh-gz .esh-gz-stav::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}

.esh-gz .esh-gz-stav--ok { color: var(--gz-ok-text); background: var(--gz-ok-bg); }
.esh-gz .esh-gz-stav--brzy { color: var(--gz-warn-text); background: var(--gz-warn-bg); }
.esh-gz .esh-gz-stav--po-terminu { color: var(--gz-red-text); background: var(--gz-red-soft); }
.esh-gz .esh-gz-stav--nezname { color: var(--gz-muted); background: var(--gz-surface-2); }

/* ---------- Tlačítka ---------- */

.esh-gz .esh-gz-tl {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 48px;
    padding: 12px 20px;
    border: 2px solid transparent;
    border-radius: var(--gz-radius-s);
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s var(--gz-ease), border-color .2s var(--gz-ease), color .2s var(--gz-ease), transform .2s var(--gz-ease);
}

.esh-gz .esh-gz-tl--plne {
    color: #fff;
    background: var(--gz-red);
}

.esh-gz .esh-gz-tl--plne:hover {
    background: var(--gz-red-hover);
}

.esh-gz .esh-gz-tl--obrys {
    color: var(--gz-ink);
    background: transparent;
    border-color: var(--gz-line-strong);
}

.esh-gz .esh-gz-tl--obrys:hover {
    border-color: var(--gz-ink);
}

.esh-gz .esh-gz-tl--obrys-svetly {
    color: #fff;
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .42);
}

.esh-gz .esh-gz-tl--obrys-svetly:hover {
    border-color: #fff;
    background: rgba(255, 255, 255, .1);
}

.esh-gz .esh-gz-tl:active {
    transform: translateY(1px);
}

.esh-gz .esh-gz-odkaz-tl {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 6px 0;
    border: 0;
    background: none;
    color: var(--gz-muted);
    font: inherit;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.esh-gz .esh-gz-odkaz-tl:hover {
    color: var(--gz-ink);
}

.esh-gz .esh-gz-odkaz-tl--pozor {
    color: var(--gz-red-text);
}

/* ---------- Karta ---------- */

.esh-gz .esh-gz-karta {
    position: relative;
    display: grid;
    gap: 20px;
    min-width: 0;
    padding: clamp(20px, 3vw, 36px);
    border: 1px solid var(--gz-line);
    border-radius: var(--gz-radius);
    background: var(--gz-surface);
    box-shadow: var(--gz-shadow);
}

.esh-gz .esh-gz-karta__hlava {
    display: grid;
    gap: 8px;
}

.esh-gz .esh-gz-karta__hlava--radek {
    grid-template-columns: minmax(0, 1fr);
    align-items: end;
    gap: 14px 24px;
}

.esh-gz .esh-gz-karta__nadpis {
    color: inherit;
    font-size: clamp(21px, 2.1vw, 30px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.015em;
    text-wrap: balance;
}

.esh-gz .esh-gz-karta__uvod {
    max-width: 68ch;
    color: var(--gz-muted);
}

.esh-gz .esh-gz-zdroj {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--gz-muted);
    font-size: 13.5px;
    line-height: 1.5;
}

.esh-gz .esh-gz-zdroj a {
    color: inherit;
    font-weight: 700;
    text-underline-offset: 3px;
}

.esh-gz .esh-gz-zdroj--male {
    font-size: 12.5px;
}

.esh-gz .esh-gz-prazdne {
    padding: 18px 20px;
    border: 1px dashed var(--gz-line-strong);
    border-radius: var(--gz-radius-s);
    color: var(--gz-muted);
}

/* ---------- Prázdná garáž ---------- */

.esh-gz .esh-gz-prazdna {
    position: relative;
    display: grid;
    gap: 24px;
    overflow: hidden;
    padding: clamp(24px, 4vw, 64px);
    border-radius: var(--gz-radius);
    color: #f4f1eb;
    background:
        radial-gradient(90% 70% at 70% 20%, rgba(255, 238, 205, .16), transparent 60%),
        linear-gradient(180deg, #1b1c20 0%, var(--gz-night) 70%);
    isolation: isolate;
}

.esh-gz .esh-gz-prazdna__fotky {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: 8px;
}

.esh-gz .esh-gz-prazdna__fotky img {
    width: 100%;
    aspect-ratio: 14 / 9;
    object-fit: contain;
    filter: drop-shadow(0 18px 18px rgba(0, 0, 0, .55));
}

.esh-gz .esh-gz-prazdna__fotky img:nth-child(2) {
    transform: scale(1.18) translateY(-6%);
}

.esh-gz .esh-gz-prazdna__text {
    display: grid;
    justify-items: start;
    gap: 16px;
}

.esh-gz .esh-gz-prazdna__nadpis {
    color: #fff;
    font-size: clamp(28px, 4.4vw, 60px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -.03em;
    text-wrap: balance;
}

.esh-gz .esh-gz-prazdna__vyhody {
    display: grid;
    gap: 10px;
    color: #d8d3ca;
}

.esh-gz .esh-gz-prazdna__vyhody li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.esh-gz .esh-gz-prazdna__vyhody svg.esh-gz-ikona {
    color: #ff8a7f;
    margin-top: 2px;
}

/* ---------- Přepínač motorek ---------- */

.esh-gz .esh-gz-prepinac ul {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 4px 2px 10px;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
}

.esh-gz .esh-gz-prepinac li {
    flex: none;
    scroll-snap-align: start;
}

.esh-gz .esh-gz-prepinac a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 56px;
    padding: 6px 16px 6px 8px;
    border: 2px solid var(--gz-line);
    border-radius: 999px;
    background: var(--gz-surface);
    font-weight: 800;
    font-size: 14.5px;
    text-decoration: none;
    transition: border-color .2s var(--gz-ease), background-color .2s var(--gz-ease);
}

.esh-gz .esh-gz-prepinac a:hover {
    border-color: var(--gz-line-strong);
}

.esh-gz .esh-gz-prepinac a[aria-current="page"] {
    border-color: var(--gz-red);
    background: var(--gz-red-soft);
}

.esh-gz .esh-gz-prepinac img {
    width: 64px;
    height: 42px;
    object-fit: contain;
}

.esh-gz .esh-gz-tecka {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--gz-sig-nezname);
}

.esh-gz .esh-gz-tecka--ok { background: var(--gz-sig-ok); }
.esh-gz .esh-gz-tecka--brzy { background: var(--gz-sig-brzy); }
.esh-gz .esh-gz-tecka--po-terminu { background: var(--gz-sig-po); box-shadow: 0 0 0 4px color-mix(in srgb, var(--gz-sig-po) 25%, transparent); }

/* ---------- Showroom motorky ---------- */

.esh-gz .esh-gz-show {
    position: relative;
    display: grid;
    overflow: hidden;
    border-radius: var(--gz-radius);
    color: #f4f1eb;
    background:
        radial-gradient(120% 80% at 50% 0%, #2a2b30 0%, #16171a 55%, #0c0c0e 100%);
    isolation: isolate;
}

.esh-gz .esh-gz-show__scena {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 260px;
    padding: 56px clamp(12px, 3vw, 48px) 28px;
    container-type: inline-size;
}

.esh-gz .esh-gz-show__vodoznak {
    position: absolute;
    inset: 14px 12px auto;
    z-index: -1;
    color: transparent;
    font-size: clamp(44px, 17cqi, 260px);
    font-weight: 900;
    line-height: .86;
    letter-spacing: -.04em;
    text-align: center;
    text-transform: uppercase;
    -webkit-text-stroke: 1px rgba(255, 255, 255, .13);
    overflow-wrap: anywhere;
    user-select: none;
}

.esh-gz .esh-gz-show__svetlo {
    position: absolute;
    top: -20%;
    left: 50%;
    z-index: -1;
    width: min(760px, 120%);
    aspect-ratio: 1;
    transform: translateX(-50%);
    background: radial-gradient(closest-side, rgba(255, 236, 200, .3), rgba(255, 236, 200, .08) 55%, transparent 75%);
    pointer-events: none;
}

.esh-gz .esh-gz-show__foto {
    position: relative;
    z-index: 1;
    width: min(100%, 820px);
    aspect-ratio: 14 / 9;
    object-fit: contain;
    filter: drop-shadow(0 28px 22px rgba(0, 0, 0, .6));
}

.esh-gz .esh-gz-show__podlaha {
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: 26px;
    height: 44px;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(201, 45, 38, .55), rgba(201, 45, 38, .12) 60%, transparent);
    filter: blur(6px);
    pointer-events: none;
}

.esh-gz .esh-gz-show__info {
    position: relative;
    display: grid;
    align-content: center;
    justify-items: start;
    gap: 16px;
    padding: 8px clamp(20px, 3.4vw, 56px) clamp(24px, 3.4vw, 56px);
}

.esh-gz .esh-gz-show__model {
    display: grid;
    color: #fff;
    font-size: clamp(34px, 5vw, 76px);
    font-weight: 800;
    line-height: .98;
    letter-spacing: -.035em;
    text-wrap: balance;
}

.esh-gz .esh-gz-show__znacka {
    margin-bottom: 6px;
    color: #b8b2a7;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .22em;
    line-height: 1.2;
    text-transform: uppercase;
}

.esh-gz .esh-gz-show__prezdivka {
    color: #ffd0a1;
    font-size: clamp(18px, 1.7vw, 24px);
    font-style: italic;
    font-weight: 600;
}

.esh-gz .esh-gz-show__fakta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 26px;
}

.esh-gz .esh-gz-show__fakta div {
    display: grid;
    gap: 2px;
}

.esh-gz .esh-gz-show__fakta dt {
    color: #9d978c;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.esh-gz .esh-gz-show__fakta dd {
    color: #fff;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-show__vin {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    letter-spacing: .06em;
    overflow-wrap: anywhere;
}

.esh-gz .esh-gz-show__km {
    display: grid;
    gap: 8px;
}

.esh-gz .esh-gz-show__km-datum {
    color: #b8b2a7;
    font-size: 13.5px;
}

.esh-gz .esh-gz-show__akce {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
}

.esh-gz .esh-gz-show__akce .esh-gz-tl {
    flex: 1 1 220px;
}

/* SPZ */
.esh-gz .esh-gz-spz {
    display: inline-flex;
    align-items: stretch;
    overflow: hidden;
    border: 2px solid #1b1c1f;
    border-radius: 6px;
    background: #fbfbf8;
    box-shadow: 0 0 0 2px #fbfbf8, 0 10px 20px -10px rgba(0, 0, 0, .8);
}

.esh-gz .esh-gz-spz__eu {
    display: grid;
    place-items: end center;
    width: 24px;
    padding-bottom: 3px;
    color: #fff;
    background: #0a3fa6;
    font-size: 10px;
    font-weight: 800;
}

.esh-gz .esh-gz-spz__text {
    padding: 4px 14px 3px;
    color: #111;
    font-family: "DIN Alternate", "Arial Narrow", Arial, sans-serif;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.2;
    white-space: nowrap;
}

/* Mechanické počítadlo km */
.esh-gz .esh-gz-pocitadlo {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 6px;
    border-radius: 8px;
    background: linear-gradient(180deg, #050505, #1f2023 50%, #050505);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 12px 24px -14px rgba(0, 0, 0, .9);
}

.esh-gz .esh-gz-pocitadlo__valec {
    display: grid;
    place-items: center;
    width: clamp(26px, 3.2vw, 36px);
    height: clamp(38px, 4.4vw, 50px);
    border-radius: 3px;
    color: #f7f3ea;
    background: linear-gradient(180deg, #121214 0%, #34353a 48%, #121214 100%);
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), inset 0 -1px 0 rgba(0, 0, 0, .6);
}

.esh-gz .esh-gz-pocitadlo__valec:nth-child(6) {
    color: #fff;
    background: linear-gradient(180deg, #5a120f 0%, #b52720 48%, #5a120f 100%);
}

.esh-gz .esh-gz-pocitadlo__km {
    padding: 0 6px 0 8px;
    color: #b8b2a7;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
}

/* ---------- Tachometr a připomínky ---------- */

.esh-gz .esh-gz-mrizka {
    display: grid;
    gap: var(--gz-mezera);
    min-width: 0;
}

.esh-gz .esh-gz-tacho-karta {
    --gz-sig: var(--gz-sig-nezname);

    overflow: hidden;
    justify-items: center;
    border-color: #26272b;
    color: #f4f1eb;
    background:
        radial-gradient(70% 55% at 50% 58%, color-mix(in srgb, var(--gz-sig) 24%, transparent), transparent 70%),
        linear-gradient(180deg, #1c1d21 0%, #0f1012 100%);
    isolation: isolate;
}

.esh-gz .esh-gz-tacho-karta--ok { --gz-sig: var(--gz-sig-ok); }
.esh-gz .esh-gz-tacho-karta--brzy { --gz-sig: var(--gz-sig-brzy); }
.esh-gz .esh-gz-tacho-karta--po-terminu { --gz-sig: var(--gz-sig-po); }

.esh-gz .esh-gz-tacho-karta .esh-gz-karta__hlava {
    justify-self: stretch;
}

.esh-gz .esh-gz-tacho-karta .esh-gz-nadtitulek {
    color: #ff8a7f;
}

.esh-gz .esh-gz-tacho-karta .esh-gz-zdroj {
    color: #b8b2a7;
    justify-self: stretch;
}

.esh-gz svg.esh-gz-tacho {
    display: block;
    width: min(100%, 440px);
    height: auto;
    overflow: visible;
    fill: none;
    stroke: none;
}

.esh-gz .esh-gz-tacho__g1 { stop-color: var(--gz-sig-ok); }
.esh-gz .esh-gz-tacho__g2 { stop-color: var(--gz-sig-brzy); }
.esh-gz .esh-gz-tacho__g3 { stop-color: var(--gz-sig-po); }

.esh-gz .esh-gz-tacho__dilek {
    stroke: rgba(255, 255, 255, .28);
    stroke-width: 1.4;
    stroke-linecap: round;
}

.esh-gz .esh-gz-tacho__dilek--hlavni {
    stroke: rgba(255, 255, 255, .7);
    stroke-width: 2.4;
}

.esh-gz .esh-gz-tacho__popisek {
    fill: #9d978c;
    font-size: 10.5px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-tacho__drazka {
    stroke: rgba(255, 255, 255, .09);
    stroke-width: 12;
    stroke-linecap: round;
}

.esh-gz .esh-gz-tacho__drazka--cas {
    stroke-width: 5;
}

.esh-gz .esh-gz-tacho__oblouk {
    stroke-width: 12;
    stroke-linecap: round;
    filter: drop-shadow(0 0 6px color-mix(in srgb, var(--gz-sig) 60%, transparent));
}

.esh-gz .esh-gz-tacho__cas {
    stroke: #d9d2c4;
    stroke-width: 5;
    stroke-linecap: round;
    opacity: .85;
}

.esh-gz .esh-gz-tacho__rucicka path {
    stroke: var(--gz-sig);
    stroke-width: 3.5;
    stroke-linecap: round;
    filter: drop-shadow(0 0 4px var(--gz-sig));
}

.esh-gz .esh-gz-tacho__rucicka circle {
    fill: #f4f1eb;
    stroke: #0f1012;
    stroke-width: 3;
}

.esh-gz .esh-gz-tacho__cislo {
    fill: #fff;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-tacho__jednotka {
    fill: #b8b2a7;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.esh-gz .esh-gz-legenda {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 20px;
    color: #d8d3ca;
    font-size: 13.5px;
    font-weight: 600;
}

.esh-gz .esh-gz-legenda li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.esh-gz .esh-gz-legenda i {
    display: inline-block;
    width: 22px;
    height: 6px;
    border-radius: 3px;
}

.esh-gz .esh-gz-legenda__km {
    background: linear-gradient(90deg, var(--gz-sig-ok), var(--gz-sig-brzy), var(--gz-sig-po));
}

.esh-gz .esh-gz-legenda i.esh-gz-legenda__cas {
    height: 3px;
    background: #d9d2c4;
}

.esh-gz .esh-gz-pripominky {
    display: grid;
    align-content: start;
    gap: 18px;
    min-width: 0;
}

.esh-gz .esh-gz-pripominky__seznam {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: 14px;
}

.esh-gz .esh-gz-pripominka {
    --gz-sig: var(--gz-sig-nezname);

    position: relative;
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid var(--gz-line);
    border-radius: var(--gz-radius);
    background: var(--gz-surface);
    box-shadow: var(--gz-shadow);
}

.esh-gz .esh-gz-pripominka::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: var(--gz-sig);
}

.esh-gz .esh-gz-pripominka--ok { --gz-sig: var(--gz-sig-ok); }
.esh-gz .esh-gz-pripominka--brzy { --gz-sig: var(--gz-sig-brzy); }
.esh-gz .esh-gz-pripominka--po-terminu {
    --gz-sig: var(--gz-sig-po);
    border-color: color-mix(in srgb, var(--gz-sig-po) 45%, var(--gz-line));
    background: linear-gradient(180deg, color-mix(in srgb, var(--gz-sig-po) 7%, var(--gz-surface)), var(--gz-surface) 60%);
}

.esh-gz .esh-gz-pripominka__hlava {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.esh-gz .esh-gz-pripominka__ikona {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--gz-ink);
    background: var(--gz-surface-2);
}

.esh-gz .esh-gz-pripominka__nazev {
    color: inherit;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
}

.esh-gz .esh-gz-pripominka__text {
    color: var(--gz-muted);
    font-size: 14.5px;
}

.esh-gz .esh-gz-pripominka__odpocet {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 14px;
}

.esh-gz svg.esh-gz-krouzek {
    grid-row: 1 / 3;
    width: 76px;
    height: 76px;
    fill: none;
    stroke: none;
}

.esh-gz .esh-gz-krouzek__drazka {
    stroke: var(--gz-surface-2);
    stroke-width: 7;
}

.esh-gz .esh-gz-krouzek__plny {
    stroke: var(--gz-sig-nezname);
    stroke-width: 7;
    stroke-linecap: round;
}

.esh-gz .esh-gz-krouzek--ok .esh-gz-krouzek__plny { stroke: var(--gz-sig-ok); }
.esh-gz .esh-gz-krouzek--brzy .esh-gz-krouzek__plny { stroke: var(--gz-sig-brzy); }
.esh-gz .esh-gz-krouzek--po-terminu .esh-gz-krouzek__plny { stroke: var(--gz-sig-po); }

.esh-gz .esh-gz-pripominka__cislo {
    align-self: end;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px;
    font-size: clamp(34px, 3.4vw, 46px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.03em;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-pripominka__cislo small {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0;
    color: var(--gz-muted);
}

.esh-gz .esh-gz-pripominka__popis {
    align-self: start;
    color: var(--gz-muted);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.esh-gz .esh-gz-pripominka--po-terminu .esh-gz-pripominka__popis {
    color: var(--gz-red-text);
}

.esh-gz .esh-gz-pripominka__radky {
    display: grid;
    gap: 6px;
    padding-top: 12px;
    border-top: 1px solid var(--gz-line);
    font-size: 14px;
}

.esh-gz .esh-gz-pripominka__radky li {
    position: relative;
    padding-left: 16px;
    color: var(--gz-muted);
}

.esh-gz .esh-gz-pripominka__radky li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .62em;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--gz-line-strong);
}

.esh-gz .esh-gz-pripominka__radky strong {
    color: var(--gz-ink);
}

.esh-gz .esh-gz-pripominka__radky li.esh-gz-pripominka__vyhrava {
    color: var(--gz-ink);
}

.esh-gz .esh-gz-pripominka__radky li.esh-gz-pripominka__vyhrava::before {
    background: var(--gz-sig);
}

.esh-gz .esh-gz-pripominka__vyhrava em {
    display: inline-block;
    margin-left: 4px;
    padding: 0 7px;
    border-radius: 999px;
    color: var(--gz-ink);
    background: color-mix(in srgb, var(--gz-sig) 22%, transparent);
    font-size: 11.5px;
    font-style: normal;
    font-weight: 800;
}

.esh-gz .esh-gz-pripominka__pozn {
    display: flex;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--gz-radius-s);
    color: var(--gz-info-text);
    background: var(--gz-info-bg);
    font-size: 13.5px;
}

/* ---------- Servisní historie (časová osa) ---------- */

.esh-gz .esh-gz-historie__soucet {
    display: grid;
    gap: 2px;
    justify-items: start;
}

.esh-gz .esh-gz-historie__soucet span {
    color: var(--gz-muted);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.esh-gz .esh-gz-historie__soucet strong {
    font-size: clamp(24px, 2.4vw, 34px);
    font-weight: 800;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-osa {
    position: relative;
    display: grid;
    gap: 14px;
}

.esh-gz .esh-gz-osa::before {
    content: "";
    position: absolute;
    top: 22px;
    bottom: 22px;
    left: 21px;
    width: 2px;
    background: linear-gradient(180deg, var(--gz-red), var(--gz-line-strong) 30%, var(--gz-line));
}

.esh-gz .esh-gz-osa__polozka {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
}

.esh-gz .esh-gz-osa__bod {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 2px solid var(--gz-line-strong);
    border-radius: 50%;
    color: var(--gz-ink);
    background: var(--gz-surface);
}

.esh-gz .esh-gz-osa__polozka:first-child .esh-gz-osa__bod {
    border-color: var(--gz-red);
    color: #fff;
    background: var(--gz-red);
    box-shadow: 0 0 0 6px var(--gz-red-soft);
}

.esh-gz .esh-gz-osa__polozka--stk .esh-gz-osa__bod {
    border-color: var(--gz-info-text);
}

.esh-gz .esh-gz-osa__obsah {
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid var(--gz-line);
    border-radius: var(--gz-radius);
    background: var(--gz-bg);
}

.esh-gz .esh-gz-osa__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 14px;
    color: var(--gz-muted);
    font-size: 13px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-osa__meta span::before {
    content: "·";
    margin-right: 14px;
}

.esh-gz .esh-gz-osa__nazev {
    color: inherit;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.3;
}

.esh-gz .esh-gz-osa__popis {
    color: var(--gz-muted);
    font-size: 14.5px;
    overflow-wrap: anywhere;
}

.esh-gz .esh-gz-osa__pata {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 12px;
    font-size: 13.5px;
}

.esh-gz .esh-gz-osa__cena {
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-osa__doklad {
    color: var(--gz-muted);
    overflow-wrap: anywhere;
}

.esh-gz .esh-gz-rozbal {
    border-top: 1px solid var(--gz-line);
    padding-top: 14px;
}

.esh-gz .esh-gz-rozbal summary {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}

.esh-gz .esh-gz-rozbal summary::-webkit-details-marker {
    display: none;
}

.esh-gz .esh-gz-rozbal summary svg.esh-gz-ikona {
    padding: 3px;
    border-radius: 50%;
    color: #fff;
    background: var(--gz-red);
    width: 1.5em;
    height: 1.5em;
    transition: transform .25s var(--gz-ease);
}

.esh-gz .esh-gz-rozbal[open] summary svg.esh-gz-ikona {
    transform: rotate(45deg);
}

.esh-gz .esh-gz-rozbal .esh-gz-formular {
    margin-top: 14px;
}

/* ---------- Produkty, které sedí ---------- */

.esh-gz .esh-gz-produkty {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.esh-gz .esh-gz-produkty__mrizka {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.esh-gz .esh-gz-produkt {
    min-width: 0;
}

.esh-gz .esh-gz-produkt__odkaz {
    display: grid;
    gap: 8px;
    height: 100%;
    padding: 10px 10px 14px;
    border: 1px solid var(--gz-line);
    border-radius: var(--gz-radius);
    background: var(--gz-surface);
    text-decoration: none;
    box-shadow: var(--gz-shadow);
    transition: box-shadow .25s var(--gz-ease), transform .25s var(--gz-ease), border-color .25s var(--gz-ease);
}

.esh-gz .esh-gz-produkt__odkaz:hover {
    border-color: var(--gz-line-strong);
    box-shadow: var(--gz-shadow-hover);
}

.esh-gz .esh-gz-produkt__foto {
    display: grid;
    place-items: center;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: var(--gz-radius-s);
    background: #fff;
    color: var(--gz-line-strong);
}

.esh-gz .esh-gz-produkt__foto img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .4s var(--gz-ease);
}

.esh-gz .esh-gz-produkt__foto svg.esh-gz-ikona {
    width: 40%;
    height: 40%;
    stroke-width: 1.2;
}

.esh-gz .esh-gz-produkt__stitky {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.esh-gz .esh-gz-produkt__druh {
    color: var(--gz-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.esh-gz .esh-gz-produkt__nazev {
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.esh-gz .esh-gz-produkt__cena {
    align-self: end;
    font-size: 17px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-produkt__cena s {
    margin-left: 6px;
    color: var(--gz-muted);
    font-size: 13px;
    font-weight: 600;
}

/* ---------- Formuláře ---------- */

.esh-gz .esh-gz-formular {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.esh-gz .esh-gz-formular--mrizka {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

.esh-gz .esh-gz-formular--radek {
    grid-template-columns: minmax(0, 1fr);
    align-items: end;
}

.esh-gz .esh-gz-formular__akce {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    grid-column: 1 / -1;
}

.esh-gz .esh-gz-formular__akce .esh-gz-tl {
    flex: 1 1 200px;
}

.esh-gz .esh-gz-pole {
    display: grid;
    align-content: start;
    gap: 6px;
    min-width: 0;
}

.esh-gz .esh-gz-pole--siroke {
    grid-column: 1 / -1;
}

.esh-gz .esh-gz-pole__popisek {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 8px;
    padding: 0;
    color: var(--gz-ink);
    font-size: 14px;
    font-weight: 800;
}

.esh-gz .esh-gz-pole__nepovinne {
    color: var(--gz-muted);
    font-size: 12px;
    font-weight: 600;
}

.esh-gz .esh-gz-pole__vstup {
    width: 100%;
    min-height: 50px;
    padding: 12px 14px;
    border: 1.5px solid var(--gz-line-strong);
    border-radius: var(--gz-radius-s);
    color: var(--gz-ink);
    background: var(--gz-input-bg);
    font: inherit;
    font-size: 16px;
    transition: border-color .2s var(--gz-ease), box-shadow .2s var(--gz-ease);
}

.esh-gz textarea.esh-gz-pole__vstup {
    min-height: 96px;
    resize: vertical;
}

.esh-gz .esh-gz-pole__vstup:hover {
    border-color: var(--gz-muted);
}

.esh-gz .esh-gz-pole__vstup:focus-visible {
    outline: none;
    border-color: var(--gz-focus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--gz-focus) 28%, transparent);
}

.esh-gz .esh-gz-pole--chyba .esh-gz-pole__vstup {
    border-color: var(--gz-red-text);
}

.esh-gz .esh-gz-pole__napoveda {
    color: var(--gz-muted);
    font-size: 13px;
}

.esh-gz .esh-gz-pole__chyba {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    color: var(--gz-red-text);
    font-size: 13.5px;
    font-weight: 700;
}

.esh-gz .esh-gz-hlaska {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    border-radius: var(--gz-radius-s);
    font-weight: 700;
}

.esh-gz .esh-gz-hlaska--chyba {
    color: var(--gz-red-text);
    background: var(--gz-red-soft);
}

.esh-gz .esh-gz-vin-pocet {
    color: var(--gz-muted);
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.esh-gz .esh-gz-vin-pocet--hotovo {
    color: var(--gz-ok-text);
}

/* Výběr modelu: karty s fotkou, na mobilu vodorovný posun */
.esh-gz .esh-gz-modely {
    display: grid;
    gap: 10px;
}

.esh-gz .esh-gz-modely__seznam {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(150px, 44%);
    gap: 10px;
    overflow-x: auto;
    padding: 4px 4px 12px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
}

.esh-gz .esh-gz-model {
    position: relative;
    scroll-snap-align: start;
    cursor: pointer;
}

.esh-gz .esh-gz-model input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
}

.esh-gz .esh-gz-model__karta {
    position: relative;
    display: grid;
    gap: 2px;
    height: 100%;
    padding: 10px 12px 12px;
    border: 2px solid var(--gz-line);
    border-radius: var(--gz-radius);
    background: var(--gz-surface);
    transition: border-color .2s var(--gz-ease), box-shadow .2s var(--gz-ease), background-color .2s var(--gz-ease);
}

.esh-gz .esh-gz-model__karta img {
    width: 100%;
    aspect-ratio: 14 / 9;
    object-fit: contain;
    margin-bottom: 6px;
}

.esh-gz .esh-gz-model__nazev {
    font-size: 14.5px;
    font-weight: 800;
    line-height: 1.25;
}

.esh-gz .esh-gz-model__kat {
    color: var(--gz-muted);
    font-size: 12px;
    font-weight: 700;
}

.esh-gz .esh-gz-model__fajfka {
    position: absolute;
    top: 8px;
    right: 8px;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #fff;
    background: var(--gz-red);
    opacity: 0;
    transform: scale(.6);
    transition: opacity .2s var(--gz-ease), transform .2s var(--gz-ease);
}

.esh-gz .esh-gz-model:hover .esh-gz-model__karta {
    border-color: var(--gz-line-strong);
}

.esh-gz .esh-gz-model input:checked + .esh-gz-model__karta {
    border-color: var(--gz-red);
    background: var(--gz-red-soft);
    box-shadow: 0 10px 26px -18px var(--gz-red);
}

.esh-gz .esh-gz-model input:checked + .esh-gz-model__karta .esh-gz-model__fajfka {
    opacity: 1;
    transform: scale(1);
}

.esh-gz .esh-gz-model input:focus-visible + .esh-gz-model__karta {
    outline: 3px solid var(--gz-focus);
    outline-offset: 2px;
}

.esh-gz .esh-gz-modely--chyba .esh-gz-modely__seznam {
    border-radius: var(--gz-radius);
    box-shadow: inset 0 0 0 2px var(--gz-red-text);
}

.esh-gz .esh-gz-odebrat {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 14px;
    padding-top: 14px;
    border-top: 1px solid var(--gz-line);
}

.esh-gz .esh-gz-odebrat__pozn {
    color: var(--gz-muted);
    font-size: 13px;
}

.esh-gz .esh-gz-dalsi {
    display: flex;
    justify-content: center;
}

/* ---------- Blok na nástěnce účtu ---------- */

.esh-gz.esh-gz-blok {
    position: relative;
    display: grid;
    gap: 0;
    overflow: hidden;
    min-height: 320px;
    border-radius: var(--gz-radius);
    color: #f4f1eb;
    background: radial-gradient(110% 80% at 70% 0%, #2a2b30 0%, #151619 55%, #0c0c0e 100%);
    box-shadow: var(--gz-shadow);
    isolation: isolate;
}

.esh-gz .esh-gz-blok__scena {
    position: relative;
    display: grid;
    place-items: center;
    padding: 22px 18px 0;
}

.esh-gz .esh-gz-blok__scena::after {
    content: "";
    position: absolute;
    left: 15%;
    right: 15%;
    bottom: 2px;
    height: 26px;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(201, 45, 38, .5), transparent);
    filter: blur(5px);
    z-index: -1;
}

.esh-gz .esh-gz-blok__moto {
    width: min(100%, 460px);
    aspect-ratio: 14 / 9;
    object-fit: contain;
    filter: drop-shadow(0 20px 16px rgba(0, 0, 0, .6));
}

.esh-gz .esh-gz-blok__foto {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: 90% 20%;
    opacity: .5;
}

.esh-gz.esh-gz-blok--prazdny::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(0deg, rgba(12, 12, 14, .96) 0%, rgba(12, 12, 14, .6) 55%, rgba(12, 12, 14, .1) 100%);
}

.esh-gz.esh-gz-blok--prazdny {
    align-content: end;
}

.esh-gz .esh-gz-blok__obsah {
    display: grid;
    justify-items: start;
    gap: 12px;
    padding: 18px clamp(20px, 3vw, 32px) clamp(22px, 3vw, 32px);
}

.esh-gz .esh-gz-blok__nadpis {
    color: #fff;
    font-size: clamp(24px, 2.4vw, 34px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.02em;
}

.esh-gz .esh-gz-blok__model,
.esh-gz .esh-gz-blok__text {
    color: #cfc9be;
}

.esh-gz .esh-gz-blok__pripominka {
    --gz-sig: var(--gz-sig-nezname);

    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px 10px 10px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    background: rgba(255, 255, 255, .05);
}

.esh-gz .esh-gz-blok__pripominka--ok { --gz-sig: var(--gz-sig-ok); }
.esh-gz .esh-gz-blok__pripominka--brzy { --gz-sig: var(--gz-sig-brzy); }
.esh-gz .esh-gz-blok__pripominka--po-terminu { --gz-sig: var(--gz-sig-po); }

.esh-gz .esh-gz-blok__pripominka svg.esh-gz-krouzek {
    width: 46px;
    height: 46px;
}

.esh-gz .esh-gz-blok__pripominka .esh-gz-krouzek__drazka {
    stroke: rgba(255, 255, 255, .12);
}

.esh-gz .esh-gz-blok__pripominka p {
    color: #fff;
    font-size: 14px;
    line-height: 1.35;
}

.esh-gz .esh-gz-blok__pripominka strong {
    font-size: 18px;
    color: var(--gz-sig);
}

.esh-gz .esh-gz-blok__pripominka span {
    color: #cfc9be;
    font-size: 12.5px;
}

/* ---------- Širší obrazovky ---------- */

@media (min-width: 560px) {
    .esh-gz .esh-gz-formular--mrizka {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .esh-gz .esh-gz-formular--radek {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    }

    .esh-gz .esh-gz-formular--radek .esh-gz-formular__akce {
        grid-column: auto;
    }

    .esh-gz .esh-gz-produkty__mrizka {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 16px;
    }

    .esh-gz .esh-gz-modely__seznam {
        grid-auto-columns: minmax(170px, 30%);
    }

    .esh-gz .esh-gz-karta__hlava--radek {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .esh-gz .esh-gz-historie__soucet {
        justify-items: end;
        text-align: right;
    }

    .esh-gz .esh-gz-produkty .esh-gz-karta__hlava--radek .esh-gz-zdroj {
        max-width: 42ch;
    }
}

@media (min-width: 900px) {
    .esh-gz .esh-gz-mrizka {
        grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
        align-items: start;
    }

    .esh-gz .esh-gz-prazdna {
        grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
        align-items: center;
    }

    .esh-gz .esh-gz-prazdna__fotky {
        order: 2;
    }

    .esh-gz.esh-gz-blok:not(.esh-gz-blok--prazdny) {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: center;
    }

    .esh-gz .esh-gz-blok__scena {
        order: 2;
        padding: 24px 24px 24px 0;
    }

    .esh-gz .esh-gz-osa__polozka {
        grid-template-columns: 44px minmax(0, 1fr);
    }
}

@media (min-width: 1024px) {
    .esh-gz .esh-gz-show {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: center;
        min-height: 520px;
    }

    .esh-gz .esh-gz-show__scena {
        min-height: 100%;
        padding: 64px 24px 48px 48px;
    }

    .esh-gz .esh-gz-show__info {
        padding: 48px 56px 48px 8px;
    }

    .esh-gz .esh-gz-show__podlaha {
        bottom: 44px;
    }

    .esh-gz .esh-gz-modely__seznam {
        grid-auto-flow: row;
        grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
        grid-auto-columns: auto;
        overflow: visible;
        scroll-snap-type: none;
    }

    .esh-gz .esh-gz-formular--mrizka {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }
}

@media (min-width: 1600px) {
    .esh-gz .esh-gz-produkty__mrizka {
        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    }

    .esh-gz .esh-gz-osa {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 24px;
    }

    .esh-gz .esh-gz-osa::before {
        display: none;
    }
}

/* ---------- Pohyb: jen když ho uživatel nevypnul ---------- */

@media (prefers-reduced-motion: no-preference) {
    .esh-gz .esh-gz-produkt__odkaz:hover {
        transform: translateY(-3px);
    }

    .esh-gz .esh-gz-produkt__odkaz:hover .esh-gz-produkt__foto img {
        transform: scale(1.05);
    }

    .esh-gz .esh-gz-show__foto {
        animation: esh-gz-prijezd 1.1s var(--gz-ease) both;
    }

    .esh-gz .esh-gz-show__svetlo {
        animation: esh-gz-svetlo 1.6s ease-out both;
    }

    .esh-gz .esh-gz-pocitadlo__valec {
        animation: esh-gz-valec .7s var(--gz-ease) both;
        animation-delay: calc(var(--gz-i, 0) * 70ms + 250ms);
    }

    .esh-gz .esh-gz-prazdna__fotky img {
        animation: esh-gz-prijezd 1s var(--gz-ease) both;
        animation-delay: calc(var(--gz-i, 0) * 140ms);
    }

    .esh-gz .esh-gz-tecka--po-terminu {
        animation: esh-gz-puls 2s ease-in-out infinite;
    }

    /* tachometr a kroužky: s JS nejdřív na nule, po zobrazení (.je-videt) se ručička a oblouky rozjedou */
    .esh-gz.esh-gz-js [data-esh-gz-anim] .esh-gz-tacho__rucicka {
        transform-box: view-box;
        transform-origin: 120px 124px;
        transform: rotate(150deg);
    }

    .esh-gz.esh-gz-js [data-esh-gz-anim] .esh-gz-tacho__oblouk,
    .esh-gz.esh-gz-js [data-esh-gz-anim] .esh-gz-tacho__cas,
    .esh-gz.esh-gz-js [data-esh-gz-anim] .esh-gz-krouzek__plny {
        stroke-dashoffset: var(--gz-p, 0);
    }

    .esh-gz.esh-gz-js [data-esh-gz-anim].je-videt .esh-gz-tacho__rucicka {
        transform: rotate(var(--gz-uhel));
        transition: transform 1.8s cubic-bezier(.34, 1.36, .5, 1) .15s;
    }

    .esh-gz.esh-gz-js [data-esh-gz-anim].je-videt .esh-gz-tacho__oblouk,
    .esh-gz.esh-gz-js [data-esh-gz-anim].je-videt .esh-gz-tacho__cas,
    .esh-gz.esh-gz-js [data-esh-gz-anim].je-videt .esh-gz-krouzek__plny {
        stroke-dashoffset: 0;
        transition: stroke-dashoffset 1.6s var(--gz-ease) .15s;
    }

    .esh-gz.esh-gz-js [data-esh-gz-anim].je-videt .esh-gz-tacho__cas {
        transition-delay: .45s;
    }

    .esh-gz .esh-gz-tacho-karta--po-terminu .esh-gz-tacho__rucicka path {
        animation: esh-gz-puls 1.6s ease-in-out infinite;
    }

    .esh-gz .esh-gz-rozbal[open] .esh-gz-formular {
        animation: esh-gz-vyjet .35s var(--gz-ease) both;
    }

    .esh-gz.esh-gz-js .esh-gz-osa__polozka {
        opacity: 0;
        transform: translateY(14px);
        transition: opacity .6s var(--gz-ease), transform .6s var(--gz-ease);
    }

    .esh-gz.esh-gz-js .je-videt .esh-gz-osa__polozka {
        opacity: 1;
        transform: none;
    }

    .esh-gz.esh-gz-js .je-videt .esh-gz-osa__polozka:nth-child(2) { transition-delay: .08s; }
    .esh-gz.esh-gz-js .je-videt .esh-gz-osa__polozka:nth-child(3) { transition-delay: .16s; }
    .esh-gz.esh-gz-js .je-videt .esh-gz-osa__polozka:nth-child(4) { transition-delay: .24s; }
    .esh-gz.esh-gz-js .je-videt .esh-gz-osa__polozka:nth-child(n + 5) { transition-delay: .32s; }
}

@keyframes esh-gz-prijezd {
    from {
        opacity: 0;
        transform: translateX(-9%) scale(.97);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes esh-gz-svetlo {
    from {
        opacity: 0;
    }

    40% {
        opacity: .5;
    }

    55% {
        opacity: .2;
    }

    to {
        opacity: 1;
    }
}

@keyframes esh-gz-valec {
    from {
        opacity: 0;
        transform: translateY(-40%) rotateX(70deg);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes esh-gz-puls {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: .55;
    }
}

@keyframes esh-gz-vyjet {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* ---------- Tisk ---------- */

@media print {
    .esh-gz .esh-gz-show,
    .esh-gz .esh-gz-tacho-karta,
    .esh-gz.esh-gz-blok {
        color: #000;
        background: none;
    }

    .esh-gz form,
    .esh-gz .esh-gz-rozbal,
    .esh-gz .esh-gz-show__akce,
    .esh-gz .esh-gz-dalsi,
    .esh-gz .esh-gz-prepinac {
        display: none;
    }
}
