/* ═══════════════════════════════════════════════════════
   Nové stránky a sekce: Za obrazem, Zakázková tvorba,
   Příběhy klientů, konec stránky (výzva + Přístup do ateliéru)
   Bez aspect-ratio / inset / flex gap kvůli staršímu Safari.
   ═══════════════════════════════════════════════════════ */

/* ── Hlavní menu: 6 položek ───────────────────── */
@media (min-width: 768px) {
    .flex-caption { width: 92%; max-width: 1040px; }
    .navbar.site-nav { max-width: none; }
    .navbar.site-nav ul.site-nav-list > li > a { padding-left: 16px; padding-right: 16px; white-space: nowrap; }
}
@media (min-width: 768px) and (max-width: 1100px) {
    .navbar.site-nav ul.site-nav-list > li > a { padding-left: 9px; padding-right: 9px; font-size: 14px; }
}

/* ── Úvod: Abstract flowers 26 ─────────────────── */
.af-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 16px;
    max-width: 1040px;
    margin: 0 auto;
}
.af-item {
    display: block;
    position: relative;
    overflow: hidden;
    padding-top: 100%;
    cursor: zoom-in;
    box-shadow: 0 14px 30px rgba(42, 31, 8, 0.18);
}
.af-item img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}
.af-item:hover img { transform: scale(1.04); }
@media (max-width: 767px) { .af-grid { grid-template-columns: 1fr 1fr; grid-gap: 10px; } }

/* ── Texty z editoru (O autorce, kontakt, popis alba) ── */
/* písmo a velikost už nejsou vložené v textu, určuje je web */
.about-me-section .about-text,
.contact-info,
.galery-section .album-popis {
    font-size: 16px;
    line-height: 1.8;
    color: #4f4535;
}
.about-me-section .about-text p,
.contact-info p,
.galery-section .album-popis p { margin: 0 0 12px; }
@media (max-width: 767px) {
    .about-me-section .about-text, .contact-info, .galery-section .album-popis { font-size: 15px; }
}

/* ── Společné ─────────────────────────────────── */
.stranka { background: var(--cream-2); padding: 64px 0 88px; }
.stranka-podtitul {
    text-align: center;
    font-size: 30px;
    font-weight: 300;
    line-height: 1.3;
    color: var(--gold-dim);
    max-width: 760px;
    margin: 0 auto 26px;
}
.stranka-uvod {
    max-width: 720px;
    margin: 0 auto 64px;
    text-align: center;
    font-size: 18px;
    line-height: 1.8;
    color: #5a5040;
}
.stranka-uvod p { margin: 0 0 12px; }
.stranka-btn {
    display: inline-block;
    padding: 14px 30px;
    border: 1px solid var(--gold);
    color: var(--gold-dim);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    transition: background 0.2s, color 0.2s;
}
.stranka-btn:hover { background: var(--gold); color: #fff; }

/* ── Za obrazem ───────────────────────────────── */
.zo-jazyk {
    display: grid;
    grid-template-columns: 5fr 6fr;
    grid-gap: 64px;
    align-items: center;
    max-width: 1040px;
    margin: 0 auto 88px;
}
.zo-jazyk-obracene { grid-template-columns: 6fr 5fr; }
.zo-jazyk-obracene .zo-obraz { order: 2; }
.zo-obraz {
    display: block;
    overflow: hidden;
    box-shadow: 0 22px 44px rgba(42, 31, 8, 0.2);
}
.zo-obraz img { display: block; width: 100%; height: auto; transition: transform 0.6s ease; }
.zo-obraz:hover img { transform: scale(1.03); }
.zo-cislo {
    display: block;
    font-size: 84px;
    font-weight: 200;
    line-height: 0.9;
    color: var(--gold-pale);
}
.zo-nazev {
    font-size: 26px !important;
    font-weight: 400;
    color: var(--gold-dim);
    text-transform: none;
    letter-spacing: 0.5px;
    margin: 6px 0 20px;
}
.zo-text p { font-size: 16px; line-height: 1.85; color: #5a5040; margin: 0 0 14px; }
.zo-text .home-news-more { margin-top: 10px; }
.zo-zaver {
    border: 0;
    max-width: 820px;
    margin: 0 auto;
    padding: 8px 0 0;
    text-align: center;
    font-size: 26px;
    font-weight: 300;
    line-height: 1.55;
    color: #3b2f1c;
}
.zo-zaver::before {
    content: '\201C';
    display: block;
    font-size: 96px;
    line-height: 0.7;
    color: var(--gold);
    margin-bottom: 14px;
}

/* ── Zakázková tvorba ─────────────────────────── */
.zk-uvod {
    display: grid;
    grid-template-columns: 7fr 4fr;
    grid-gap: 64px;
    align-items: center;
    max-width: 1040px;
    margin: 0 auto 80px;
}
.zk-uvod .stranka-uvod { text-align: left; margin: 0; }
.zk-uvod .stranka-uvod p:first-child { font-size: 28px; line-height: 1.4; color: var(--gold-dim); font-weight: 300; margin-bottom: 20px; }
.zk-uvod-foto { display: block; width: 100%; height: auto; box-shadow: 0 22px 44px rgba(42, 31, 8, 0.2); }

.zk-nadpis {
    text-align: center;
    font-size: 12px !important;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--gold-dim);
    margin: 0 0 44px;
}
.zk-prubeh ol {
    list-style: none;
    counter-reset: krok;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    max-width: 1100px;
    margin: 0 auto;
    padding: 0;
}
.zk-prubeh li {
    counter-increment: krok;
    position: relative;
    padding: 0 20px 0 22px;
    border-left: 1px solid var(--gold-pale);
    font-size: 14px;
    line-height: 1.7;
    color: #6a5e48;
}
.zk-prubeh li::before {
    content: counter(krok, decimal-leading-zero);
    display: block;
    font-size: 46px;
    font-weight: 200;
    line-height: 1;
    color: var(--gold);
    margin-bottom: 16px;
}
.zk-prubeh li strong {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #3b2f1c;
    margin-bottom: 8px;
}
.zk-cta { text-align: center; margin-top: 64px; }

/* ── Příběhy klientů ──────────────────────────── */
.pribehy-section { background: #fff; padding: 72px 0 80px; }
.pribehy {
    display: grid;
    grid-template-columns: 4fr 7fr;
    grid-gap: 64px;
    align-items: center;
    max-width: 1040px;
    margin: 0 auto;
}
.pribehy-foto { margin: 0; }
.pribehy-foto img { display: block; width: 100%; height: auto; box-shadow: 0 22px 44px rgba(42, 31, 8, 0.18); }
.pribeh {
    border: 0;
    margin: 0 0 30px;
    padding: 0 0 30px;
    border-bottom: 1px solid var(--border-g);
}
.pribeh:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.pribeh p { font-size: 18px; line-height: 1.7; font-weight: 300; font-style: italic; color: #3b2f1c; margin: 0 0 12px; }
.pribeh cite {
    font-style: normal;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gold-dim);
}
.pribeh cite::before { content: '\2014\00a0'; }
.pribeh-foto { float: left; width: 64px; height: 64px; object-fit: cover; border-radius: 50%; margin: 4px 16px 0 0; }

/* ── Konec stránky: výzva + Přístup do ateliéru ── */
.zaver { background: #2a1f08; padding: 72px 0 84px; border-top: 3px solid var(--gold-dim); }
.zaver-citat { display: block; max-width: 760px; margin: 0 auto 64px; text-align: center; }
.zaver-citat p { font-size: 24px; font-weight: 300; line-height: 1.6; color: #f0d98a; margin: 0 0 22px; }
.zaver-obalka {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gold-light);
    border-bottom: 1px solid rgba(212, 172, 80, 0.4);
    padding-bottom: 4px;
    transition: color 0.2s, border-color 0.2s;
}
.zaver-obalka .fa { font-size: 20px; margin-right: 10px; vertical-align: -2px; }
.zaver-citat:hover .zaver-obalka { color: #fff8e8; border-color: #fff8e8; }
.newsletter-stranka { border-top: 0; padding: 72px 0 96px; }

/* pergamen ze stejných obrázků jako Dopisy z ateliéru (img/newsletter) */
.atelier {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}
.atelier::before {
    content: '';
    display: block;
    padding-top: 15%; /* 90 / 600 */
    background: url('../img/newsletter/pergamen-top.jpg') no-repeat center top;
    background-size: 100% auto;
}
/* střed začíná hned pod horním okrajem (fáze 0) a nese spodní okraj jako průhledný překryv */
.atelier-papir {
    background: #e7d6b0 url('../img/newsletter/pergamen-mid.jpg') repeat-y center top;
    background-size: 100% auto;
}
.atelier-papir::after {
    content: '';
    display: block;
    padding-top: 18.34%; /* 110 / 600 */
    background: url('../img/newsletter/pergamen-bot.png') no-repeat center bottom;
    background-size: 100% auto;
}
.atelier-list { padding: 0 12%; text-align: center; color: #3b2a14; }
.atelier-vstup {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #7a4a12;
    margin-bottom: 10px;
}
.atelier-vstup .fa { margin-right: 8px; }
.atelier-nadpis {
    font-size: 30px !important;
    font-weight: 400;
    text-transform: none;
    color: #5a3a10;
    margin: 0 0 14px;
}
.atelier-text { font-size: 15px; line-height: 1.75; color: #4a3820; margin: 0 0 24px; }
.atelier-radek { display: flex; }
.atelier-radek input {
    flex: 1;
    min-width: 0;
    height: 46px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid #b8955a;
    border-right: 0;
    border-radius: 0;
    background: rgba(255, 250, 235, 0.65);
    font-family: inherit;
    font-size: 16px;
    color: #3b2a14;
    -webkit-appearance: none;
    box-shadow: none;
}
.atelier-radek input:focus { outline: none; border-color: #7a5214; background: rgba(255, 250, 235, 0.9); }
.atelier-radek button {
    border: 0;
    border-radius: 0;
    background: #7a5214;
    color: #fff8e8;
    padding: 0 22px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s;
}
.atelier-radek button:hover { background: #5a3a10; }
.atelier-souhlas {
    display: flex;
    align-items: flex-start;
    margin: 12px 0 0;
    text-align: left;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    color: #6a5030;
    cursor: pointer;
}
/* Materialize schovává nativní checkbox — tady ho chceme vidět */
.atelier-souhlas input[type="checkbox"] {
    position: static;
    left: auto;
    opacity: 1;
    pointer-events: auto;
    -webkit-appearance: checkbox;
    appearance: auto;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin: 1px 10px 0 0;
}
.atelier-hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.newsletter-stranka .stranka-btn { border-color: #7a5214; color: #5a3a10; }
.newsletter-stranka .stranka-btn:hover { background: #7a5214; color: #fff8e8; }

/* ── Výběr z galerie: šipky + počítadlo ───────── */
.hero-slider-section .flex-direction-nav a {
    display: block;
    opacity: 1;
    width: 48px;
    height: 48px;
    top: 50%;
    margin-top: -24px;
    background: rgba(30, 20, 5, 0.55);
    text-indent: 0;
    font-size: 0;
    transition: background 0.2s;
}
.hero-slider-section .flex-direction-nav a:hover { background: rgba(30, 20, 5, 0.8); }
.hero-slider-section .flex-direction-nav a::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 12px;
    border-top: 2px solid #f0d98a;
    border-right: 2px solid #f0d98a;
}
.hero-slider-section .flex-direction-nav .flex-prev { left: 12px; }
.hero-slider-section .flex-direction-nav .flex-next { right: 12px; }
.hero-slider-section .flex-direction-nav .flex-prev::before { -webkit-transform: translate(-30%, -50%) rotate(-135deg); transform: translate(-30%, -50%) rotate(-135deg); }
.hero-slider-section .flex-direction-nav .flex-next::before { -webkit-transform: translate(-70%, -50%) rotate(45deg); transform: translate(-70%, -50%) rotate(45deg); }
.slideshow-pocitadlo { text-align: center; margin-top: 14px; font-size: 12px; letter-spacing: 3px; color: var(--gold-dim); }

/* ── Patička ──────────────────────────────────── */
footer .footer-text { color: #a09070; font-size: 14px; line-height: 1.7; margin: 0 0 12px; }
footer .footer-list { list-style: none; padding: 0; margin: 0; }
footer .footer-list li { margin-bottom: 6px; }
footer .footer-list a { color: var(--gold-pale); }
footer .footer-list .fa { width: 18px; }
footer .footer-odkaz {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gold-light);
    border-bottom: 1px solid rgba(212, 172, 80, 0.4);
}

/* ── Mobil / tablet ───────────────────────────── */
@media (max-width: 991px) {
    .zo-jazyk, .zo-jazyk-obracene, .zk-uvod, .pribehy { grid-template-columns: 1fr; grid-gap: 32px; }
    .zo-jazyk-obracene .zo-obraz { order: 0; }
    .zo-jazyk { margin-bottom: 64px; }
    .zk-uvod-foto, .pribehy-foto img { max-width: 420px; margin: 0 auto; }

    .zk-prubeh ol { grid-template-columns: 1fr; max-width: 560px; }
    .zk-prubeh li { padding: 0 0 30px 74px; }
    .zk-prubeh li::before { position: absolute; left: 18px; top: -4px; font-size: 34px; }
}
@media (max-width: 767px) {
    /* hero: vyšší výřez fotky, text dole na ztmavení, logo jen v liště */
    #main-slider .slides > li { position: relative; height: 62vh; min-height: 360px; max-height: 560px; overflow: hidden; }
    #main-slider .slides > li > img { height: 100%; width: 100%; object-fit: cover; object-position: 50% 25%; }
    #main-slider::after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 55%;
        background: linear-gradient(transparent, rgba(20, 14, 4, 0.82));
        z-index: 2;
        pointer-events: none;
    }
    .slider-hero-text { top: auto !important; bottom: 26px; left: 20px !important; max-width: 80% !important; }
    .slider-hero-name { font-size: 26px !important; letter-spacing: 5px !important; }
    .slider-hero-desc { font-size: 13px !important; }
    .slider-hero-desc br { display: none; }
    .topbar-logo { transform: none; top: 4px; }
    .topbar-logo img { height: 38px; }

    /* nadpisy sekcí: overlay dává všem h2 18px, malé popisky sekcí musí zůstat malé */
    h2.home-news-heading, h2.galerie-kategorie-title, h2.zk-nadpis { font-size: 12px !important; }

    .stranka { padding: 40px 0 56px; }
    .stranka-podtitul { font-size: 22px; }
    .stranka-uvod { font-size: 16px; margin-bottom: 44px; }
    .zo-cislo { font-size: 60px; }
    .zo-zaver { font-size: 20px; }
    .zk-uvod .stranka-uvod p:first-child { font-size: 22px; }
    .pribeh p { font-size: 16px; }
    .zaver { padding: 52px 0 60px; }
    .zaver-citat { margin-bottom: 44px; }
    .zaver-citat p { font-size: 19px; }
    .atelier-list { padding: 0 10%; }
    .atelier-nadpis { font-size: 24px !important; }
    .atelier-radek { display: block; }
    .atelier-radek input { width: 100%; border-right: 1px solid #b8955a; }
    .atelier-radek button { width: 100%; height: 44px; margin-top: 8px; }
}