/*
Theme Name: Proxterra
Theme URI: https://proxterra.cz
Author: PSWebstyle – Pavel Slavík
Author URI: https://pswebstyle.com
Description: Téma pro technologickou platformu Proxterra (VIP-VISION s.r.o.) – prospekční technologie pro lokalizaci a klasifikaci akumulací nerostných surovin.
Version: 2.0.0
License: GNU General Public License v2 or later
Text Domain: proxterra
*/

/* ================================================================== *
 *  1. PALETA
 *  Barvy jsou odečtené přímo z loga, které dodal klient: navy štít,
 *  azurová a zelená v symbolu. Každý aplikační modul má vlastní barvu
 *  podle své varianty loga.
 * ================================================================== */

:root {
    --navy:        #0A1425;
    --navy-hlub:   #050A14;
    --navy-2:      #0F1B30;
    --navy-3:      #16243C;

    --azur:        #3FD6E8;   /* na světlém pozadí – ztmaveno z #0C7BAE kvůli kontrastu na pískové */
    --azur-sv:     #3DA4D7;   /* na tmavém pozadí */
    --zelena:      #5CC22E;   /* na světlém pozadí */
    --zelena-sv:   #5CC22E;   /* na tmavém pozadí */

    --bila:        #050A14;
    --pisek:       #0A1425;
    --pisek-2:     #0F1B30;

    --text:        #EEF2F5;
    --text-tlum:   #A9B8C6;
    --text-sv:     #EEF2F5;
    --text-sv-tlum:#A9B8C6;

    --ram:         rgba(238, 242, 245, .14);
    --ram-tma:     rgba(238, 242, 245, .16);

    /* aplikační moduly – z modulových variant loga */
    /* -tma = na světlém pozadí, -sv = na tmavém. Žlutá ORE a azurová WATER
       jsou dost světlé samy o sobě, hnědá OIL-GAS a růžová DIAMONDS ne. */
    --ore:         #FBD01A;
    --ore-tma:     #FBD01A;
    --ore-sv:      #FBD01A;
    --oilgas:      #F0922B;
    --oilgas-tma:  #F0922B;
    --oilgas-sv:   #F0922B;
    --water:       #3DA4D7;
    --water-tma:   #3DA4D7;
    --water-sv:    #3DA4D7;
    --diamonds:    #D9598E;
    --diamonds-tma:#A82A5F;
    --diamonds-sv: #E58AB2;


    /* tmavý vzhled 2026 */
    --pozadi:      #050A14;
    --pozadi-2:    #0A1425;
    --panel:       rgba(255, 255, 255, .035);
    --panel-2:     rgba(255, 255, 255, .06);
    --ram-sv:      rgba(238, 242, 245, .28);
    --zluta:       #FBD01A;
    --cyan:        #3FD6E8;
    --tlum:        #A9B8C6;
    --tlum-2:      #7F8FA0;
    --nav-vyska:   78px;
    --nav-celkem:  78px;

    --wrap:        1240px;
    --radius:      14px;
    --radius-s:    8px;

    /* Kombinaci vybral klient: serif na značku a nadpisy, sans na vše ostatní.
       --pismo-popisek je tentýž sans, jen se používá na drobné popisky,
       kde vždy jde ruku v ruce s vyšší vahou a prostrkáním. */
    --pismo:        'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --pismo-nadpis: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --pismo-popisek:'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* barva modulu se propíše z body třídy – karty, štítky i akcenty
   pak stačí stylovat jednou přes var(--modul) */
.page-ore      { --modul: var(--ore);      --modul-tma: var(--ore-tma);      --modul-sv: var(--ore-sv); }
.page-oil-gas  { --modul: var(--oilgas);   --modul-tma: var(--oilgas-tma);   --modul-sv: var(--oilgas-sv); }
.page-water    { --modul: var(--water);    --modul-tma: var(--water-tma);    --modul-sv: var(--water-sv); }
.page-diamonds { --modul: var(--diamonds); --modul-tma: var(--diamonds-tma); --modul-sv: var(--diamonds-sv); }

*,
*::before,
*::after {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

html {
    margin-top: 0 !important;
    scroll-behavior: smooth;
}

#site-header,
.site-header { display: none !important; }

body {
    margin: 0;
    background: var(--bila);
    color: var(--text);
    font-family: var(--pismo);
    font-size: 17px;
    line-height: 1.72;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--azur); text-decoration: none; }

h1, h2, h3 {
    margin: 0 0 .55em;
    font-family: var(--pismo-nadpis);
    line-height: 1.2;
    font-weight: 600;
    /* serif snese menší záporné prostrkání než grotesk */
    letter-spacing: -.006em;
    color: var(--navy);
}
h1 { font-size: clamp(2rem, 4.2vw, 3.1rem); }
h2 { font-size: clamp(1.55rem, 2.8vw, 2.2rem); }
h3 { font-size: clamp(1.06rem, 1.5vw, 1.22rem); letter-spacing: 0; }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

.wrap {
    width: 100%;
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 40px);
}

.preskocit {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 1200;
    background: var(--azur);
    color: #fff;
    padding: 12px 20px;
    font-weight: 500;
    border-radius: 0 0 var(--radius-s) 0;
}
.preskocit:focus { left: 0; }
:focus-visible { outline: 2px solid var(--azur); outline-offset: 3px; }

/* ================================================================== *
 *  2. DROBNÉ PRVKY
 * ================================================================== */

.eyebrow {
    display: block;
    font-family: var(--pismo-popisek);
    font-size: .72rem;
    font-weight: 500;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--azur);
    margin: 0 0 1.1em;
}
.section--tma .eyebrow,
.section--hlub .eyebrow { color: var(--azur-sv); }

.lead {
    font-size: clamp(1.04rem, 1.5vw, 1.24rem);
    line-height: 1.66;
    font-weight: 400;
    color: var(--text-tlum);
    max-width: 66ch;
}
.section--tma .lead,
.section--hlub .lead { color: var(--text-sv-tlum); }

.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 30px;
    border-radius: 50px;
    font-size: .96rem;
    font-weight: 600;
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform .25s ease, background-color .25s ease, border-color .25s ease, color .25s ease;
}
.btn:hover { transform: translateY(-2px); }

.btn--primary { background: var(--azur); color: #fff !important; }
.btn--primary:hover { background: #085C82; }

.btn--ghost { border-color: var(--ram); color: var(--navy) !important; }
.btn--ghost:hover { border-color: var(--azur); color: var(--azur) !important; }

.section--tma .btn--ghost,
.section--hlub .btn--ghost {
    border-color: var(--ram-tma);
    color: var(--text-sv) !important;
    background: rgba(255, 255, 255, .04);
}
.section--tma .btn--ghost:hover,
.section--hlub .btn--ghost:hover { border-color: var(--azur-sv); color: var(--azur-sv) !important; }

.tlacitka { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }

/* ================================================================== *
 *  5. SEKCE
 * ================================================================== */

.section { padding: clamp(70px, 8.5vw, 122px) 0; position: relative; }
.section--bila  { background: var(--bila); }
.section--pisek { background: var(--pisek); }
.section--tma   { background: var(--navy); color: var(--text-sv); }
.section--hlub  { background: var(--navy-hlub); color: var(--text-sv); }

.section--tma h1, .section--tma h2, .section--tma h3,
.section--hlub h1, .section--hlub h2, .section--hlub h3 { color: var(--text-sv); }
.section--tma p, .section--hlub p { color: var(--text-sv-tlum); }

/* jemná mřížka pod tmavými sekcemi – odkaz na datovou povahu oboru */
.section--hlub::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(61, 164, 215, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(61, 164, 215, .06) 1px, transparent 1px);
    background-size: 68px 68px;
    pointer-events: none;
}
.section--hlub > .wrap { position: relative; z-index: 1; }

.section__hlava { max-width: 62rem; margin-bottom: clamp(40px, 5vw, 64px); }

.duo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 68px);
    align-items: center;
}
.duo--obraceny .duo__obraz { order: -1; }
.duo__obraz { position: relative; border-radius: var(--radius); overflow: hidden; }
.duo__popisek {
    position: absolute;
    left: 14px; right: 14px; bottom: 14px;
    font-family: var(--pismo-popisek);
    font-size: .66rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-sv);
    background: rgba(15, 26, 40, .82);
    padding: 7px 11px;
    border-radius: var(--radius-s);
}

.mrizka { display: grid; gap: 22px; }
.mrizka--2 { grid-template-columns: repeat(2, 1fr); }
.mrizka--3 { grid-template-columns: repeat(3, 1fr); }
.mrizka--4 { grid-template-columns: repeat(4, 1fr); }

.karta {
    background: var(--bila);
    border: 1px solid var(--ram);
    border-radius: var(--radius);
    padding: 30px 28px;
    transition: border-color .28s ease, transform .28s ease, box-shadow .28s ease;
}
.karta:hover {
    border-color: var(--azur);
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgba(15, 26, 40, .08);
}
.karta h3 { margin-bottom: .5em; }
.karta p { color: var(--text-tlum); font-size: .96rem; margin: 0; }

.section--tma .karta,
.section--hlub .karta { background: var(--navy-2); border-color: var(--ram-tma); }
.section--tma .karta p,
.section--hlub .karta p { color: var(--text-sv-tlum); }
.section--tma .karta:hover,
.section--hlub .karta:hover { border-color: var(--azur-sv); box-shadow: none; }

.karta__cislo {
    display: block;
    font-family: var(--pismo-popisek);
    font-size: .74rem;
    font-weight: 500;
    letter-spacing: .14em;
    color: var(--azur);
    margin-bottom: 16px;
}
.section--tma .karta__cislo,
.section--hlub .karta__cislo { color: var(--azur-sv); }

/* ================================================================== *
 *  6. VRSTVENÝ OBSAH
 *  Zadání staví na postupu „stručná charakteristika → hlubší text".
 *  Na desktopu ji naznačí hover, otevírá se ale klikem – jinak by
 *  obsah nebyl dostupný z klávesnice ani z dotykového displeje.
 * ================================================================== */

.vrstva {
    border: 1px solid var(--ram);
    border-radius: var(--radius);
    margin-bottom: 14px;
    background: var(--bila);
    overflow: hidden;
    transition: border-color .25s ease;
}
.vrstva:hover { border-color: var(--azur); }
.section--tma .vrstva,
.section--hlub .vrstva { background: var(--navy-2); border-color: var(--ram-tma); }

.vrstva__hlava {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    font-family: var(--pismo-nadpis);
    font-size: 1.06rem;
    font-weight: 600;
    color: var(--navy);
}
.section--tma .vrstva__hlava,
.section--hlub .vrstva__hlava { color: var(--text-sv); }

.vrstva__popis {
    display: block;
    font-size: .9rem;
    font-weight: 400;
    color: var(--text-tlum);
    margin-top: 5px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .3s ease, opacity .3s ease, margin .3s ease;
}
.vrstva:hover .vrstva__popis,
.vrstva.je-otevrena .vrstva__popis { max-height: 6em; opacity: 1; }
.section--tma .vrstva__popis,
.section--hlub .vrstva__popis { color: var(--text-sv-tlum); }

.vrstva__ikona {
    flex: 0 0 auto;
    width: 26px; height: 26px;
    border-radius: 50%;
    border: 1px solid var(--azur);
    color: var(--azur);
    display: grid;
    place-items: center;
    font-size: .9rem;
    transition: transform .3s ease, background-color .25s ease, color .25s ease;
}
.vrstva.je-otevrena .vrstva__ikona {
    transform: rotate(45deg);
    background: var(--azur);
    color: #fff;
}

.vrstva__telo { display: none; padding: 0 26px 26px; }
.vrstva.je-otevrena .vrstva__telo { display: block; }
.vrstva__telo .vrstva__podnadpis {
    font-size: .78rem;
    font-family: var(--pismo-popisek);
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--azur);
    margin: 22px 0 10px;
}
.section--tma .vrstva__telo .vrstva__podnadpis,
.section--hlub .vrstva__telo .vrstva__podnadpis { color: var(--azur-sv); }
.vrstva__telo > .vrstva__podnadpis:first-child { margin-top: 0; }

/* ================================================================== *
 *  7. MÍSTO K DOPLNĚNÍ
 *  Návrh je osnova; odborný obsah dodá klient. Značka je záměrně
 *  viditelná, aby bylo zřejmé, co ještě chybí, a nešlo si ji splést
 *  s hotovým textem.
 * ================================================================== */

.doplnit {
    border: 1px dashed rgba(12, 123, 174, .5);
    border-radius: var(--radius-s);
    background: rgba(12, 123, 174, .05);
    padding: 18px 20px;
    margin: 0 0 18px;
}
.doplnit__stitek {
    display: inline-block;
    font-family: var(--pismo-popisek);
    font-size: .63rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--azur);
    margin-bottom: 8px;
}
.doplnit p { font-size: .95rem; color: var(--text-tlum); margin: 0; }
.doplnit__rozsah { font-size: .85rem !important; opacity: .8; margin-top: 6px !important; }

.section--tma .doplnit,
.section--hlub .doplnit {
    border-color: rgba(61, 164, 215, .45);
    background: rgba(61, 164, 215, .07);
}
.section--tma .doplnit__stitek,
.section--hlub .doplnit__stitek { color: var(--azur-sv); }
.section--tma .doplnit p,
.section--hlub .doplnit p { color: var(--text-sv-tlum); }

/* ================================================================== *
 *  8. MODULY
 * ================================================================== */

.modul {
    display: block;
    border: 1px solid var(--ram);
    border-radius: var(--radius);
    padding: 30px 28px;
    background: var(--bila);
    border-top: 3px solid var(--barva, var(--azur));
    transition: transform .28s ease, box-shadow .28s ease;
}
.modul:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(15, 26, 40, .1); }
.modul__nazev {
    font-family: var(--pismo-nadpis);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--navy);
    margin: 0 0 .5em;
}
.modul p { color: var(--text-tlum); font-size: .95rem; margin: 0 0 1em; }
.modul__vice {
    font-family: var(--pismo-popisek);
    font-size: .72rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--barva-tma, var(--azur));
}

.section--tma .modul,
.section--hlub .modul { background: var(--navy-2); border-color: var(--ram-tma); border-top-color: var(--barva, var(--azur-sv)); }
.section--tma .modul__nazev,
.section--hlub .modul__nazev { color: var(--text-sv); }
.section--tma .modul p,
.section--hlub .modul p { color: var(--text-sv-tlum); }
.section--tma .modul__vice,
.section--hlub .modul__vice { color: var(--barva, var(--azur-sv)); }

/* hlavička stránky modulu – barva se bere z body třídy */
.modul-hlava { border-bottom: 3px solid var(--modul, var(--azur)); }
.modul-znacka {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-family: var(--pismo-popisek);
    font-size: .72rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--modul-tma, var(--azur));
    margin-bottom: 1.2em;
}
/* Na tmavém pozadí musí i označení modulu přejít na světlou variantu –
   tmavá hnědá OIL-GAS by na navy nebyla čitelná. */
.section--tma .modul-znacka,
.section--hlub .modul-znacka { color: var(--modul-sv, var(--azur-sv)); }

.modul-znacka::before {
    content: '';
    width: 11px; height: 11px;
    border-radius: 50%;
    background: var(--modul, var(--azur));
}

/* ================================================================== *
 *  9. SCHÉMA KONSTRUKCE PLATFORMY
 * ================================================================== */

.schema { display: grid; gap: 12px; counter-reset: krok; }
.schema__krok {
    display: grid;
    grid-template-columns: 62px 1fr;
    gap: 20px;
    align-items: center;
    padding: 20px 24px;
    border: 1px solid var(--ram-tma);
    border-radius: var(--radius);
    background: var(--navy-2);
    position: relative;
}
.schema__cislo {
    font-family: var(--pismo-popisek);
    font-size: .8rem;
    letter-spacing: .1em;
    /* světlejší než --azur-sv: karta schématu má pozadí --navy-2,
       na kterém azurová těsně nesplňuje potřebný kontrast */
    color: #4FB0DE;
}
.schema__krok h3 { margin: 0; font-size: 1.02rem; color: var(--text-sv); }
.schema__krok p { margin: 4px 0 0; font-size: .92rem; color: var(--text-sv-tlum); }
/* spojnice mezi kroky */
.schema__krok:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 52px;
    bottom: -12px;
    width: 1px;
    height: 12px;
    background: var(--azur-sv);
    opacity: .5;
}

/* tři paralelní vývojové osy */
.osy { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.osa { border: 1px solid var(--ram); border-radius: var(--radius); padding: 26px 24px; background: var(--bila); }
.osa h3 { font-size: .96rem; margin-bottom: 1.2em; }
.osa__body { list-style: none; margin: 0; padding: 0; }
.osa__body li {
    position: relative;
    padding: 0 0 22px 26px;
    font-size: .94rem;
    color: var(--text-tlum);
}
.osa__body li::before {
    content: '';
    position: absolute;
    left: 3px; top: .55em;
    width: 9px; height: 9px;
    border-radius: 50%;
    background: var(--azur);
}
.osa__body li:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 7px; top: 1.5em;
    width: 1px;
    bottom: 4px;
    background: var(--ram);
}
.osa__body li:last-child { padding-bottom: 0; }
.osa__body li:last-child::before { background: var(--zelena); }

/* ================================================================== *
 *  10. PROJEKTY
 * ================================================================== */

.filtr {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 34px;
}
.filtr__btn {
    font-family: var(--pismo-popisek);
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 10px 20px;
    border: 1px solid var(--ram);
    border-radius: 50px;
    background: transparent;
    color: var(--text-tlum);
    cursor: pointer;
    transition: border-color .22s ease, color .22s ease, background-color .22s ease;
}
.filtr__btn:hover { border-color: var(--azur); color: var(--azur); }
.filtr__btn.je-aktivni {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}

/* filtr skrývá celé řádky tabulky */
.projekt[hidden] { display: none; }

/* ================================================================== *
 *  10b. TABULKA PROJEKTŮ
 *  Čtyřicet projektů se čte líp v tabulce než v kartách; filtr skrývá
 *  celé řádky, takže hlavička zůstává na místě.
 * ================================================================== */

.skryte {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* na úzkém displeji se tabulka posouvá sama v sobě, stránka ne */
.tabulka-obal {
    overflow-x: auto;
    border: 1px solid var(--ram);
    border-radius: var(--radius);
}

.tabulka {
    width: 100%;
    border-collapse: collapse;
    font-size: .95rem;
    min-width: 640px;
}

.tabulka thead th {
    text-align: left;
    font-family: var(--pismo-popisek);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--text-tlum);
    padding: 16px 20px;
    background: var(--pisek);
    border-bottom: 1px solid var(--ram);
    white-space: nowrap;
}

.tabulka tbody th,
.tabulka tbody td {
    padding: 14px 20px;
    border-bottom: 1px solid var(--ram);
    vertical-align: top;
    text-align: left;
    font-weight: 400;
    color: var(--text-tlum);
}

.tabulka tbody th {
    font-family: var(--pismo-nadpis);
    font-weight: 600;
    color: var(--navy);
    /* barevný proužek drží vazbu řádku na modul i po odfiltrování */
    border-left: 3px solid var(--barva, transparent);
}

.tabulka tbody tr:last-child th,
.tabulka tbody tr:last-child td { border-bottom: 0; }
.tabulka tbody tr:hover th,
.tabulka tbody tr:hover td { background: var(--pisek); }

.znacka-druh {
    display: inline-block;
    margin-left: 8px;
    font-family: var(--pismo-popisek);
    font-size: .6rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-tlum);
    border: 1px solid var(--ram);
    border-radius: 3px;
    padding: 2px 6px;
    vertical-align: middle;
}

.tabulka__modul {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: var(--pismo-popisek);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    white-space: nowrap;
}
.tabulka__modul::before {
    content: '';
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--barva, var(--azur));
}

.filtr__cislo {
    display: inline-block;
    margin-left: 7px;
    opacity: .6;
    font-size: .9em;
}

.filtr__pocet {
    font-family: var(--pismo-popisek);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--azur);
}

/* ------------------------------ čísla ---------------------------- */

.cisla {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: var(--ram-tma);
    border: 1px solid var(--ram-tma);
    border-radius: var(--radius);
    overflow: hidden;
}
.cislo { background: var(--navy-hlub); padding: 24px 22px; }
.cislo b {
    display: block;
    font-family: var(--pismo-nadpis);
    font-size: clamp(1.7rem, 3vw, 2.3rem);
    font-weight: 700;
    color: var(--azur-sv);
    line-height: 1.1;
    margin-bottom: 6px;
}
.cislo span {
    font-family: var(--pismo-popisek);
    font-size: .74rem;
    font-weight: 500;
    letter-spacing: .06em;
    color: var(--text-sv-tlum);
}
.section--bila .cisla,
.section--pisek .cisla { background: var(--ram); border-color: var(--ram); }
.section--bila .cislo,
.section--pisek .cislo { background: var(--bila); }
.section--bila .cislo b,
.section--pisek .cislo b { color: var(--azur); }
.section--bila .cislo span,
.section--pisek .cislo span { color: var(--text-tlum); }

@media (max-width: 620px) {
    .cisla { grid-template-columns: 1fr; }
}

/* ================================================================== *
 *  11. KONTAKT
 * ================================================================== */

.kontakt { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(32px, 5vw, 60px); align-items: start; }

.formular { display: grid; gap: 16px; }
.pole { display: grid; gap: 7px; }
.pole--dvojice { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pole label {
    font-family: var(--pismo-popisek);
    font-size: .69rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--text-tlum);
}
.pole input,
.pole textarea,
.pole select {
    width: 100%;
    padding: 13px 15px;
    background: var(--bila);
    border: 1px solid var(--ram);
    border-radius: var(--radius-s);
    color: var(--text);
    font-family: var(--pismo);
    font-size: .97rem;
}
.pole textarea { min-height: 130px; resize: vertical; }
.pole input:focus, .pole textarea:focus, .pole select:focus { border-color: var(--azur); outline: none; }

.zajem { display: flex; flex-wrap: wrap; gap: 9px; }
.zajem label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border: 1px solid var(--ram);
    border-radius: 50px;
    font-family: var(--pismo-popisek);
    font-size: .72rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    color: var(--text-tlum);
    transition: border-color .2s ease, color .2s ease;
}
.zajem label:hover { border-color: var(--azur); color: var(--azur); }
.zajem input { accent-color: var(--azur); }

.formular__gdpr {
    margin: 4px 0 0;
    font-size: .85rem;
    color: var(--text-tlum);
    line-height: 1.6;
}
.formular__gdpr a { color: var(--azur); font-weight: 600; }

/* ---- Contact Form 7 -------------------------------------------------
 * Formulář vykresluje plugin, ale vypadat má stejně jako zbytek webu.
 * Plugin obaluje každé pole vlastním prvkem, který by rozbil mřížku,
 * a odesílacímu tlačítku dává stejnou třídu jako textovým polím – bez
 * pravidel níž by bylo bílé na bílém.
 * ------------------------------------------------------------------ */

.wpcf7-form { display: grid; gap: 16px; }
.wpcf7-form p { margin: 0; }
.pole .wpcf7-form-control-wrap { display: block; }

.wpcf7-form input.wpcf7-submit {
    justify-self: start;
    padding: 15px 30px;
    border: none;
    border-radius: 50px;
    background: var(--azur);
    color: #fff;
    font-family: var(--pismo);
    font-size: .96rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}
.wpcf7-form input.wpcf7-submit:hover { background: #085C82; transform: translateY(-2px); }

/* Přepínače oblasti zájmu – plugin je balí do vlastních prvků.
   Názvy se nesmí lámat, jinak jsou přepínače každý jinak vysoký. */
.zajem .wpcf7-list-item { margin: 0; }
.zajem .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 9px; }
.zajem label { white-space: nowrap; }

/* Hlášky o chybách a o výsledku odeslání */
.wpcf7-not-valid-tip {
    margin-top: 5px;
    font-size: .82rem;
    color: #B3261E;
}
.wpcf7-form input.wpcf7-not-valid,
.wpcf7-form textarea.wpcf7-not-valid { border-color: #B3261E; }
.wpcf7-response-output {
    margin: 4px 0 0 !important;
    padding: 13px 16px !important;
    border-width: 1px !important;
    border-radius: var(--radius-s);
    font-size: .9rem;
    line-height: 1.55;
}
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--zelena) !important; color: var(--zelena); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: #B3261E !important; color: #B3261E; }
.wpcf7-spinner { margin: 0 0 0 12px; }

.kontakt__blok {
    border: 1px solid var(--ram);
    border-radius: var(--radius);
    padding: 30px 28px;
    background: var(--pisek);
}
.kontakt__blok dl { margin: 0; }
.kontakt__radek {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 13px 0;
    border-bottom: 1px solid var(--ram);
    font-size: .96rem;
}
.kontakt__radek:last-child { border-bottom: 0; }
.kontakt__radek dt {
    margin: 0;
    font-family: var(--pismo-popisek);
    font-size: .68rem;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--text-tlum);
    padding-top: .3em;
}
.kontakt__radek dd { margin: 0; text-align: right; }

/* ================================================================== *
 *  12. PATIČKA
 * ================================================================== */

.footer {
    background: var(--navy-hlub);
    color: var(--text-sv-tlum);
    padding: clamp(50px, 6vw, 74px) 0 28px;
    font-size: .93rem;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr;
    gap: clamp(28px, 4vw, 54px);
    margin-bottom: 42px;
}
.footer__logo { height: 42px; width: auto; margin-bottom: 18px; }
.footer__nadpis {
    font-family: var(--pismo-popisek);
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--text-sv);
    margin: 0 0 16px;
}
.footer ul { list-style: none; margin: 0; padding: 0; }
.footer li { margin-bottom: 9px; }
.footer a { color: var(--text-sv-tlum); }
.footer a:hover { color: var(--azur-sv); }
.footer__spodek {
    border-top: 1px solid var(--ram-tma);
    padding-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 26px;
    justify-content: space-between;
    align-items: center;
    font-size: .85rem;
}
.footer__spodek a { color: var(--azur-sv); font-weight: 500; }

/* ================================================================== *
 *  13. ANIMACE PŘI SCROLLU
 * ================================================================== */

html.js .anim {
    opacity: 0;
    transform: translateY(20px);
    animation: px-odkryt 0s linear 1.6s forwards;   /* pojistka bez pozorovatele */
}
html.js .anim.je-videt {
    opacity: 1;
    transform: none;
    transition: opacity .7s ease, transform .7s ease;
    animation: none;
}
@keyframes px-odkryt { to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
    html.js .anim { opacity: 1; transform: none; animation: none; }
    html { scroll-behavior: auto; }
    .brana__data { transition: none; }
}

/* ================================================================== *
 *  14. RESPONZIVITA
 * ================================================================== */

@media (max-width: 1080px) {
    .mrizka--4 { grid-template-columns: repeat(2, 1fr); }
    .osy { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
    .nav__menu, .nav__jazyk { display: none !important; }
    .hamburger { display: block; }

    .duo { grid-template-columns: 1fr; }
    .duo--obraceny .duo__obraz { order: 0; }
    .mrizka--2, .mrizka--3 { grid-template-columns: 1fr; }
    .kontakt { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer__spodek { justify-content: flex-start; }

    .brana { min-height: 100svh; padding: 100px 0 60px; }
    .brana__vrstva { text-align: left; }
}

/* nižší displeje (notebooky) – po odkrytí vrstvy jinak vyteče tlačítko */
@media (max-height: 860px) {
    .brana.je-cteno .brana__nazev { font-size: clamp(2.2rem, 6vw, 4rem); }
    .brana.je-cteno .brana__slogan { font-size: clamp(1rem, 1.8vw, 1.25rem); margin-bottom: 1.1em; }
    .brana.je-cteno .brana__uvod { font-size: .92rem; }
    .brana.je-cteno .brana__vrstva p { font-size: .88rem; margin-bottom: .65em; }
}

@media (max-width: 620px) {
    body { font-size: 16px; }
    .mrizka--4 { grid-template-columns: 1fr; }
    .pole--dvojice { grid-template-columns: 1fr; }
    .schema__krok { grid-template-columns: 1fr; gap: 8px; padding: 18px 20px; }
    .schema__krok:not(:last-child)::after { left: 50%; }
    .kontakt__radek { flex-direction: column; gap: 4px; }
    .kontakt__radek dd { text-align: left; }
    .btn { width: 100%; justify-content: center; }
    .tlacitka { flex-direction: column; }
}

/* ------------------------------------------------------------------ *
 *  Tři základní myšlenky ve druhé vrstvě brány
 *  Klient je v nové struktuře pojmenoval, takže dostaly vlastní popisek
 *  – čte se to rychleji než tři odstavce za sebou.
 * ------------------------------------------------------------------ */
.myslenka { margin-bottom: 16px; }
.myslenka:last-child { margin-bottom: 0; }
.myslenka__stitek {
    display: block;
    font-family: var(--pismo-popisek);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--azur-sv);
    margin-bottom: 5px;
}
.myslenka p {
    font-size: .93rem;
    line-height: 1.6;
    margin: 0;
    color: var(--text-sv-tlum);
    border-left: 2px solid rgba(61, 164, 215, .45);
    padding-left: 16px;
}
@media (max-height: 860px) {
    .brana.je-cteno .myslenka { margin-bottom: 11px; }
    .brana.je-cteno .myslenka p { font-size: .87rem; }
}

/* ================================================================== *
 *  DOSLOVNÉ TEXTOVÉ BLOKY (tema/proxterra/texty/*.html)
 *  Obsah z dokumentů klienta 1:1 – styl jen sází, nezasahuje do textu.
 * ================================================================== */

.prose { max-width: 78ch; }
.prose p { color: var(--text-tlum); }
.section--tma .prose p,
.section--hlub .prose p { color: var(--text-sv-tlum); }
.section--tma .prose li,
.section--hlub .prose li,
.section--tma li,
.section--hlub li { color: var(--text-sv-tlum); }
.prose .osa__body { margin: 0 0 1.15em; }
.prose .osa__body li { padding-bottom: 12px; }

.podnadpis {
    font-family: var(--pismo-nadpis);
    font-size: 1.06rem;
    font-weight: 600;
    color: var(--navy);
    margin: 1.7em 0 .55em;
}
.section--tma .podnadpis,
.section--hlub .podnadpis { color: var(--text-sv); }

.podnadpis--oddil {
    font-size: .82rem;
    font-family: var(--pismo-popisek);
    font-weight: 600;
    letter-spacing: .16em;
    color: var(--azur);
    border-top: 1px solid var(--ram);
    padding-top: 1.6em;
    margin-top: 2.4em;
}
.section--tma .podnadpis--oddil,
.section--hlub .podnadpis--oddil { color: var(--azur-sv); border-top-color: var(--ram-tma); }
.prose > .podnadpis:first-child,
.prose > .podnadpis--oddil:first-child { margin-top: 0; border-top: 0; padding-top: 0; }

.schema-radek {
    font-family: var(--pismo-popisek);
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .08em;
    color: var(--azur);
    background: rgba(10, 110, 156, .06);
    border-left: 3px solid var(--azur);
    border-radius: 0 var(--radius-s) var(--radius-s) 0;
    padding: 12px 16px;
    margin: 0 0 1.15em;
}
.section--tma .schema-radek,
.section--hlub .schema-radek {
    color: var(--azur-sv);
    background: rgba(61, 164, 215, .08);
    border-left-color: var(--azur-sv);
}

/* vrstva s doslovným blokem uvnitř */
.vrstva__telo .podnadpis { font-size: 1rem; }
.vrstva__telo .podnadpis--oddil { font-size: .78rem; }


/* ================================================================== *
 *  NAVIGACE A HERO – tmavý vzhled 2026 (z navrh-upgrade/styl.css)
 * ================================================================== */

/* hvězdné pozadí celého webu – dvě vrstvy drobných bodů, jemně se posouvají */
.hvezdy {
    position: fixed; inset: 0; z-index: 0; pointer-events: none;
    background:
        radial-gradient(1px 1px at 12% 18%, rgba(255,255,255,.55) 50%, transparent 51%),
        radial-gradient(1px 1px at 68% 9%,  rgba(255,255,255,.45) 50%, transparent 51%),
        radial-gradient(1.5px 1.5px at 84% 32%, rgba(255,255,255,.6) 50%, transparent 51%),
        radial-gradient(1px 1px at 37% 54%, rgba(255,255,255,.4) 50%, transparent 51%),
        radial-gradient(1px 1px at 91% 71%, rgba(255,255,255,.5) 50%, transparent 51%),
        radial-gradient(1.5px 1.5px at 24% 82%, rgba(255,255,255,.45) 50%, transparent 51%),
        radial-gradient(1px 1px at 55% 88%, rgba(255,255,255,.35) 50%, transparent 51%),
        radial-gradient(1px 1px at 46% 27%, rgba(255,255,255,.35) 50%, transparent 51%),
        radial-gradient(1px 1px at 76% 58%, rgba(255,255,255,.4) 50%, transparent 51%),
        radial-gradient(1px 1px at 5% 63%, rgba(255,255,255,.4) 50%, transparent 51%);
    background-size: 900px 700px;
    opacity: .5;
}
main, .footer, .nav, .mobil-menu { position: relative; z-index: 1; }

/* ==================================================================
   NAVIGACE – hlavní lišta
   Podle dohody s klientem: v sekci (Technologie, modul) se lišta
   přepne na „menu sekce" s tlačítkem zpět – stejný princip jako
   sportsgames.cz. Na úvodu má každá hlavní položka řádek podmenu,
   který se vysune pod lištu (návrh klienta).
   ================================================================== */
.nav {
    position: fixed; inset: 0 0 auto 0; z-index: 1000;
    background: linear-gradient(180deg, rgba(5,10,20,.92), rgba(5,10,20,.72));
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--ram);
}
body.admin-bar .nav { top: 32px; }
.nav__in {
    display: flex; align-items: center; justify-content: space-between; gap: 22px;
    min-height: var(--nav-vyska);
}
.nav__znacka { display: flex; align-items: center; gap: 18px; min-width: 0; }
.logo { display: flex; align-items: center; flex: 0 0 auto; }
.logo img { height: 40px; width: auto; }
.nav__slogan, .nav__sekce {
    padding-left: 18px; border-left: 1px solid var(--ram-sv);
    font-size: .95rem; color: var(--tlum); white-space: nowrap;
}
.nav__sekce { color: var(--text); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; font-size: .82rem; }
.nav__sekce b { color: var(--modul, var(--zluta)); font-weight: 600; }

.nav__menu { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
.nav__menu > li { position: relative; display: flex; align-items: center; padding-bottom: 20px; margin-bottom: -20px; }
/* svislé oddělovače mezi položkami – jako v návrhu klienta */
.nav__menu > li + li::before { content: ''; width: 1px; height: 16px; background: var(--ram-sv); margin: 0 18px; }
.nav__menu a {
    color: var(--text) !important;
    font-size: .8rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
    padding: 6px 0; position: relative; transition: color .22s ease; white-space: nowrap;
}
.nav__menu a:hover, .nav__menu a.je-aktivni { color: var(--zluta) !important; }
.nav__menu a.je-aktivni::after,
.nav__menu a:hover::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: var(--zluta);
}
.nav__zpet {
    display: inline-flex; align-items: center; gap: 8px;
    color: var(--text) !important; font-size: .8rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
    padding: 7px 16px 7px 12px; border: 1px solid var(--ram-sv); border-radius: 999px; white-space: nowrap;
    transition: border-color .22s ease, color .22s ease, background-color .22s ease;
}
.nav__zpet:hover { border-color: var(--zluta); color: var(--zluta) !important; background: rgba(251, 208, 26, .06); }
.nav__zpet span[aria-hidden] { font-size: 1.05em; transition: transform .22s ease; }
.nav__zpet:hover span[aria-hidden] { transform: translateX(-3px); }

/* řádek podmenu pod lištou (rozbalí se najetím) */
.nav__radek {
    position: fixed; left: 0; right: 0; top: var(--nav-vyska);
    display: flex; justify-content: center; flex-wrap: wrap; gap: 0 4px;
    padding: 0 20px;
    list-style: none; margin: 0;
    background: rgba(5, 10, 20, .86);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--ram);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
}
.nav__menu > li:hover .nav__radek,
.nav__menu > li:focus-within .nav__radek { opacity: 1; visibility: visible; transform: translateY(0); }
.nav__radek li { display: flex; align-items: center; }
.nav__radek li + li::before { content: ''; width: 1px; height: 14px; background: var(--ram-sv); margin: 0 16px; }
.nav__radek a { padding: 15px 0 13px; font-size: .74rem; }
.nav__radek a:hover::after { bottom: 8px; }
.nav__tecka { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: 1px; }

.nav__prava { display: flex; align-items: center; gap: 22px; }
.nav__jazyk {
    display: flex; align-items: center; gap: 6px;
    font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text);
    padding-left: 22px; border-left: 1px solid var(--ram-sv);
}
.nav__jazyk .nedostupny { color: var(--tlum-2); cursor: default; }
.nav__jazyk .sipka { font-size: .7em; color: var(--tlum); margin-left: 2px; }

/* druhá lišta v sekci: položky sekce, aktivní žlutě podtržená */
.nav__sekce-radek {
    border-top: 1px solid var(--ram);
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0 4px;
    min-height: var(--radek-vyska); list-style: none; margin: 0; padding: 0;
}
.nav__sekce-radek li { display: flex; align-items: center; }
.nav__sekce-radek li + li::before { content: ''; width: 1px; height: 14px; background: var(--ram-sv); margin: 0 16px; }
.nav__sekce-radek a {
    color: var(--text) !important; font-size: .74rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
    padding: 15px 0 13px; position: relative; white-space: nowrap; transition: color .22s ease;
}
.nav__sekce-radek a:hover, .nav__sekce-radek a.je-aktivni { color: var(--zluta) !important; }
.nav__sekce-radek a.je-aktivni::after,
.nav__sekce-radek a:hover::after { content: ''; position: absolute; left: 0; right: 0; bottom: 8px; height: 2px; background: var(--zluta); }
/* přepínač modulů v levé části řádku */
.nav__moduly { display: flex; align-items: center; gap: 6px; margin-right: 28px; padding-right: 28px; border-right: 1px solid var(--ram-sv); }
.nav__moduly a {
    display: inline-flex; align-items: center; gap: 8px;
    color: var(--tlum) !important; font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
    padding: 5px 12px; border-radius: 999px; border: 1px solid transparent; transition: all .22s ease;
}
.nav__moduly a:hover { color: var(--text) !important; border-color: var(--ram-sv); }
.nav__moduly a.je-aktivni { color: #111 !important; background: var(--barva); border-color: var(--barva); }
.nav__moduly a.je-aktivni::after, .nav__moduly a:hover::after { display: none; }
.nav__moduly .nav__tecka { margin: 0; }
.nav__moduly a.je-aktivni .nav__tecka { background: #111 !important; }

body { --nav-celkem: var(--nav-vyska); }

/* v sekci je vše v JEDNOM řádku: logo · název sekce | ← Proxterra | položky sekce | CZ */
.nav--sekce .nav__in { max-width: 1440px; gap: 28px; }
.nav__menu--sekce > li + li::before { margin: 0 16px; height: 26px; }
.nav__menu--sekce > li.bez-oddelovace + li::before,
.nav__menu--sekce > li.bez-oddelovace::before { display: none; }
.nav__menu--sekce > li.bez-oddelovace { margin-right: 22px; }
/* dvouslovné položky se lámou pod sebe – menu je pak o polovinu kratší */
.nav__menu--sekce a:not(.nav__zpet) { font-size: .72rem; letter-spacing: .09em; white-space: normal; width: min-content; text-align: center; line-height: 1.3; padding: 4px 0; }
.nav__menu--sekce a.je-aktivni::after, .nav__menu--sekce a:hover::after { bottom: -5px; }
.nav__menu--sekce .nav__zpet { font-size: .7rem; padding: 6px 13px 6px 10px; }
.nav__menu--sekce .nav__zpet::after { display: none; }
.nav--sekce .nav__sekce { font-size: .74rem; letter-spacing: .12em; padding-left: 14px; }
.nav--sekce .nav__jazyk { padding-left: 14px; }
/* přepínač modulů: název sekce rozbalí řádek s moduly */
.nav__znacka .nav__menu > li { padding-bottom: 20px; margin-bottom: -20px; }

/* hamburger */
.hamburger {
    display: none; width: 46px; height: 46px; padding: 0;
    border: 1px solid var(--ram-sv); border-radius: 50%; background: transparent; cursor: pointer;
    position: relative; z-index: 1002;
}
.hamburger span { position: absolute; left: 50%; top: 50%; height: 1.5px; background: var(--text); border-radius: 2px; transition: transform .32s ease, opacity .2s ease, width .32s ease; }
.hamburger span:nth-child(1) { width: 20px; transform: translate(-50%, -6px); }
.hamburger span:nth-child(2) { width: 13px; transform: translate(-50%, 0); }
.hamburger span:nth-child(3) { width: 20px; transform: translate(-50%, 6px); }
.hamburger.je-otevreny span:nth-child(1) { transform: translate(-50%, 0) rotate(45deg); }
.hamburger.je-otevreny span:nth-child(2) { opacity: 0; width: 0; }
.hamburger.je-otevreny span:nth-child(3) { transform: translate(-50%, 0) rotate(-45deg); }

/* mobilní overlay – sourozenec .nav (nav má backdrop-filter) */
.mobil-menu {
    position: fixed; inset: 0; z-index: 999; background: var(--pozadi);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    opacity: 0; visibility: hidden; overflow-y: auto; padding: 90px 20px 40px;
    transition: opacity .3s ease, visibility .3s ease;
}
.mobil-menu.je-otevrene { opacity: 1; visibility: visible; }
.mobil-menu a {
    display: block; color: var(--text) !important; background: transparent !important;
    font-family: var(--pismo-nadpis); font-weight: 600; font-size: clamp(1.4rem, 5.5vw, 1.9rem);
    padding: 9px 20px; text-align: center;
}
.mobil-menu a:hover, .mobil-menu a.je-aktivni { color: var(--zluta) !important; }
.mobil-menu .mobil-zpet { font-family: var(--pismo); font-size: 1rem; letter-spacing: .1em; text-transform: uppercase; color: var(--zluta) !important; margin-bottom: 14px; }
.m-acc__hlava {
    display: flex; align-items: center; justify-content: center; gap: 12px; cursor: pointer;
    color: var(--text); font-family: var(--pismo-nadpis); font-weight: 600; font-size: clamp(1.4rem, 5.5vw, 1.9rem); padding: 9px 20px;
}
.m-acc__ikona { font-size: .8em; color: var(--zluta); transition: transform .3s ease; }
.m-acc.je-otevreny .m-acc__ikona { transform: rotate(45deg); }
.m-acc__telo { display: none; padding: 4px 0 12px; }
.m-acc.je-otevreny .m-acc__telo { display: block; }
.m-acc__telo a { display: block; font-family: var(--pismo); font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; padding: 8px 20px; color: var(--tlum) !important; }
.mobil-menu__jazyk { margin-top: 22px; display: flex; gap: 10px; align-items: center; font-size: .9rem; letter-spacing: .1em; }
.mobil-menu__jazyk .nedostupny { color: var(--tlum-2); }
nav a:not(.btn), .mobil-menu a:not(.btn) { background: transparent !important; }

/* ==================================================================
   HERO S OTÁČEJÍCÍ SE ZEMĚKOULÍ
   Zeměkoule kreslí WebGL (globus.js). Když WebGL neběží, zůstane
   statické pozadí z návrhu klienta.
   ================================================================== */
.hero {
    position: relative; min-height: 100vh; min-height: 100svh;
    display: flex; align-items: center; overflow: hidden;
    background: var(--pozadi);
    padding: calc(var(--nav-celkem) + 40px) 0 90px;
}
.hero--pod { min-height: 72vh; min-height: 72svh; background-position: right bottom; align-items: flex-end; padding-bottom: 70px; }
.hero__globus { position: absolute; inset: 0; z-index: 0; opacity: 0; transition: opacity 1.4s ease; }
/* Statický obrázek jen tam, kde 3D zeměkoule nepoběží (bez JS, bez WebGL).
   Při běžném načítání je vidět jen tmavé hvězdné pozadí a zeměkoule do něj
   plynule najede – jinak obrázek problikl jako „jiný web". */
html:not(.js) .hero, .hero.bez-webgl { background: var(--pozadi) url('img/hero-zaloha.jpg') left bottom / cover no-repeat; }
html:not(.js) .hero--pod, .hero--pod.bez-webgl { background-position: right bottom; }
.hero.je-nacteno .hero__globus { opacity: 1; }
.hero__globus canvas { display: block; width: 100%; height: 100%; }
/* mlhovina vpravo nahoře – jemný barevný závoj přes hvězdy */
.hero__mlha {
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
        radial-gradient(60% 45% at 82% 22%, rgba(61, 164, 215, .16), transparent 70%),
        radial-gradient(40% 30% at 70% 40%, rgba(245, 162, 75, .07), transparent 70%);
}
.hero__obsah { position: relative; z-index: 2; width: 100%; }
.hero__mrizka { display: grid; grid-template-columns: 38% 1fr; align-items: center; }
.hero__text { text-align: center; max-width: 42rem; margin: 0 auto; padding: 0 20px; }
.hero__stitek {
    display: block; font-size: .78rem; letter-spacing: .42em; text-transform: uppercase; color: var(--tlum);
    margin-bottom: 10px; padding-left: .42em;
}
.hero__nazev { font-size: clamp(3rem, 6.4vw, 5.2rem); letter-spacing: .06em; margin: 0 0 .1em; line-height: 1.05; font-weight: 700; }
.hero__slogan { font-size: clamp(1.3rem, 2.3vw, 1.85rem); color: var(--cyan); font-weight: 500; line-height: 1.3; margin: 0 0 24px; }
.hero__slogan span { display: block; }
.linka { width: 54px; height: 3px; background: var(--zluta); margin: 0 auto 28px; border-radius: 2px; }
.linka--vlevo { margin-left: 0; }
.hero__text p:not(.hero__slogan) { color: var(--text); font-size: 1.05rem; line-height: 1.65; }

/* indikátor „Objevte více" – vždy na střed, text + myš */
.hero__dal {
    position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 3;
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    color: var(--tlum) !important; font-size: .72rem; letter-spacing: .28em; text-transform: uppercase; padding-left: .28em;
}
.hero__dal:hover { color: var(--text) !important; }
.hero__mys { width: 22px; height: 34px; border: 1.5px solid var(--tlum); border-radius: 12px; position: relative; }
.hero__mys::after {
    content: ''; position: absolute; left: 50%; top: 7px; width: 3px; height: 7px; margin-left: -1.5px;
    background: var(--zluta); border-radius: 2px; animation: mys 1.8s ease-in-out infinite;
}
@keyframes mys { 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(11px); opacity: 0; } 100% { transform: translateY(0); opacity: 0; } }

/* hero podstránky: text vlevo, zeměkoule vpravo dole (návrh klienta) */
.hero--pod .hero__text { text-align: left; margin: 0; max-width: 46rem; padding: 0; }
.hero--pod .hero__stitek { padding-left: 0; }
.hero--pod .linka { margin-left: 0; }
.hero--pod h1 { font-size: clamp(2.1rem, 4vw, 3.2rem); }
.hero--pod .lead { color: var(--tlum); }

/* hero modulu – fotka vespod (návrh klienta), nahoře přechod do tmy */
/* fotka je jen pás úplně dole (Pavel: text jen na tmavém pozadí) */
.hero--modul { min-height: 0; align-items: flex-start; background: none; padding-bottom: 40vh; }
.hero--modul .hero__foto { position: absolute; left: 0; right: 0; bottom: 0; height: 38vh; z-index: 0; background: var(--pozadi) center bottom / cover no-repeat; }
.hero--modul .hero__foto::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(5,10,20,1) 0%, rgba(5,10,20,.75) 28%, rgba(5,10,20,.2) 60%, rgba(5,10,20,0) 100%);
}
.hero--modul .hero__mrizka { grid-template-columns: 1fr 320px; gap: 60px; align-items: start; }
.hero--modul .hero__text { text-align: left; margin: 0; max-width: 56rem; padding: 0; }
.hero--modul .linka { margin-left: 0; margin-bottom: 18px; }
.hero--modul h1 { font-size: clamp(2.4rem, 4.6vw, 3.6rem); margin-bottom: .15em; }
.hero--modul h1 b { color: var(--modul); font-weight: 700; }
.hero--modul .hero__podtitul { font-size: clamp(1.15rem, 1.8vw, 1.45rem); color: var(--text); font-weight: 500; margin-bottom: 22px; }
.hero--modul p { color: var(--text); font-size: 1.02rem; }
.hero__citat { border-left: 1px solid var(--ram-sv); padding-left: 26px; margin-top: 58px; }
.hero__citat p:first-child { font-family: var(--pismo-nadpis); font-style: italic; font-size: 1.32rem; line-height: 1.3; color: var(--modul); margin-bottom: 16px; }
.hero__citat p { color: var(--tlum); font-size: .98rem; }
.drobky { font-size: .8rem; letter-spacing: .04em; color: var(--tlum); margin-bottom: 26px; }
.drobky a { color: var(--tlum); }
.drobky b { color: var(--modul); font-weight: 500; }
.drobky span { margin: 0 8px; color: var(--tlum-2); }
.hero--modul .hero__proces { position: relative; z-index: 2; margin-top: 48px; }

/* proces SAT › G+M › SGY › CÍL – z návrhu klienta (OIL-GAS), tady obecně */
.proces { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; text-align: center; }
.proces__krok { position: relative; padding: 0 10px; }
.proces__krok + .proces__krok::before { content: '›'; position: absolute; left: -16px; top: 2px; color: var(--zluta); font-size: 1.7rem; line-height: 1; }
.proces__nazev { font-family: var(--pismo-nadpis); font-weight: 600; font-size: 1.25rem; display: block; }
.proces__pod { display: block; font-size: .85rem; color: var(--tlum); padding-bottom: 8px; border-bottom: 2px solid var(--zluta); margin: 0 auto 12px; width: fit-content; }
.proces p { font-size: .9rem; color: var(--text); }

/* dlaždice modulů – vizuály klienta, nic se do nich nedopisuje */
.dlazdice { display: block; position: relative; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--ram); transition: transform .3s ease, border-color .3s ease; }
.dlazdice img { width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .6s ease; }
.dlazdice:hover { transform: translateY(-4px); border-color: var(--barva); }
.dlazdice:hover img { transform: scale(1.04); }
.dlazdice__vice {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 22px;
    background: linear-gradient(180deg, transparent, rgba(5,10,20,.85));
    font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--text); font-weight: 600;
}
.dlazdice__vice::after { content: ' ›'; color: var(--barva); }

/* ================================================================== *
 *  TMAVÝ VZHLED 2026 – ÚPRAVY STARÝCH KOMPONENT
 *
 *  Web je celý tmavý (návrhy klienta ze září 2026). Paleta v :root je
 *  přepnutá tak, že „světlé" sekce jsou teď tmavé; tady se dorovnává
 *  to, co paleta sama nevyřeší – hlavně místa, kde stará barva --navy
 *  sloužila zároveň jako barva textu i pozadí.
 *  Soubor skládá generator/sestav-styl.py, needitovat ve style.css.
 * ================================================================== */

body { background: var(--pozadi); color: var(--text); }
h1, h2, h3 { color: var(--text-sv); }
a { color: var(--cyan); }
:focus-visible { outline-color: var(--zluta); }

.section { border-top: 1px solid var(--ram); }
.section--bila  { background: transparent; }
.section--pisek { background: rgba(10, 20, 37, .82); }
.section--tma   { background: transparent; }
.section--hlub  { background: rgba(10, 20, 37, .82); }
main > .section:first-child, main > section:first-child { border-top: 0; }

.eyebrow,
.section--tma .eyebrow, .section--hlub .eyebrow { color: var(--zluta); font-weight: 600; }
.lead, .section--tma .lead, .section--hlub .lead { color: var(--tlum); }

.btn--primary { background: var(--zluta); color: #111 !important; }
.btn--primary:hover { background: #fff; }
.btn--ghost,
.section--tma .btn--ghost, .section--hlub .btn--ghost { border-color: var(--ram-sv); color: var(--text-sv) !important; background: transparent; }
.btn--ghost:hover,
.section--tma .btn--ghost:hover, .section--hlub .btn--ghost:hover { border-color: var(--zluta); color: var(--zluta) !important; }

.karta, .section--tma .karta, .section--hlub .karta,
.vrstva, .section--tma .vrstva, .section--hlub .vrstva,
.modul, .section--tma .modul, .section--hlub .modul,
.osa { background: var(--panel); border-color: var(--ram); }
.karta:hover, .section--tma .karta:hover, .section--hlub .karta:hover { border-color: rgba(251, 208, 26, .55); background: var(--panel-2); box-shadow: none; }
.vrstva:hover { border-color: rgba(251, 208, 26, .5); }
.modul { border-top-color: var(--barva, var(--zluta)); }
.modul:hover { box-shadow: none; background: var(--panel-2); }
.karta__cislo, .section--tma .karta__cislo, .section--hlub .karta__cislo { color: var(--zluta); font-weight: 600; }
.vrstva__hlava, .modul__nazev { color: var(--text-sv); }
.vrstva__ikona { border-color: var(--zluta); color: var(--zluta); }
.vrstva.je-otevrena .vrstva__ikona { background: var(--zluta); color: #111; }
.vrstva__telo { color: var(--tlum); }
.vrstva__telo .vrstva__podnadpis,
.prose .podnadpis { color: var(--cyan); }
.prose .podnadpis--oddil { color: var(--zluta); }
.modul__vice { color: var(--barva, var(--zluta)); }

.schema__krok { background: var(--panel); border-color: var(--ram); }
.schema__cislo { color: var(--zluta); }
.schema__krok:not(:last-child)::after { background: var(--zluta); }
.schema-radek { color: var(--cyan); }
.osa__body li::before { background: var(--zluta); }
.osa__body li:last-child::before { background: var(--cyan); }

.filtr__btn { color: var(--tlum); border-color: var(--ram-sv); }
.filtr__btn:hover { border-color: var(--zluta); color: var(--zluta); }
.filtr__btn.je-aktivni { background: var(--zluta); border-color: var(--zluta); color: #111; }
.filtr__pocet { color: var(--zluta); }
.tabulka-obal { background: var(--panel); }
.tabulka thead th { background: rgba(255, 255, 255, .06); color: var(--text-sv); }
.tabulka tbody th { color: var(--text-sv); }
.tabulka tbody tr:hover th, .tabulka tbody tr:hover td { background: rgba(255, 255, 255, .05); }
.cisla, .section--bila .cisla, .section--pisek .cisla { background: var(--ram); border-color: var(--ram); }
.cislo, .section--bila .cislo, .section--pisek .cislo { background: #070E1C; }
.cislo b, .section--bila .cislo b, .section--pisek .cislo b { color: var(--zluta); }

.pole input, .pole textarea, .pole select { background: rgba(255, 255, 255, .05); border-color: var(--ram-sv); color: var(--text-sv); }
.pole input:focus, .pole textarea:focus, .pole select:focus { border-color: var(--zluta); }
.pole select option { background: #0A1425; color: var(--text-sv); }
.zajem label:hover { border-color: var(--zluta); color: var(--zluta); }
.zajem input { accent-color: var(--zluta); }
.formular__gdpr a { color: var(--cyan); }
.wpcf7-form input.wpcf7-submit { background: var(--zluta); color: #111; }
.wpcf7-form input.wpcf7-submit:hover { background: #fff; }
.wpcf7-not-valid-tip { color: #FF9A8F; }
.wpcf7-form input.wpcf7-not-valid, .wpcf7-form textarea.wpcf7-not-valid { border-color: #FF9A8F; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output { border-color: #FF9A8F !important; color: #FF9A8F; }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--zelena-sv) !important; color: var(--zelena-sv); }
.kontakt__blok { background: var(--panel); }

.doplnit { border-color: rgba(63, 214, 232, .45); background: rgba(63, 214, 232, .06); }
.doplnit__stitek { color: var(--cyan); }

.footer { background: #030710; border-top: 1px solid var(--ram); }
.footer a { font-weight: 600; }
.footer a:hover, .footer__spodek a { color: var(--zluta); }

/* hlavička podstránky: první tmavá sekce pod fixní lištou */
.modul-hlava { border-bottom: 0; }
.modul-znacka, .section--tma .modul-znacka, .section--hlub .modul-znacka { color: var(--modul, var(--zluta)); }

/* moduly ORE a OIL–GAS: fotka jen jako pás úplně dole, text na tmavém */
.page-ore .modul-hlava, .page-oil-gas .modul-hlava { position: relative; padding-bottom: calc(34vh + 40px) !important; overflow: hidden; }
.page-ore .modul-hlava::after, .page-oil-gas .modul-hlava::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 36vh; z-index: 0;
    background: center bottom / cover no-repeat;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 40%);
            mask-image: linear-gradient(180deg, transparent 0%, #000 40%);
}
.page-ore .modul-hlava::after { background-image: url('img/ore-pozadi.jpg'); }
.page-oil-gas .modul-hlava::after { background-image: url('img/oil-pozadi.jpg'); }
.modul-hlava > .wrap { position: relative; z-index: 1; }

/* tři základní myšlenky pod hero titulky */
.myslenky { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.myslenky .myslenka { margin: 0; background: var(--panel); border: 1px solid var(--ram); border-radius: var(--radius); padding: 26px 24px; }
.myslenky .myslenka__stitek { color: var(--zluta); margin-bottom: 12px; line-height: 1.5; }
.myslenky .myslenka p { border-left: 0; padding-left: 0; color: var(--tlum); }
.uvod-webu { max-width: 62rem; margin: 0 0 clamp(30px, 4vw, 48px); }
@media (max-width: 900px) { .myslenky { grid-template-columns: 1fr; } }

/* horní index modulu: ProxterraWATER – bez mezery, velkými písmeny (pravidlo klienta) */
.ix {
    font-size: .74em; line-height: 0; vertical-align: .42em;
    font-weight: 600; letter-spacing: .03em; text-transform: uppercase; margin-left: .05em;
    font-family: var(--pismo);
}
h1 .ix, h2 .ix { font-size: .52em; vertical-align: .72em; font-weight: 500; }

/* lišta WordPressu nad naší navigací */
body.admin-bar .nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar .nav { top: 46px; } }

/* šipka je už v textu pole („Zobrazit řešení ›") */
.dlazdice__vice::after { content: none; }
/* kotvy z menu sekce nesmí skončit pod fixní lištou */
section[id], div[id].prose { scroll-margin-top: 92px; }

/* dlaždice modulů: celý vizuál klienta bez ořezu, popisek pod obrázkem */
.dlazdice { background: #02060E; display: flex; flex-direction: column; }
.dlazdice img { aspect-ratio: 1 / 1; object-fit: contain; background: #02060E; }
.dlazdice__vice { position: static; background: none; border-top: 1px solid var(--ram); padding: 13px 20px; }

/* ================================================================== *
 *  NAVIGACE – SVISLÉ ROZBALOVACÍ MENU (přání klienta 2. 11. 2026)
 *
 *  Technologie ▾ a Moduly ▾ rozbalí NAJETÍM myši klasický svislý seznam
 *  (.nav__pod); položka s pokračováním (Teoretická báze, modul) vysune
 *  vedle sebe druhý seznam (.nav__pod2). Vodorovné řádky pod lištou jsou
 *  pryč – braly výšku textu. Zavírá se se zpožděním 0,3 s (visibility
 *  v transition), přejezd myší tedy menu neshodí. Dotyk: .je-otevrene
 *  z assets/main.js. Klávesnice: :focus-visible.
 * ================================================================== */
.nav__roz {
    background: none; border: 0; cursor: pointer; margin: 0;
    color: var(--text); font: inherit; font-size: .8rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
    padding: 6px 0; position: relative; white-space: nowrap; transition: color .22s ease;
    display: inline-flex; align-items: center; gap: 6px;
}
.nav__roz .sipka { font-size: .7em; color: var(--tlum); transition: transform .22s ease; }
.nav__roz:hover, .nav__roz.je-aktivni, .nav__roz[aria-expanded="true"] { color: var(--zluta); }
.nav__roz.je-aktivni::after, .nav__roz[aria-expanded="true"]::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: var(--zluta);
}
.nav__roz[aria-expanded="true"] .sipka { transform: rotate(180deg); color: var(--zluta); }
.ma-pod:hover > .nav__roz { color: var(--zluta); }
.ma-pod:hover > .nav__roz .sipka { transform: rotate(180deg); color: var(--zluta); }

.nav__pod, .nav__pod2 {
    position: absolute; z-index: 5; list-style: none; margin: 0; padding: 6px 0;
    min-width: 230px;
    /* neprůhledné – pod ním je text části */
    background: #070E1C;
    border: 1px solid var(--ram-sv); border-radius: 4px;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .45);
    opacity: 0; visibility: hidden; transform: translateY(-4px);
    transition: opacity .18s ease .3s, transform .18s ease .3s, visibility 0s linear .48s;
}
.nav__pod { top: 100%; left: -18px; }
/* most přes mezeru mezi lištou a menu, ať myš cestou nic nezavře */
.nav__pod::before { content: ''; position: absolute; left: 0; right: 0; top: -22px; height: 22px; }
.nav__pod2 { top: -7px; left: 100%; margin-left: 2px; }
.nav__pod2::before { content: ''; position: absolute; top: 0; bottom: 0; left: -10px; width: 10px; }
.ma-pod2.vlevo > .nav__pod2 { left: auto; right: 100%; margin: 0 2px 0 0; }
.ma-pod2.vlevo > .nav__pod2::before { left: auto; right: -10px; }

.ma-pod:hover > .nav__pod, .ma-pod:has(:focus-visible) > .nav__pod, .nav__pod.je-otevrene,
.ma-pod2:hover > .nav__pod2, .ma-pod2:has(:focus-visible) > .nav__pod2, .ma-pod2.je-otevrene > .nav__pod2 {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity .18s ease, transform .18s ease, visibility 0s;
}
.nav__menu .nav__pod li { position: relative; display: block; }
.nav__menu .nav__pod a {
    display: flex; align-items: center; gap: 10px; justify-content: space-between;
    padding: 10px 20px; font-size: .74rem; line-height: 1.35; white-space: nowrap;
    color: var(--text) !important;
}
.nav__menu .nav__pod a:hover, .nav__menu .nav__pod a.je-aktivni,
/* barvu modulu nese jen tečka – hnědá ROPA–PLYN by na tmavém podkladu nebyla čitelná */
.nav__menu .ma-pod2:hover > a { color: var(--zluta) !important; background: rgba(255, 255, 255, .04) !important; }
.nav__menu .nav__pod a::after, .nav__menu .nav__pod a:hover::after, .nav__menu .nav__pod a.je-aktivni::after { display: none; }
.nav__pod .sip { margin-left: auto; font-size: 1.2em; line-height: 1; color: var(--tlum); }
.nav__pod .ma-pod2:hover > a .sip { color: inherit; }
.nav__pod .nav__tecka { flex: 0 0 auto; margin-right: 0; }
.nav__pod--moduly > .ma-pod2 > a { justify-content: flex-start; }
.nav__pod-prehled { border-top: 1px solid var(--ram); margin-top: 6px; padding-top: 6px; }
.nav__menu .nav__pod .nav__prehled { font-weight: 400; color: var(--tlum) !important; letter-spacing: .06em; text-transform: none; font-size: .8rem; }
.nav__tecka { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: 1px; }
.page-water .nav__pod, .page-water .nav__pod2 { background: #061E5C; border-color: rgba(255, 255, 255, .22); }

/* ---------- mobilní menu: čitelné, od shora, nic se neztratí za horní hranou ---------- */
.mobil-menu { justify-content: flex-start; padding: calc(var(--nav-vyska) + 16px) 20px 40px; }
.mobil-menu__in { width: 100%; max-width: 30rem; margin: auto; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.mobil-menu a { font-size: clamp(1.35rem, 5vw, 1.75rem); padding: 8px 20px; }
.m-acc__hlava { font-size: clamp(1.35rem, 5vw, 1.75rem); padding: 8px 20px; }
.m-acc__telo a {
    font-family: var(--pismo); font-size: 1.05rem; font-weight: 400; letter-spacing: 0; text-transform: none;
    padding: 7px 20px; color: var(--text) !important;
}
.mobil-menu__sekce { font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; color: var(--cyan); margin: 0 0 6px; }
.mobil-menu__cast {
    font-family: var(--pismo) !important; font-size: 1.05rem !important; font-weight: 400 !important;
    letter-spacing: 0; text-transform: none; padding: 6px 20px !important; color: var(--text) !important;
}
.mobil-menu__cast.je-aktivni { color: var(--cyan) !important; }
.mobil-menu__cara { width: 42%; border: 0; border-top: 1px solid var(--ram-sv); margin: 14px auto 12px; }
body.admin-bar .mobil-menu { padding-top: calc(var(--nav-vyska) + 62px); }

/* tým na Kontaktu – zkrácené karty, detail je na stránce Tým */
.kontakt-tym { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 18px; }
.kontakt-tym__clen {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
    padding: 26px 18px 22px; border: 1px solid var(--ram); border-radius: var(--radius); background: var(--panel);
    color: var(--text) !important; transition: border-color .25s ease, transform .25s ease, background-color .25s ease;
}
.kontakt-tym__clen:hover { border-color: var(--cyan); background: var(--panel-2); transform: translateY(-3px); }
.kontakt-tym__clen img, .kontakt-tym__silueta {
    width: 96px; height: 96px; border-radius: 50%; object-fit: cover; object-position: top;
    display: grid; place-items: center; background: rgba(255, 255, 255, .06); border: 2px solid var(--ram-sv); margin-bottom: 8px;
}
.kontakt-tym__silueta svg { width: 54%; fill: rgba(238, 242, 245, .35); }
.kontakt-tym__clen b { font-family: var(--pismo-nadpis); font-size: 1.02rem; line-height: 1.25; }
.kontakt-tym__clen span { font-size: .84rem; color: var(--cyan); line-height: 1.35; }

/* rozpohybované dlaždice modulů – video se chová jako obrázek */
.dlazdice video, .kmodul video { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; background: #02060E; }
@media (prefers-reduced-motion: reduce) { .dlazdice video, .kmodul video { display: none; } }

/* ==================================================================
   TITULKA – protokol klienta 30. 9. 2026
   Bezpatkový název PROXTERRA s tyrkysovým X (kontinuita s X-Vision), menší
   a vzdušnější textový blok, štítek užší než název (opticky vycentrovaný),
   slogan: 1. řádek tyrkysový, 2. bílý; vysvětlující text větší v lehčím
   řezu 300; navigace a značka o kousek větší na velkých monitorech.
   ================================================================== */
.hero__nazev {
    font-family: var(--pismo); font-weight: 600; text-transform: uppercase;
    font-size: clamp(2.5rem, 4.6vw, 3.9rem); letter-spacing: .12em; line-height: 1.05;
    margin: 0 0 .22em; padding-left: .12em;   /* letter-spacing za posledním písmenem – optický střed */
}
.hero__nazev .x, .logo__text .x { color: var(--cyan); }
.hero__stitek {
    font-size: clamp(.68rem, 1.2vw, .98rem); letter-spacing: .36em; padding-left: .36em;
    margin-bottom: 16px; color: var(--tlum);
}
.hero__slogan { font-size: clamp(1.12rem, 1.75vw, 1.45rem); font-weight: 500; line-height: 1.4; margin: 0 0 28px; }
.hero__slogan span + span { color: var(--text); }
.hero__text { max-width: 46rem; }
.hero__text .linka { margin-bottom: 34px; }
.hero__text p:not(.hero__slogan) {
    font-size: clamp(1.05rem, 1.02vw, 1.24rem); font-weight: 300; line-height: 1.8; margin: 0 0 1.3em;
}
@media (max-width: 640px) {
    .hero__nazev { letter-spacing: .06em; padding-left: .06em; }
    .hero__stitek { letter-spacing: .26em; padding-left: .26em; }
    .hero__text p:not(.hero__slogan) { font-weight: 400; }   /* na malém displeji je 300 příliš tenké */
}

/* značka v liště: znak + PROXTERRA s barevným X (bod 7 protokolu) */
.logo { gap: 12px; }
.logo img { height: 42px; }
.logo__text {
    font-family: var(--pismo); font-weight: 600; font-size: 1.28rem; letter-spacing: .13em;
    text-transform: uppercase; color: var(--text); line-height: 1; white-space: nowrap; padding-top: .08em;
}
@media (min-width: 1400px) {
    .nav__menu a, .nav__roz { font-size: .9rem; }
    .nav__menu > li + li::before { margin: 0 20px; }
    .nav__slogan { font-size: 1.02rem; }
    .logo img { height: 46px; }
    .logo__text { font-size: 1.4rem; }
}

/* ==================================================================
   SEKCE – ČÁSTI JAKO SAMOSTATNÉ STRÁNKY (přestavba 28. 9. 2026)
   Podle návrhů klienta (www_techologie): levý panel s částmi sekce,
   drobečky, nadpis s azurovým pruhem, text ve dvou sloupcích,
   zeměkoule na pozadí vlevo dole, podzáložky u Teoretické báze.
   Dodatek 29. 9. 2026: na počítači je část celá v okně bez scrollování
   (html.rezim-cely, viz níže), levý panel se nezobrazuje, části vede svislé
   menu v liště (slim řádek zrušen 2. 11. 2026), tlačítka Předchozí / Další ukotvená vpravo dole.
   Na mobilu (≤ 1024 px) stránka scrolluje a části vede volba „V této sekci".
   ================================================================== */

.sekce { position: relative; }

/* ---------- levý panel ---------- */
.panel {
    position: fixed; left: 0; top: var(--nav-vyska); bottom: 0; width: 17.5rem; z-index: 800;
    background: linear-gradient(180deg, rgba(8, 18, 34, .96), rgba(6, 13, 26, .92));
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    border-right: 1px solid var(--ram);
    padding: 26px 0 26px; overflow-y: auto;
}
body.admin-bar .panel { top: calc(var(--nav-vyska) + 32px); }
.panel__nadpis {
    display: block; font-size: .78rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
    color: var(--cyan); padding: 0 26px 18px; margin: 0;
}
.panel__nadpis .ix { letter-spacing: .05em; }
.panel ul { list-style: none; margin: 0; padding: 0; }
.panel a {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 11px 26px; color: var(--text) !important; font-size: .84rem; line-height: 1.35;
    letter-spacing: .06em; text-transform: uppercase; border-left: 3px solid transparent;
    transition: background-color .22s ease, color .22s ease, border-color .22s ease;
}
.panel a:hover { background: rgba(255, 255, 255, .05); }
.panel a.je-aktivni {
    color: var(--cyan) !important; border-left-color: var(--cyan);
    background: linear-gradient(90deg, rgba(63, 214, 232, .16), rgba(63, 214, 232, .02));
}
.panel a .sip { font-size: 1.1em; opacity: .8; }
/* podčásti (Teoretická báze) vnořené pod svou položku */
.panel__pod { border-top: 1px solid var(--ram); border-bottom: 1px solid var(--ram); background: rgba(0, 0, 0, .22); padding: 4px 0 !important; }
.panel__pod a { padding: 7px 26px 7px 42px; font-size: .78rem; text-transform: none; letter-spacing: .01em; border-left-width: 3px; }
.panel__pod a.je-aktivni { background: none; }

/* Dodatek 29. 9. 2026: levý panel se na počítači NEzobrazuje – obsah jde od
   levého okraje jako u klienta; části vede svislé rozbalovací menu v liště
   (slim řádek .sekce-radek zrušen 2. 11. 2026). V HTML panel zůstává jen kvůli mobilu (details). */
.panel { display: none; }

/* Slim řádek částí pod lištou (.sekce-radek) ZRUŠEN 2. 11. 2026 – klient chce
   místo vodorovných řádků svislé rozbalovací menu v liště (styl-2026-upravy.css).
   Ze stejného důvodu jsou na počítači skryté podzáložky Teoretické báze
   (.zalozky, skrytí hned za jejich stylem) – vede je druhá úroveň menu.
   Tablet a mobil je mají dál. */

/* ---------- plocha obsahu ---------- */
/* Bez JS / pod 600 px výšky stránka scrolluje: min-height, aby patička nezačínala v prvním záběru. */
.cast { position: relative; min-height: 100vh; min-height: 100svh; padding: calc(var(--nav-vyska) + 40px) 0 clamp(60px, 8vw, 110px); color: var(--text); }
.cast__obsah {
    position: relative; width: 100%; max-width: 1680px; margin: 0 auto;
    padding: 0 clamp(20px, 2.6vw, 44px);
}

/* ---------- ČÁST CELÁ V OKNĚ – počítač (dodatek plánu 29. 9. 2026) ----------
   Třídu html.rezim-cely dává main.js jen na stránce části sekce
   (.sekce[data-rezim="cely"]) a jen při ≥ 1025 × 600. .cast vyplní okno mezi
   lištou a 32px řádkem patičky, písmo skript zmenší po 0,35 px (min. 11 px);
   když se obsah nevejde ani tak, scrolluje se uvnitř (.cast__obsah). */
.paticka-slim { display: none; }
@media (min-width: 1025px) and (min-height: 600px) {
    html.js.rezim-cely, html.js.rezim-cely body { height: 100%; overflow: hidden; }
    html.js.rezim-cely .cast {
        position: fixed; left: 0; right: 0; top: var(--nav-vyska); bottom: 32px;
        min-height: 0; padding: 18px 0 0; display: flex; flex-direction: column;
    }
    html.js.rezim-cely body.admin-bar .cast { top: calc(var(--nav-vyska) + 32px); }
    html.js.rezim-cely .cast__obsah {
        flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--ram-sv) transparent;
        padding-bottom: 4.6em;   /* místo pro ukotvená tlačítka Předchozí / Další */
    }
    html.js.rezim-cely .cast.ma-vnitrni-scroll .cast__obsah { padding-right: clamp(20px, 2.6vw, 44px); }
    html.js.rezim-cely .ob-drobky { margin-bottom: .9em !important; }
    html.js.rezim-cely .footer { display: none; }
    html.js.rezim-cely .paticka-slim { display: flex; }
    /* tlačítka ukotvená vpravo dole nad řádkem patičky (jako DALŠÍ u klienta) */
    html.js.rezim-cely .ob-dalsi {
        /* vpravo dole sedí odznak reCAPTCHA (~70 px), tlačítka jdou vlevo od něj */
        position: fixed; right: calc(clamp(20px, 2.6vw, 44px) + 84px); bottom: 44px; z-index: 6;
        margin: 0; padding: 0; border: 0; gap: 10px; justify-content: flex-end; align-items: stretch;
    }
    html.js.rezim-cely .ob-dalsi > span:empty { display: none; }
    html.js.rezim-cely .ob-dalsi a { padding: .55em 1.2em; }
    html.js.rezim-cely .ob-dalsi__dal { margin-left: 0; }
    /* úvod modulu: fotka je pás úplně dole plátna, text nad ní */
    html.js.rezim-cely .cast--uvod-modulu { padding-bottom: 0; }
    html.js.rezim-cely .cast--uvod-modulu .cast__obsah { padding-bottom: 18vh; }
    html.js.rezim-cely .cast--uvod-modulu .ob-foto { height: 42vh; }
}
.paticka-slim {
    position: fixed; left: 0; right: 0; bottom: 0; height: 32px; z-index: 5;
    align-items: center; justify-content: center; gap: 12px; padding: 0 20px;
    font-size: .72rem; color: var(--tlum); white-space: nowrap; overflow: hidden;
    background: rgba(5, 10, 20, .92); border-top: 1px solid var(--ram);
}
.paticka-slim a { color: var(--zluta); font-weight: 600; }
.paticka-slim__delic { color: var(--tlum-2); }
.page-water .paticka-slim { background: rgba(5, 31, 94, .94); border-top-color: rgba(255, 255, 255, .22); }
.page-water .paticka-slim a { color: var(--modul); }
.cast p { color: var(--text); margin: 0 0 .85em; line-height: 1.5; }
.cast p:last-child { margin-bottom: 0; }
.cast b, .cast strong { font-weight: 600; }

.ob-drobky { font-size: .82em; color: rgba(255, 255, 255, .85); margin: 0 0 1.4em !important; }
.ob-drobky { text-align: right; }   /* klient 30. 9. 2026: mapa stránek na pravé straně */
.ob-drobky a { color: rgba(255, 255, 255, .85); font-weight: 400; }
.ob-drobky span { margin: 0 .6em; opacity: .7; }
.ob-drobky b { color: var(--modul, var(--cyan)); font-weight: 500; }

.ob-hlava { margin-bottom: 1.1em; }
.ob-titul {
    font-family: var(--pismo); font-weight: 400; font-size: 1.62em; line-height: 1.15;
    letter-spacing: .09em; text-transform: uppercase; color: var(--cyan); margin: 0;
    padding-left: .7em; border-left: 4px solid var(--cyan);
}
.ob-titul--modul { color: var(--modul, var(--zluta)); border-left-color: var(--modul, var(--zluta)); }
.ob-podtitul-cast { font-size: 1.18em; color: var(--cyan); margin: .55em 0 0 !important; padding-left: calc(.7em + 4px); line-height: 1.35; }

/* podzáložky (Teoretická báze) */
.zalozky { display: flex; flex-wrap: wrap; gap: .5em; list-style: none; margin: 0 0 1.5em; padding: 0; }
.zalozky a {
    display: block; padding: .6em 1.1em; font-size: .8em; line-height: 1.25; text-align: center;
    color: var(--text) !important; border: 1px solid var(--ram); border-radius: 6px;
    background: var(--panel); transition: all .22s ease;
}
.zalozky a:hover { border-color: var(--cyan); }
.zalozky a.je-aktivni {
    color: var(--cyan) !important; border-color: var(--cyan);
    background: linear-gradient(180deg, rgba(63, 214, 232, .18), rgba(63, 214, 232, .04));
    box-shadow: inset 0 -2px 0 var(--cyan);
}
@media (min-width: 1025px) {
    .zalozky { display: none; }   /* 2. 11. 2026: vede je menu v liště */
}

/* text sekce – dva sloupce jako v návrhu */
.ob-text { columns: 2; column-gap: 3.4em; }
.ob-text > * { break-inside: avoid; }
.ob-text--jeden { columns: 1; max-width: 62em; }
.ob-text--tri { columns: 3; column-gap: 2.8em; }
.ob-text h2, .ob-text h3, .ob-text .podnadpis {
    font-family: var(--pismo); font-weight: 600; font-size: 1.06em; line-height: 1.3;
    color: var(--cyan); margin: 0 0 .5em; letter-spacing: 0; text-transform: none;
}
/* podnadpis nesmí zůstat osiřelý na konci sloupce: px_oddily() ho obalí s prvním
   odstavcem do .ob-oddil (break-inside: avoid přes .ob-text > *), k tomu break-after */
.ob-text h2, .ob-text h3, .ob-text .podnadpis { break-after: avoid; break-after: avoid-column; break-inside: avoid; }
.ob-oddil { break-inside: avoid; }
.ob-oddil > p:last-child { margin-bottom: .75em; }
/* samostatný oddíl za hlavním textem (Přechod od X-VISION, doplňkové texty ORE) */
.ob-oddil-navic { margin-top: 2.2em; padding-top: 1.6em; border-top: 1px solid var(--ram); }
.ob-oddil-navic__nadpis {
    font-family: var(--pismo); font-weight: 400; font-size: 1.32em; line-height: 1.2; letter-spacing: .07em;
    text-transform: uppercase; color: var(--cyan); margin: 0 0 .9em; padding-left: .6em; border-left: 3px solid var(--cyan);
}
.sekce--ore .ob-oddil-navic__nadpis, .sekce--oil-gas .ob-oddil-navic__nadpis,
.sekce--water .ob-oddil-navic__nadpis { color: var(--modul, var(--zluta)); border-left-color: var(--modul, var(--zluta)); }
.ob-text h2 + p, .ob-text h3 + p, .ob-text .podnadpis + p { margin-top: 0; }
.ob-text p + h2, .ob-text p + h3, .ob-text p + .podnadpis, .ob-text ul + h2, .ob-text ul + .podnadpis { margin-top: 1.2em; }
.ob-text .podnadpis--oddil { color: var(--modul, var(--zluta)); font-size: 1.12em; letter-spacing: .04em; text-transform: uppercase; }
.ob-text p { font-size: .94em; line-height: 1.5; margin: 0 0 .75em; color: var(--text); }
.ob-text .schema-radek, .cast .schema-radek {
    background: rgba(63, 214, 232, .1); border-left: 3px solid var(--cyan); border-radius: 0 6px 6px 0;
    padding: .6em .9em; color: var(--cyan); font-size: .9em; line-height: 1.45; margin: .2em 0 1em;
}
.ob-text ul { margin: 0 0 .9em; padding: 0; list-style: none; }
.ob-text li { position: relative; padding-left: 1.2em; font-size: .94em; line-height: 1.5; margin-bottom: .3em; }
.ob-text li::before { content: ''; position: absolute; left: 0; top: .6em; width: .45em; height: .45em; border-radius: 50%; background: var(--cyan); }
.ob-perex-sekce { font-size: 1.02em; line-height: 1.55; max-width: 74em; margin: 0 0 1.4em !important; color: var(--text); }
.ob-perex-sekce--akcent, .ob-text p.ob-perex-sekce--akcent { color: var(--cyan); }
.cast .doplnit { break-inside: avoid; }

/* ---------- Konstrukce platformy (obrazovka klienta 30. 9. 2026) ----------
   karty modulů → svorka → SPOLEČNÝ TECHNOLOGICKÝ POSTUP (výrazný, Pavel) →
   čtyři fáze jako karty se šipkami → závěrečný rámeček */
.knadpis {
    text-align: center; font-family: var(--pismo); font-weight: 700; font-size: 1.08em; letter-spacing: .12em;
    text-transform: uppercase; color: var(--cyan); margin: 0 0 .8em; padding: 0; border: 0;
}
.kmoduly { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2em; max-width: 1180px; margin: 0 auto; }
.kmodul { display: block; border: 1px solid var(--barva); border-radius: 10px; overflow: hidden; background: #02060E; transition: transform .3s ease; }
.kmodul:hover { transform: translateY(-3px); }
.kmodul img { width: 100%; aspect-ratio: 1 / 1; object-fit: contain; }
.kspoj {
    position: relative; width: 88%; max-width: 1040px; height: 1.1em; margin: .9em auto 0;
    border: 1px solid var(--cyan); border-top: 0; border-radius: 0 0 16px 16px; opacity: .85;
}
.kspoj::after { content: ''; position: absolute; left: 50%; top: 100%; width: 1px; height: 1.5em; background: var(--cyan); }
.kspoj::before {
    content: '\25BC'; position: absolute; left: 50%; top: calc(100% + 1.15em); transform: translateX(-50%);
    color: var(--cyan); font-size: .85em; line-height: 1;
}
.kpostup { text-align: center; margin: 2.6em 0 0; }
.kpostup__nadpis {
    font-family: var(--pismo); font-weight: 700; font-size: 1.6em; letter-spacing: .14em; text-transform: uppercase;
    color: var(--cyan); margin: 0 0 .5em; padding: 0; border: 0; text-shadow: 0 0 22px rgba(63, 214, 232, .5);
}
.kpostup > p { text-align: center; max-width: 62em; margin: 0 auto .2em; font-size: .98em; line-height: 1.5; }
.kfaze { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.4em; list-style: none; margin: 1.3em 0 0; padding: 0; text-align: left; }
.kfaze__karta {
    position: relative; padding: 1em 1.1em 1.1em; border: 1px solid rgba(63, 214, 232, .55); border-radius: 12px;
    background: rgba(63, 214, 232, .05); box-shadow: inset 0 0 22px rgba(63, 214, 232, .08);
}
.kfaze__karta + .kfaze__karta::before {
    content: '\2192'; position: absolute; left: -1.7em; top: 38%; color: var(--cyan); font-size: 1.7em; line-height: 1;
}
.kfaze__hlava { display: flex; align-items: center; gap: .7em; margin-bottom: .6em; }
.kfaze__cislo {
    flex: 0 0 auto; width: 2.3em; height: 2.3em; border-radius: 50%; border: 1px solid var(--cyan); color: var(--cyan);
    display: grid; place-items: center; font-size: .95em; font-weight: 600;
}
.kfaze__nazev { font-family: var(--pismo); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--cyan); font-size: 1em; line-height: 1.2; }
.kfaze__karta p { font-size: .9em; line-height: 1.45; margin: 0; }
.kzaver {
    max-width: 78em; margin: 1.5em auto 0 !important; padding: .9em 1.4em; text-align: center;
    border: 1px solid var(--ram-sv); border-radius: 12px; font-size: .98em; line-height: 1.5;
}

/* ---------- Vývoj platformy: tři svislé bloky, osa hned pod textem (klient 30. 9. 2026) ---------- */
.osy3__uvod { margin-bottom: 1.2em; }
.osy3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; align-items: start; }
.osa { display: flex; flex-direction: column; padding: 0 1.6em; }
.osa:first-child { padding-left: 0; }
.osa:last-child { padding-right: 0; }
.osa + .osa { border-left: 1px solid var(--ram); }
.osa__text .schema-radek { margin-bottom: 0; }
.osa3__cislo {
    width: 2.2em; height: 2.2em; border-radius: 50%; border: 1px solid var(--cyan); color: var(--cyan);
    display: inline-grid; place-items: center; font-size: 1em; font-weight: 600; margin-right: .6em; vertical-align: middle;
}
.osa h2 { display: flex; align-items: center; gap: .6em; }
.osa__graf {
    margin-top: 1.1em; padding: .9em .5em .7em; border: 1px solid rgba(63, 214, 232, .28); border-radius: 10px;
    background: rgba(63, 214, 232, .04);
}
.osa__retez { display: flex; justify-content: center; align-items: flex-start; gap: 1.3em; list-style: none; margin: 0; padding: 0 .3em; }
.osa__retez li {
    position: relative; flex: 0 1 5em; display: flex; flex-direction: column; align-items: center; gap: .5em;
    text-align: center; font-size: .62em; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; line-height: 1.25; color: var(--cyan);
}
.osa__retez li + li::before { content: '\2192'; position: absolute; left: -1.5em; top: 1.2em; color: var(--cyan); font-size: 1.4em; font-weight: 400; letter-spacing: 0; }
.osa__retez svg { width: 2.6rem; height: 2.6rem; fill: none; stroke: var(--cyan); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.osa__popis { margin: .9em 0 0 !important; padding-top: .7em; border-top: 1px solid var(--ram); text-align: center; font-size: .72em; letter-spacing: .22em; text-transform: uppercase; color: var(--text); }

/* ---------- Předchozí / Další – v toku textu na konci obsahu (návrh klienta) ---------- */
.ob-dalsi {
    display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;
    margin-top: 3em; padding-top: 1.6em; border-top: 1px solid var(--ram);
}
/* Tlačítka jako v obrazovkách klienta (Pavel 30. 9. 2026): tenký rámeček v barvě
   modulu, jen nápis, žádný druhý řádek. .ob-dalsi je <nav>, proto !important. */
.ob-dalsi a {
    display: inline-flex; align-items: center; gap: .5em;
    padding: .55em 1.3em; border: 1px solid var(--modul, var(--cyan)); border-radius: 4px;
    color: var(--modul, var(--cyan)) !important; background: transparent !important;
    font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
    transition: background-color .22s ease, color .22s ease;
}
.cast .ob-dalsi a, .cast__obsah .ob-dalsi a { background: transparent !important; color: var(--modul, var(--cyan)) !important; }
.cast .ob-dalsi a:hover { background: var(--modul, var(--cyan)) !important; color: #071120 !important; }
.ob-dalsi__popis span { font-size: 1.3em; line-height: 0; }
.ob-dalsi small { display: none; }
.ob-dalsi__dal { margin-left: auto; }

/* ---------- úvod modulu: fotka pásem dole, název, podtitul, citát vpravo ---------- */
.ob-linka { width: 3.2em; height: .24em; background: var(--modul, var(--zluta)); border-radius: 2px; margin: 0 0 .9em; }
.ob-modul { display: block; font-family: var(--pismo); font-weight: 400; font-size: 1.9em; line-height: 1.1; color: #fff; margin: 0; }
.ob-modul em { font-style: normal; color: var(--modul); font-weight: 600; }
.ob-nadpis { font-family: var(--pismo); font-weight: 700; font-size: 3.1em; line-height: 1.04; letter-spacing: -.01em; color: #fff; margin: 0 0 .25em; }
.ob-nadpis .ix { color: var(--modul, var(--zluta)); }
.ob-nadpis--uvod { font-size: 3em; margin-bottom: .05em; }
.ob-podtitul { font-size: 1.4em; font-weight: 500; line-height: 1.25; margin: 0 0 .7em !important; }

.ob-dva { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 3.2em; align-items: start; }
.ob-dva--uvod { grid-template-columns: minmax(0, 1fr) 15em; gap: 3em; }
.ob-dva--modul { grid-template-columns: minmax(0, 1fr) 20em; gap: 3em; }

.ob-citat-modul { border-left: 1px solid var(--ram-sv); padding-left: 1.8em; margin-top: 2.6em; }
.ob-citat-modul__veta { font-family: var(--pismo-nadpis); font-style: italic; font-size: 1.3em; line-height: 1.3; color: var(--modul, var(--zluta)); margin-bottom: .8em !important; }
.ob-citat-modul p { font-size: .96em; color: var(--tlum); }

/* pravý slogan (WATER) */
.ob-slogan { border-left: 1px solid rgba(255, 255, 255, .5); padding: 1.6em 0 1.6em 2em; margin-top: 2.4em; text-align: center; }
.ob-slogan p { font-style: italic; font-weight: 600; font-size: 1.42em; line-height: 1.4; color: var(--modul); }
.ob-slogan::before, .ob-slogan::after { content: ''; display: block; width: 3.2em; height: .2em; background: var(--modul); margin: 0 auto 1.4em; border-radius: 2px; }
.ob-slogan::after { margin: 1.4em auto 0; }

.cast--uvod-modulu { padding-bottom: 40vh; min-height: 100vh; }
.cast--uvod-modulu .ob-foto {
    position: absolute; left: 0; right: 0; bottom: 0; height: 44vh; z-index: -1;
    background-position: center bottom; background-size: cover; background-repeat: no-repeat;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 36%);
            mask-image: linear-gradient(180deg, transparent 0%, #000 36%);
}
.cast--uvod-modulu .cast__obsah { position: static; }

/* řetězec SAT › G+M › SGY › CÍL (og-proces.html) */
.ob-proces { margin: 2.4em 0 0; padding: 1.6em 0 0; border-top: 1px solid var(--ram-sv); }
.ob-proces .proces { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.6em; list-style: none; margin: 0; padding: 0; text-align: center; }
.ob-proces .proces li { position: relative; padding: 0 .6em; }
.ob-proces .proces li + li::before { content: '\203A'; position: absolute; left: -1.05em; top: .1em; color: var(--modul, var(--zluta)); font-size: 1.9em; line-height: 1; font-weight: 700; }
.ob-proces .proces b { display: block; font-family: var(--pismo); font-weight: 700; font-size: 1.35em; line-height: 1.2; color: #fff; }
.ob-proces .proces span { display: block; font-size: .86em; color: var(--text); padding-bottom: .5em; margin: 0 auto .8em; border-bottom: 2px solid var(--modul, var(--zluta)); width: fit-content; min-width: 4em; min-height: 1.9em; }
.ob-proces .proces p { font-size: .9em; color: var(--text); }

/* tři sloupce úvodu OIL–GAS (og-sloupce.html) */
.ob-sloupce3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.2em; margin-top: 1.8em; padding-top: 1.4em; border-top: 1px solid var(--ram-sv); }
.ob-sloupce3 > div + div { border-left: 1px solid var(--ram); padding-left: 1.8em; }
.ob-sloupce3 h2, .ob-sloupce3 .podnadpis { font-family: var(--pismo); font-weight: 600; font-size: 1.06em; color: var(--text); margin: 0 0 .5em; letter-spacing: 0; text-transform: none; }
.ob-sloupce3 p + h2 { margin-top: 1.4em; }
.ob-sloupce3 p { font-size: .92em; }
.ob-sloupce3 .schema-radek { text-align: center; font-size: .78em; letter-spacing: .06em; text-transform: uppercase; border: 1px solid var(--ram-sv); border-left-width: 1px; border-radius: 6px; background: rgba(255, 255, 255, .03); color: var(--text); }
.ob-sloupce3--tok { display: block; columns: 3; column-gap: 2.2em; }

/* ---------- obsah modulu WATER (z návrhu klienta) ---------- */
.ob-panel { background: linear-gradient(180deg, #F2F9FF, #D9EDFE); border-radius: 14px; padding: 1.1em 1.4em 1.2em; color: #0B2A8A; box-shadow: 0 18px 40px rgba(3, 20, 70, .28); }
.ob-panel + .ob-panel { margin-top: 1.1em; }
.ob-panel__nadpis { font-size: .86em; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #0B2A8A; margin: 0 0 .8em; font-family: var(--pismo); }
.ob-panel p { color: #0B2A8A; font-size: .84em; line-height: 1.4; }
.ob-panel img { width: 100%; height: auto; display: block; }

.alg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 1.6em; align-items: start; }
.alg__sloupec { display: flex; flex-direction: column; align-items: stretch; }
.alg__box {
    background: linear-gradient(180deg, #CBE9FD, #A9DAFB); border: 1px solid #6FBFF3; border-radius: 8px;
    text-align: center; padding: .3em .6em; font-size: .84em; line-height: 1.2; color: #0B2A8A;
}
.alg__box b { display: block; font-weight: 700; }
.alg__box--cil { background: linear-gradient(180deg, #1568E8, #0A45C4); border-color: #0A45C4; color: #fff; }
.alg__sipka { align-self: center; width: 2px; height: .7em; background: #1568E8; position: relative; margin: 0 0 .32em; }
.alg__sipka::after { content: ''; position: absolute; left: 50%; bottom: -.3em; transform: translateX(-50%); border: .3em solid transparent; border-top-color: #1568E8; border-bottom: 0; }
.alg__konec { border-top: 2px dashed #1568E8; margin-top: .5em; padding-top: .35em; text-align: center; font-weight: 700; font-size: .88em; }
.alg__uvod { font-size: .95em; line-height: 1.25; margin: 0 0 .6em !important; }
.alg__rastry { border-left: 2px solid #1568E8; border-radius: 10px 0 0 10px; padding-left: .9em; display: flex; flex-direction: column; }
.alg__legenda { margin: .9em 0 0; font-size: .8em; line-height: 1.45; display: grid; grid-template-columns: auto 1fr; gap: 0 .6em; }
.alg__legenda dt { font-weight: 700; }
.alg__legenda dd { margin: 0; }

/* klasifikace – pět číslovaných bloků; sloupce si prohlížeč vyváží sám */
.ob-sloupce { columns: 2; column-gap: 3em; }
.ob-sloupce .ob-blok { break-inside: avoid; }
.ob-blok { margin-bottom: 1.5em; }
.ob-blok:last-child { margin-bottom: 0; }
.ob-blok h2, .ob-blok h3 {
    font-family: var(--pismo); font-weight: 600; font-size: 1.22em; color: #fff; margin: 0 0 .45em;
    display: flex; align-items: center; gap: .8em; letter-spacing: 0;
}
.ob-blok h2::before, .ob-blok h3::before { content: ''; flex: 0 0 auto; width: 1.9em; height: .2em; background: var(--modul); border-radius: 2px; }
.ob-blok p { font-size: .94em; }
.ob-perex { font-size: 1.12em; max-width: 78em; margin-bottom: 1.5em !important; }
.ob-vycet { list-style: none; margin: 0 0 .7em; padding: 0; font-size: .94em; line-height: 1.45; }
.ob-vycet li { display: grid; grid-template-columns: 1.4em 11.5em 1fr; align-items: baseline; color: #fff; }
.ob-vycet li::before { content: ''; width: .62em; height: .62em; border-radius: 50%; background: var(--modul); align-self: center; }
.ob-vycet b { font-weight: 600; }

/* projekty */
.ob-projekt { margin-bottom: 1.7em; }
.ob-projekt::before { content: ''; display: block; width: 3em; height: .22em; background: var(--modul); border-radius: 2px; margin-bottom: .8em; }
.ob-projekt h2, .ob-projekt h3 { font-family: var(--pismo); font-weight: 700; font-size: 1.5em; color: #fff; margin: 0 0 .4em; letter-spacing: 0; }
.ob-velky p { font-size: 1.22em; line-height: 1.5; margin-bottom: 1.3em; }
.ob-odkaz { color: #fff; font-weight: 700; }
.ob-odkaz:hover { color: var(--modul); }

/* ---------- barevný svět modulu WATER: sytá modrá + azurový akcent ---------- */
.page-water {
    --modul: #35D6F5;
    --pozadi: #0A3BA6;
    background: #0A3BA6;
}
.page-water .hvezdy { display: none; }
.page-water .nav {
    background: linear-gradient(180deg, rgba(6, 30, 92, .94), rgba(6, 30, 92, .74));
    border-bottom-color: rgba(255, 255, 255, .22);
}
.page-water .nav__pod, .page-water .nav__pod2 { background: rgba(6, 30, 92, .97); }
.page-water .nav__menu a:hover,
.page-water .nav__menu a.je-aktivni { color: var(--modul) !important; }
.page-water .nav__menu a.je-aktivni::after,
.page-water .nav__menu a:hover::after { background: var(--modul); }
.page-water .mobil-menu { background: #072A7E; }
.page-water .mobil-menu a:hover,
.page-water .mobil-menu a.je-aktivni,
.page-water .m-acc__ikona { color: var(--modul) !important; }
.page-water .footer { background: #051F5E; }
.page-water .footer__spodek a, .page-water .footer a:hover { color: var(--modul); }
/* modrý svět má jen WATER; ostatní sekce zůstávají tmavé */
.page-water main {
    background:
        radial-gradient(70% 60% at 85% 15%, rgba(80, 170, 255, .35), transparent 70%),
        linear-gradient(160deg, #08308E 0%, #0B47B8 48%, #1A6BDC 100%);
}
.page-water .panel { background: linear-gradient(180deg, rgba(5, 26, 82, .94), rgba(5, 26, 82, .88)); border-right-color: rgba(255, 255, 255, .22); }
.page-water .panel__nadpis, .page-water .panel a.je-aktivni { color: var(--modul) !important; }
.page-water .panel a.je-aktivni { border-left-color: var(--modul); background: linear-gradient(90deg, rgba(53, 214, 245, .18), rgba(53, 214, 245, .02)); }
.page-water .sekce-volba summary { border-color: rgba(255, 255, 255, .35); }
.page-water .sekce-volba b, .page-water .sekce-volba a.je-aktivni { color: var(--modul); }

/* ---------- zeměkoule na pozadí sekce – vlevo dole pod panelem, jako v návrhu ---------- */
.sekce__globus {
    position: fixed; left: 0; bottom: 0; width: min(58vw, 62rem); height: min(70vh, 40rem); z-index: -2; pointer-events: none;
    /* Plátno je obdélník a závoj atmosféry k jeho okrajům dosáhne – okraje se
       proto rozpouštějí ze všech stran (průnik dvou masek), ať není vidět hrana. */
    -webkit-mask-image: linear-gradient(90deg, #000 45%, transparent 92%), linear-gradient(180deg, transparent 0%, #000 34%);
            mask-image: linear-gradient(90deg, #000 45%, transparent 92%), linear-gradient(180deg, transparent 0%, #000 34%);
    -webkit-mask-composite: source-in;
            mask-composite: intersect;
}
.sekce__globus .hero__globus { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease; }
.sekce__globus .hero__globus.je-nacteno { opacity: .45; }
.sekce__globus canvas { display: block; width: 100%; height: 100%; }

/* ---------- mobil a tablet ---------- */
.sekce-volba { display: none; }

@media (max-width: 1024px) {
    .cast { padding-top: calc(var(--nav-vyska) + 28px); }
    .cast__obsah { padding-left: clamp(20px, 4vw, 44px); }

    /* kompaktní volba části místo panelu */
    .sekce-volba { display: block; margin: 0 0 1.4em; }
    .sekce-volba summary {
        list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
        padding: 12px 16px; border: 1px solid var(--ram-sv); border-radius: 8px; background: var(--panel);
        font-size: .95rem; line-height: 1.3;
    }
    .sekce-volba summary::-webkit-details-marker { display: none; }
    .sekce-volba__stitek { font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--tlum); }
    .sekce-volba b { font-weight: 600; color: var(--cyan); }
    .sekce-volba__sipka { margin-left: auto; color: var(--tlum); transition: transform .25s ease; }
    .sekce-volba[open] .sekce-volba__sipka { transform: rotate(180deg); }
    .sekce-volba ul { list-style: none; margin: 6px 0 0; padding: 6px 0; border: 1px solid var(--ram); border-radius: 8px; background: rgba(8, 18, 34, .96); }
    .sekce-volba li { margin: 0; }
    .sekce-volba a { display: block; padding: 9px 16px; color: var(--text) !important; font-size: 1rem; line-height: 1.35; border-left: 3px solid transparent; }
    .sekce-volba a.je-aktivni { color: var(--cyan) !important; border-left-color: var(--cyan); background: rgba(63, 214, 232, .1); }
    .sekce-volba .sip { display: none; }
    .sekce-volba .panel__pod { border: 0; background: rgba(0, 0, 0, .25); padding: 4px 0; margin: 0; }
    .sekce-volba .panel__pod a { padding-left: 32px; font-size: .95rem; }

    .ob-text, .ob-text--tri, .ob-sloupce, .ob-sloupce3--tok { columns: 1; }
    .osy3, .kmoduly, .ob-sloupce3 { grid-template-columns: 1fr; }
    .kmoduly { grid-template-columns: 1fr 1fr; }
    .ob-sloupce3 > div + div { border-left: 0; padding-left: 0; border-top: 1px solid var(--ram); padding-top: 1.4em; }
    .kfaze__radek { grid-template-columns: 2.1em 1fr; }
    .kfaze__radek span:last-child { grid-column: 2; }
    .ob-dva, .ob-dva--uvod, .ob-dva--modul { grid-template-columns: 1fr; gap: 2em; }
    .ob-nadpis { font-size: 2.4em; }
    .ob-nadpis--uvod { font-size: 2.3em; }
    .ob-modul { font-size: 1.4em; }
    .ob-citat-modul { border-left: 0; border-top: 1px solid var(--ram-sv); padding: 1.4em 0 0; margin-top: 0; }
    .ob-slogan { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .4); padding: 1.6em 0 0; margin-top: 0; }
    .ob-velky p { font-size: 1.08em; }
    .cast--uvod-modulu { padding-bottom: 34vh; min-height: 0; }
    .cast--uvod-modulu .ob-foto { height: 36vh; }
    .ob-proces .proces { grid-template-columns: 1fr 1fr; gap: 1.6em 2.2em; }
    .ob-proces .proces li + li::before { display: none; }
    .sekce__globus { width: 70vw; height: 50vh; }
}
@media (max-width: 640px) {
    .alg { grid-template-columns: 1fr; }
    .ob-vycet li { grid-template-columns: 1.4em 1fr; }
    .ob-vycet li span { grid-column: 2; }
    .ob-podtitul { font-size: 1.2em; }
    .ob-titul { font-size: 1.32em; }
    .kmoduly { grid-template-columns: 1fr 1fr; }
    .ob-proces .proces { grid-template-columns: 1fr; }
    /* na mobilu obě tlačítka vedle sebe v jednom řádku (Pavel 29. 9. 2026) */
    .ob-dalsi { flex-direction: row; align-items: stretch; gap: 10px; }
    .ob-dalsi a { flex: 1 1 0; justify-content: center; }
    .ob-dalsi__dal { margin-left: 0; }
    .ob-dalsi small { font-size: .74rem; }
}

/* odkazy na ostatní moduly na konci panelu (náhrada za zrušený řádek podmenu) */
.panel__nadpis--dalsi { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--ram); color: var(--tlum); }
.panel__moduly a { text-transform: none; letter-spacing: 0; font-size: .92rem; gap: 10px; justify-content: flex-start; }
.panel__moduly .nav__tecka { flex: 0 0 auto; }

/* rozcestník modulů (/reseni/): karty vedle sebe, na mobilu pod sebe */
.moduly-karty { margin-top: 1.2em; max-width: 68em; }
.sekce--moduly .panel__moduly a { text-transform: none; letter-spacing: 0; font-size: .95rem; gap: 10px; justify-content: flex-start; }
@media (max-width: 900px) { .moduly-karty { grid-template-columns: 1fr; } }

/* Účel technologie (/technologie/): krátký text vycentrovaný do prostoru
   (protokol klienta 30. 9. 2026); třídu .cast--stred dává cast-sekce.php */
.cast--stred .ob-hlava, .cast--stred .ob-text--jeden { max-width: 50em; margin-left: auto; margin-right: auto; text-align: center; }
.cast--stred .ob-titul { border-left: 0; padding-left: 0; }
.cast--stred .ob-text--jeden p { font-size: 1.08em; line-height: 1.65; }
@media (min-width: 1025px) and (min-height: 600px) {
    html.js.rezim-cely .cast--stred .cast__obsah { display: flex; flex-direction: column; }
    html.js.rezim-cely .cast--stred .ob-drobky { margin-bottom: auto !important; }
    html.js.rezim-cely .cast--stred .ob-text--jeden { margin-bottom: auto; }
}
@media (max-width: 900px) {
    .ob-drobky { text-align: left; }
}

@media (min-width: 1025px) and (min-height: 600px) {
    /* Konstrukce v okně: dlaždice modulů nižší, ať se svorka, postup i fáze vejdou */
    html.js.rezim-cely .kmodul img, html.js.rezim-cely .kmodul video { aspect-ratio: auto; height: 21vh; width: auto; max-width: 100%; margin: 0 auto; }
}
@media (max-width: 900px) {
    .kfaze { grid-template-columns: 1fr; gap: 1em; }
    .kfaze__karta + .kfaze__karta::before { display: none; }
    .kspoj { width: 70%; }
    .osa { padding: 0; }
    .osa + .osa { border-left: 0; border-top: 1px solid var(--ram); padding-top: 1.4em; margin-top: 1.4em; }
    .osa__retez { flex-wrap: wrap; row-gap: 1em; }
}

/* Účel technologie – výčet pěti navazujících částí (text klienta 6. 10. 2026).
   Blok je vycentrovaný, číslovaný výčet ale čteme zleva. */
.cast--stred .ucel-uvod-casti { margin-top: 1.1em; }
.ob-text ol.ucel-casti {
    counter-reset: ucel; list-style: none; padding: 0; margin: .4em auto 0;
    display: inline-block; text-align: left; max-width: 46em;
}
.ob-text ol.ucel-casti li {
    counter-increment: ucel; position: relative; padding-left: 2.1em;
    font-size: 1em; line-height: 1.55; margin-bottom: .45em;
}
.ob-text ol.ucel-casti li::before {
    content: counter(ucel) "."; position: absolute; left: 0; top: 0;
    width: auto; height: auto; border-radius: 0; background: none;
    color: var(--cyan); font-weight: 600;
}
.ob-text ol.ucel-casti a {
    color: var(--cyan) !important; font-weight: 600; text-decoration: none !important;
    border-bottom: 1px solid transparent;
}
.ob-text ol.ucel-casti a:hover, .ob-text ol.ucel-casti a:focus-visible { border-bottom-color: var(--cyan); }
/* ================================================================== *
 *  STRÁNKA TÝM – světlá varianta 1:1 podle obrazovky klienta
 *  (www_team_cz.png, září 2026). Přibaluje sestav-styl.py do style.css.
 *
 *  Celý web je tmavý; tato stránka je bílá/světle modrá s modrým textem.
 *  Body má třídu page-tym – pod ní se přepíná pozadí, lišta i patička.
 *  Vlastní třídy mají předponu .tym-, existující (.wrap) jen kde sedí.
 *  Kontrast textu: navy #17376B a modrá #0E5FC4 na světle modré ≥ 5:1.
 * ================================================================== */

body.page-tym {
    --tym-pozadi:     #F3F9FE;   /* pozadí stránky */
    --tym-lista:      #EDF7FE;   /* lišta a patička */
    --tym-karta:      #E0F0FD;   /* karty členů, FDL */
    --tym-karta-2:    #DAEDFC;   /* karta vedoucího */
    --tym-text:       #17376B;   /* běžný text */
    --tym-tlum:       #3B5680;   /* patička, drobný text */
    --tym-nadpis:     #0F3F86;   /* nadpisy a jména */
    --tym-modra:      #0E5FC4;   /* role, odkazy, podtržení */
    --tym-btn:        #005ACA;   /* tlačítko */
    --tym-ram:        rgba(15, 63, 134, .14);
    --tym-cara:       rgba(15, 63, 134, .28);
    --tym-silueta:    #B9CFE6;

    --wrap: 1590px;              /* návrh klienta má obsah téměř přes celou šířku */

    background: var(--tym-pozadi);
    color: var(--tym-text);
    font-family: var(--pismo);
}
body.page-tym .hvezdy { display: none; }

/* ---------- horní lišta na světlé ---------- */
body.page-tym .nav {
    background: linear-gradient(180deg, rgba(237, 247, 254, .97), rgba(237, 247, 254, .9));
    border-bottom: 1px solid var(--tym-ram);
}
body.page-tym .logo img { content: url('img/znak-proxterra-tmavy.png'); }
body.page-tym .logo__text { color: var(--tym-nadpis); }
body.page-tym .footer__logo { content: url('img/logo-proxterra.png'); }
body.page-tym .nav__slogan, body.page-tym .nav__sekce, body.page-tym .nav__jazyk {
    color: var(--tym-text); border-left-color: var(--tym-cara);
}
body.page-tym .nav__jazyk .sipka { color: var(--tym-tlum); }
body.page-tym .nav__menu > li + li::before { background: var(--tym-cara); }
body.page-tym .nav__menu a { color: var(--tym-nadpis) !important; font-weight: 600; }
body.page-tym .nav__roz { color: var(--tym-nadpis); font-weight: 600; }
body.page-tym .nav__roz .sipka { color: var(--tym-nadpis); }
body.page-tym .nav__roz:hover, body.page-tym .nav__roz[aria-expanded="true"] { color: var(--tym-btn); }
body.page-tym .nav__roz[aria-expanded="true"]::after { background: var(--tym-btn); }
body.page-tym .nav__pod, body.page-tym .nav__pod2 { background: #F4F9FE; border-color: #C9DBEE; box-shadow: 0 14px 30px rgba(20, 50, 90, .14); }
body.page-tym .nav__menu .nav__pod a { color: var(--tym-nadpis) !important; }
body.page-tym .nav__menu .nav__pod a:hover, body.page-tym .nav__menu .nav__pod a.je-aktivni,
body.page-tym .nav__menu .ma-pod2:hover > a { color: var(--tym-btn) !important; background: #E3EEF9 !important; }
body.page-tym .nav__pod .sip, body.page-tym .nav__menu .nav__pod .nav__prehled { color: var(--tym-tlum) !important; }
body.page-tym .nav__pod-prehled { border-top-color: #C9DBEE; }
body.page-tym .ma-pod:hover > .nav__roz, body.page-tym .ma-pod:hover > .nav__roz .sipka { color: var(--tym-btn); }
body.page-tym .nav__menu a:hover, body.page-tym .nav__menu a.je-aktivni { color: var(--tym-btn) !important; }
body.page-tym .nav__menu a.je-aktivni::after, body.page-tym .nav__menu a:hover::after { background: var(--tym-btn); }
body.page-tym .nav__radek { background: var(--tym-lista); border-color: var(--tym-ram); }
body.page-tym .hamburger { border-color: var(--tym-cara); }
body.page-tym .hamburger span { background: var(--tym-nadpis); }
body.page-tym .hamburger.je-otevreny span { background: var(--tym-nadpis); }  /* lišta zůstává světlá i s otevřeným menu, křížek musí být tmavý */

/* ---------- pruh s nadpisem ----------
   Klient má fotku minerálu (tmavá modř → zlatavé krystaly); soubor nemáme,
   proto vlastní jemný přechod s abstraktní texturou v CSS. */
.tym-hlava {
    position: relative; overflow: hidden;
    margin-top: var(--nav-celkem, 78px);
    min-height: clamp(120px, 12vw, 160px);
    display: flex; align-items: center;
    background:
        radial-gradient(60% 140% at 78% 40%, rgba(213, 178, 120, .55), transparent 60%),
        radial-gradient(40% 120% at 96% 90%, rgba(232, 194, 130, .45), transparent 60%),
        radial-gradient(50% 160% at 46% 100%, rgba(31, 140, 190, .55), transparent 62%),
        linear-gradient(100deg, #0A2A5E 0%, #123F86 32%, #1F6FB0 56%, #6C8DA6 78%, #B58C5A 100%);
    color: #fff;
}
.tym-hlava__textura {
    position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background:
        repeating-linear-gradient(115deg, rgba(255, 255, 255, .06) 0 2px, transparent 2px 14px),
        repeating-linear-gradient(25deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 9px),
        radial-gradient(3px 3px at 22% 30%, rgba(255, 255, 255, .5) 50%, transparent 51%),
        radial-gradient(2px 2px at 63% 70%, rgba(255, 255, 255, .5) 50%, transparent 51%),
        radial-gradient(2px 2px at 84% 25%, rgba(255, 255, 255, .6) 50%, transparent 51%),
        radial-gradient(3px 3px at 40% 80%, rgba(255, 255, 255, .4) 50%, transparent 51%),
        radial-gradient(2px 2px at 92% 65%, rgba(255, 255, 255, .55) 50%, transparent 51%);
    mix-blend-mode: screen;
}
.tym-hlava .wrap { position: relative; }
.tym-hlava__nadpis {
    margin: 0; padding: 22px 0;
    font-family: var(--pismo); font-weight: 600; letter-spacing: .01em;
    font-size: clamp(2.4rem, 4vw, 3.6rem); line-height: 1; color: #fff;
    text-shadow: 0 2px 14px rgba(5, 20, 50, .35);
}

/* ---------- úvod: text | firma ---------- */
.tym-uvod { padding: clamp(22px, 2.4vw, 34px) 0 clamp(18px, 2vw, 26px); }
.tym-uvod__mrizka {
    display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 3vw, 56px);
}
.tym-uvod__text p, .tym-uvod__firma p {
    margin: 0; font-size: clamp(1rem, 1.05vw, 1.08rem); line-height: 1.5; color: var(--tym-text);
}
.tym-uvod__text { padding-left: clamp(0px, 1.6vw, 26px); }
.tym-uvod__firma {
    position: relative; padding-left: clamp(22px, 2.6vw, 40px);
    border-left: 1px solid var(--tym-cara);
    display: grid; grid-template-columns: 1fr auto; column-gap: 24px; align-items: end;
}
.tym-uvod__firma > p:first-child { grid-column: 1 / -1; }
.tym-uvod__firma strong { color: var(--tym-nadpis); font-weight: 700; }
.tym-uvod__adresa { margin-top: 10px !important; }
.tym-btn {
    display: inline-flex; align-items: center; gap: 12px;
    padding: 12px 22px; border-radius: 6px;
    background: var(--tym-btn); color: #fff !important; text-decoration: none;
    font-size: 1rem; font-weight: 500; white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 90, 202, .22);
    transition: background .2s ease, transform .2s ease;
}
.tym-btn:hover { background: #0F3F86; transform: translateY(-1px); }
.tym-btn svg { width: 22px; height: 22px; flex: 0 0 auto; }
.tym-btn__sipka { margin-left: 6px; }

/* ---------- karta vedoucího ---------- */
.tym-vedouci { padding: clamp(10px, 1vw, 14px) 0 0; }
.tym-vedouci__karta {
    display: grid; grid-template-columns: minmax(240px, 340px) 1fr; gap: 0 clamp(20px, 2vw, 26px);
    background: var(--tym-karta-2); border-radius: var(--radius-s); overflow: hidden;
}
/* fotka je absolutně v obalu, aby výšku karty určoval text a fotka se
   ořízla na jeho výšku – jako kompaktní karta v návrhu klienta */
.tym-vedouci__foto { position: relative; min-height: 190px; background: #CFE3F7; }
.tym-vedouci__foto img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; display: block;
}
.tym-vedouci__foto--silueta { display: flex; align-items: center; justify-content: center; }
.tym-vedouci__foto--silueta .tym-silueta { width: 46%; height: auto; aspect-ratio: 1; }
.tym-vedouci__text { padding: clamp(16px, 1.8vw, 26px) clamp(20px, 2.4vw, 40px) clamp(16px, 1.8vw, 26px) 0; }
.tym-vedouci__jmeno {
    display: flex; align-items: center; gap: 22px; margin: 0 0 8px;
    font-family: var(--pismo); font-weight: 700; font-size: clamp(1.4rem, 1.9vw, 1.9rem);
    line-height: 1.15; color: var(--tym-nadpis);
}
.tym-vedouci__jmeno::after { content: ''; flex: 1; height: 1px; background: var(--tym-cara); }
.tym-vedouci__role, .tym-vedouci__role-2 {
    margin: 0; color: var(--tym-modra); font-size: clamp(1.05rem, 1.25vw, 1.32rem); line-height: 1.35;
}
.tym-vedouci__role { font-weight: 700; }
.tym-vedouci__popis {
    margin: 14px 0 0; max-width: 46em;
    font-size: clamp(1rem, 1.05vw, 1.08rem); line-height: 1.5; color: var(--tym-text);
}

/* ---------- nadpis oddílu s čárou ---------- */
.tym-oddil {
    display: flex; align-items: center; gap: 22px; margin: clamp(16px, 1.8vw, 24px) 0 clamp(10px, 1.1vw, 14px);
    font-family: var(--pismo); font-weight: 700; font-size: clamp(1.25rem, 1.5vw, 1.5rem);
    line-height: 1.2; color: var(--tym-nadpis);
}
.tym-oddil::after { content: ''; flex: 1; height: 1px; background: var(--tym-cara); }

/* ---------- řešitelský tým ---------- */
.tym-clenove__mrizka {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(10px, 1vw, 14px);
}
.tym-clen {
    display: grid; grid-template-columns: 64px 1fr; gap: 16px; align-items: start;
    padding: clamp(14px, 1.2vw, 18px); background: var(--tym-karta); border-radius: var(--radius-s);
}
.tym-silueta {
    display: flex; align-items: flex-end; justify-content: center;
    width: 64px; height: 100px; border-radius: 4px; background: #CFE3F7; overflow: hidden;
}
.tym-silueta svg { width: 78%; height: auto; fill: var(--tym-silueta); }
.tym-clen__foto { width: 64px; height: 100px; object-fit: cover; border-radius: 4px; display: block; }
.tym-clen__jmeno {
    margin: 0 0 3px; font-family: var(--pismo); font-weight: 700; font-size: 1.02rem;
    line-height: 1.25; color: var(--tym-nadpis);
}
.tym-clen__role {
    margin: 0; padding-bottom: 6px; border-bottom: 1px solid var(--tym-cara);
    color: var(--tym-modra); font-size: .95rem; line-height: 1.35;
}
.tym-clen__popis { margin: 8px 0 0; font-size: .92rem; line-height: 1.45; color: var(--tym-text); }

/* ---------- mezinárodní zastoupení ---------- */
.tym-zastoupeni { padding-bottom: clamp(34px, 4vw, 60px); }
.tym-zastoupeni__mrizka {
    display: grid; grid-template-columns: 1fr 1fr; gap: clamp(10px, 1vw, 14px);
}
.tym-partner {
    display: grid; grid-template-columns: minmax(180px, 240px) 1fr; gap: clamp(16px, 1.6vw, 26px);
    padding: clamp(14px, 1.4vw, 20px) clamp(16px, 1.6vw, 24px);
    border-radius: var(--radius-s); background: var(--tym-karta);
}
/* pozadí karet = přesně pozadí dočasných výřezů log (sag.png, fdl.png),
   aby výřez nebyl vidět; po dodání originálů (PNG s průhledností) lze sjednotit */
.tym-partner--sag { background: #FCF4E7; }
.tym-partner--fdl { background: #E3F2FE; }
.tym-partner__logo { display: flex; align-items: center; justify-content: center; }
.tym-partner__logo img { max-width: 100%; height: auto; }
.tym-partner__nazev {
    margin: 0 0 2px; font-family: var(--pismo); font-weight: 700; font-size: 1.02rem;
    line-height: 1.3; color: var(--tym-nadpis);
}
.tym-partner__oblast { margin: 0 0 8px; color: var(--tym-modra); font-size: .95rem; font-weight: 600; }
.tym-partner__popis { margin: 0; font-size: .92rem; line-height: 1.45; color: var(--tym-text); }

/* ---------- patička na světlé ---------- */
body.page-tym .footer {
    background: var(--tym-lista); color: var(--tym-tlum); border-top: 1px solid var(--tym-ram);
}
body.page-tym .footer__nadpis { color: var(--tym-nadpis); }
body.page-tym .footer a { color: var(--tym-nadpis); }
body.page-tym .footer a:hover, body.page-tym .footer__spodek a { color: var(--tym-btn); }
body.page-tym .footer__spodek { border-top-color: var(--tym-ram); }

/* ---------- responzivita ---------- */
@media (max-width: 1280px) {
    .tym-clenove__mrizka { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .tym-hlava { margin-top: var(--nav-vyska, 78px); min-height: 110px; }
    .tym-uvod__mrizka { grid-template-columns: 1fr; gap: 22px; }
    .tym-uvod__text { padding-left: 0; }
    .tym-uvod__firma { border-left: 0; padding-left: 0; grid-template-columns: 1fr; row-gap: 14px; align-items: start; }
    .tym-btn { justify-self: start; }
    .tym-vedouci__karta { grid-template-columns: 1fr; }
    .tym-vedouci__foto { aspect-ratio: 4 / 3; min-height: 0; max-height: 360px; }
    .tym-vedouci__text { padding: 18px 20px 22px; }
    .tym-clenove__mrizka, .tym-zastoupeni__mrizka { grid-template-columns: 1fr; }
    .tym-partner { grid-template-columns: 1fr; }
    .tym-partner__logo { justify-content: flex-start; }
    .tym-partner__logo img { max-width: 200px; }
}

/* ==================================================================
   RESPONZIVITA
   ================================================================== */
@media (max-width: 1180px) {
    .nav__slogan { display: none; }
    .nav__menu > li + li::before { margin: 0 12px; }
    .nav--sekce .nav__sekce { display: none; }
    .nav__menu--sekce > li + li::before { margin: 0 8px; }
    .nav__menu--sekce a { letter-spacing: .04em; }
}
@media (max-width: 1024px) {
    .hero__mrizka { grid-template-columns: 30% 1fr; }
    .kroky { grid-template-columns: repeat(3, 1fr); row-gap: 34px; }
    .kroky::before { display: none; }
    .mrizka--4 { grid-template-columns: repeat(2, 1fr); }
    .hero--modul .hero__mrizka { grid-template-columns: 1fr; }
    .hero__citat { margin-top: 10px; }
}
@media (max-width: 900px) {
    .nav__menu, .nav__jazyk, .nav__zpet, .nav__sekce-radek { display: none !important; }
    .hamburger { display: block; }
    body { --nav-celkem: var(--nav-vyska); }
    body.ma-sekci { --nav-celkem: var(--nav-vyska); }
    .hero { padding-top: calc(var(--nav-vyska) + 30px); }
    .hero__mrizka { grid-template-columns: 1fr; }
    .hero__text { text-align: center; padding-bottom: 32vh; }
    .hero--pod .hero__text, .hero--modul .hero__text { padding-bottom: 0; }
    .hero--pod { min-height: 0; padding-bottom: 40vh; }
    .duo, .mrizka--2, .mrizka--3 { grid-template-columns: 1fr; }
    .sloupce { columns: 1; }
    .proces { grid-template-columns: 1fr 1fr; row-gap: 28px; }
    .proces__krok + .proces__krok::before { display: none; }
    .footer-grid { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 640px) {
    .kroky { grid-template-columns: 1fr 1fr; }
    .mrizka--4 { grid-template-columns: 1fr; }
    .rozklad__radek { grid-template-columns: 1fr; gap: 4px; }
    .hero__nazev { letter-spacing: .04em; }
    .pager { flex-direction: column; align-items: flex-start; }
}