/**
 * Sablona 2026-007 Domov - homepage (sekce/uvod.latte + sekce/uvod/*.latte, ANALYZA kap. 2.9, artboard 01, 06.11).
 * Linkuje jadro podle sekce (css/sekce/uvod.css) za _core/css/uvod.css. Jen tokeny, bez !important.
 */
/* .tpl-uvod jadra je flex s mezerou a .tpl-uvod-sekce ma margin 0 (css/uvod.css jadra se linkuje az v tele stranky)
   -> rytmus sekci 96 / 56 px pres .dm-uvod > .dm-sekce (vyssi specificita) */
.tpl-uvod.dm-uvod { --tpl-uvod-gap: 0px; gap: 0; }
.dm-uvod > .dm-sekce { margin-top: var(--tpl-section-gap); }
.dm-uvod > .dm-sekce:first-child { margin-top: 0; }
body.sekce_uvod div#in_body { padding-top: 0; }

/* --- hero: fotka 9:4 pres sirku obsahu, panel 480 preckryva levy dolni roh o 80 px --- */
.dm-uvod > .dm-hero { position: relative; margin: 0 calc(-1 * var(--tpl-gutter)) 80px; }
.dm-hero-foto { display: block; aspect-ratio: 9 / 4; background: var(--tpl-surface-2); overflow: hidden; }
.dm-hero-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dm-hero-panel {
    position: absolute; left: var(--tpl-gutter); bottom: -80px; z-index: 1; width: 480px; max-width: calc(100% - 2 * var(--tpl-gutter));
    padding: 40px 40px 36px; display: flex; flex-direction: column; gap: 18px; box-sizing: border-box;
    background: var(--tpl-body-bg); border-top-right-radius: var(--tpl-area-radius);
}
.dm-hero--bez-foto { margin-bottom: 0; }
.dm-hero--bez-foto .dm-hero-panel { position: static; width: auto; max-width: 720px; padding: 48px var(--tpl-gutter) 0; }
.dm-hero-eyebrow { margin: 0; font-size: 13px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--tpl-text-light); }
#prostredek .dm-hero-nadpis,
.dm-hero-nadpis { margin: 0; font-size: calc(44px - var(--tpl-head-shrink)); line-height: 1.15; color: var(--tpl-primary); }
.dm-hero-text { margin: 0; font-size: 17px; line-height: 1.55; color: var(--tpl-text); }
.dm-hero-akce { display: flex; flex-wrap: wrap; gap: 12px; margin: 4px 0 0; }

/* --- USP: 4 ikony 32 px + text, linka dole --- */
.dm-usp { margin-top: 0; }
.dm-usp-seznam { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 40px 0; list-style: none; border-bottom: 1px solid var(--tpl-line); }
.dm-usp-i { display: flex; align-items: center; gap: 16px; font-size: 16px; line-height: 1.4; }
.dm-usp-i strong { font-weight: 500; }
.dm-usp-i .dm-ico { color: var(--tpl-primary); }
.dm-usp-popis { display: block; font-size: 14px; color: var(--tpl-text-light); }

/* --- mistnosti: dlazdice 4:3 ve 3 (4) sloupcich --- */
.dm-mistnosti-seznam { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 24px; row-gap: 40px; margin: 0; padding: 0; list-style: none; }
.dm-mistnosti--4 .dm-mistnosti-seznam { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dm-mistnost { display: flex; flex-direction: column; gap: 14px; color: var(--tpl-text); text-decoration: none; }
.dm-mistnost:hover { color: var(--tpl-text); text-decoration: none; }
.dm-mistnost-foto { display: block; aspect-ratio: 4 / 3; border-radius: var(--tpl-thumb-radius); background: var(--tpl-surface-2); overflow: hidden; }
.dm-mistnost-foto img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.dm-mistnost:hover .dm-mistnost-foto img { transform: scale(1.02); }
.dm-mistnost-b { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.dm-mistnost-n { font: var(--tpl-head-weight) calc(20px - var(--tpl-head-shrink))/1.3 var(--tpl-font-head); letter-spacing: var(--tpl-head-ls); color: var(--tpl-primary); }
.dm-mistnost:hover .dm-mistnost-n { text-decoration: underline; text-underline-offset: 4px; }
.dm-mistnost-pocet { font-size: 14px; color: var(--tpl-text-light); white-space: nowrap; }

/* --- karusel s taby: nadpis + sipky vpravo nahore, taby s linkou, 4 karty, tecky --- */
.dm-karusel { position: relative; --tpl-uvod-karet: 4; }
.dm-karusel-hl { margin-bottom: 8px; padding-right: 108px; }
.dm-karusel:not(.tpl-uvod-karusel--taby) .dm-karusel-hl { margin-bottom: 28px; }
.dm-karusel-lbl { margin-left: 10px; vertical-align: middle; }
.dm-karusel .tpl-uvod-karusel-sipky.dm-karusel-sipky { position: absolute; top: 0; right: 0; display: flex; gap: 8px; margin: 0; }
.dm-karusel .tpl-uvod-karusel-sipky[hidden] { display: none; }
.dm-arr.tpl-uvod-karusel-sipka { width: 44px; height: 44px; border: 1px solid var(--tpl-border); border-radius: var(--tpl-radius); background: var(--tpl-surface); color: var(--tpl-text); }
.dm-arr.tpl-uvod-karusel-sipka::before { content: none; }
.dm-arr.tpl-uvod-karusel-sipka:disabled { color: var(--tpl-disabled); opacity: 1; }
.dm-taby.tpl-uvod-taby { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin: 0 0 28px; border-bottom: 1px solid var(--tpl-line); }
.dm-tab.tpl-uvod-tab { min-height: 48px; margin-bottom: -1px; padding: 0 16px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--tpl-text-light); font: 500 16px/1 var(--tpl-font); }
.dm-tab.tpl-uvod-tab:hover { color: var(--tpl-text); }
.dm-tab.tpl-uvod-tab--aktivni,
.dm-tab.tpl-uvod-tab[aria-selected="true"] { color: var(--tpl-primary); border-bottom-color: var(--tpl-primary); background: transparent; }
.dm-taby .dm-sekce-vse { margin-left: auto; }
.dm-karusel .tpl-uvod-karusel-pas { gap: 0; margin: 0 -12px; padding: 0 0 4px; scroll-padding: 0; }
.dm-karusel .tpl-uvod-karusel-polozka > article.polozka { flex: 1 1 auto; width: 100%; }
.dm-karusel .tpl-uvod-karusel-tecky { margin-top: 16px; }
.dm-karusel .tpl-uvod-karusel-tecka::before { background: var(--tpl-border); }
.dm-karusel .tpl-uvod-karusel-tecka[aria-current="true"]::before { width: 24px; border-radius: 4px; background: var(--tpl-primary); transform: none; }

/* --- inspirace: 2 bannery 4:3, nadpis H2 28 + perex + odkaz --- */
.dm-inspirace-mrizka { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.dm-inspirace--3 .dm-inspirace-mrizka { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dm-insp { display: flex; flex-direction: column; gap: 18px; }
.dm-insp-foto { display: block; aspect-ratio: 4 / 3; border-radius: var(--tpl-thumb-radius); background: var(--tpl-surface-2); overflow: hidden; }
.dm-insp-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
#prostredek .dm-insp-n,
.dm-insp-n { margin: 0 0 8px; font-size: calc(28px - var(--tpl-head-shrink)); line-height: 1.2; }
.dm-insp-t { margin: 0 0 10px; color: var(--tpl-text-light); }
.dm-insp-a { color: var(--tpl-link); }

/* --- Radce: 3 karty clanku --- */
.dm-clanky-seznam { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }

/* --- O nas / showroom na secondary --- */
.dm-uvod > .dm-onas { margin-left: calc(-1 * var(--tpl-gutter)); margin-right: calc(-1 * var(--tpl-gutter)); background: var(--tpl-secondary); color: var(--tpl-text); }
.dm-onas-in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: center; padding: 64px var(--tpl-gutter); }
.dm-onas--foto .dm-onas-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.dm-onas-foto { display: block; aspect-ratio: 4 / 3; border-radius: var(--tpl-thumb-radius); background: var(--tpl-surface-2); overflow: hidden; }
.dm-onas-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dm-onas-text { margin: 0 0 20px; max-width: 560px; }
.dm-onas-info { display: grid; gap: 12px; margin: 0 0 28px; }
.dm-onas-info > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 12px; }
.dm-onas-info dt { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 500; }
.dm-onas-info dt .dm-ico { color: var(--tpl-primary); }
.dm-onas-info dd { margin: 0; }

/* --- recenze: 3 citace na bile plose --- */
.dm-recenze-souhrn { margin: 0; font-size: 15px; color: var(--tpl-text-light); }
.dm-recenze-souhrn strong { color: var(--tpl-text); font-size: 18px; }
.dm-recenze-seznam { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.dm-citace { display: flex; flex-direction: column; gap: 14px; padding: 28px; border-radius: var(--tpl-area-radius); background: var(--tpl-surface); }
.dm-citace-text { margin: 0; padding: 0; border: 0; font-size: 16px; line-height: 1.6; }
.dm-citace-text p { margin: 0; }
.dm-citace-autor { margin: 0; font-size: 15px; }
.dm-citace-produkt { margin: 0; font-size: 13px; color: var(--tpl-text-light); }

/* --- znacky: loga monochromne mezi linkami --- */
.dm-znacky-seznam { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--tpl-line); border-bottom: 1px solid var(--tpl-line); }
.dm-znacky-seznam li + li { border-left: 1px solid var(--tpl-line); }
.dm-znacky-seznam a { display: flex; align-items: center; justify-content: center; height: 96px; padding: 12px 20px; }
.dm-znacky-seznam img { max-height: 48px; width: auto; filter: grayscale(1); opacity: .7; mix-blend-mode: multiply; transition: filter var(--tpl-transition), opacity var(--tpl-transition); }
.dm-znacky-seznam a:hover img { filter: none; opacity: 1; }

/* --- SEO text sbaleny na 4 radky --- */
.dm-seo { max-width: 880px; }
.dm-seo-text { color: var(--tpl-text-light); font-size: 15px; }
.dm-seo-text h2, .dm-seo-text h3 { font-size: 20px; color: var(--tpl-primary); }

/* ---------------- tablet ---------------- */
@media (max-width: 1024px) {
    .dm-karusel { --tpl-uvod-karet: 3; }
    .dm-usp-seznam { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dm-mistnosti--4 .dm-mistnosti-seznam { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dm-onas--foto .dm-onas-in { gap: 32px; }
    .dm-znacky-seznam { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dm-znacky-seznam li:nth-child(4) { border-left: 0; }
    .dm-znacky-seznam li:nth-child(n+4) { border-top: 1px solid var(--tpl-line); }
}

/* ---------------- mobil ≤ 768 px ---------------- */
@media (max-width: 768px) {
    .dm-uvod > .dm-hero { margin-bottom: 0; }
    .dm-hero-foto { aspect-ratio: 4 / 3; }
    .dm-hero-panel { position: static; width: auto; max-width: none; padding: 24px var(--tpl-gutter) 8px; gap: 14px; border-radius: 0; }
    #prostredek .dm-hero-nadpis, .dm-hero-nadpis { font-size: calc(30px - var(--tpl-head-shrink)); }
    .dm-hero-text { font-size: 16px; }
    .dm-hero-akce .dm-btn { width: 100%; }
    .dm-usp-seznam { gap: 20px 16px; padding: 28px 0; }
    .dm-usp-i { flex-direction: column; align-items: flex-start; gap: 10px; font-size: 15px; }
    .dm-mistnosti-seznam,
    .dm-mistnosti--4 .dm-mistnosti-seznam { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; row-gap: 24px; }
    .dm-mistnost { gap: 8px; }
    .dm-mistnost-b { flex-direction: column; gap: 0; }
    .dm-mistnost-n { font-size: calc(18px - var(--tpl-head-shrink)); }
    .dm-karusel { --tpl-uvod-karet: 1.5; }
    .dm-karusel-hl { padding-right: 0; }
    .dm-karusel .tpl-uvod-karusel-sipky.dm-karusel-sipky { display: none; }
    .dm-karusel .tpl-uvod-karusel-pas { margin: 0 calc(-1 * var(--tpl-gutter)); padding: 0 calc(var(--tpl-gutter) - 8px); scroll-padding: 0 calc(var(--tpl-gutter) - 8px); }
    .dm-taby.tpl-uvod-taby { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-bottom: 16px; }
    .dm-taby .dm-tab { flex: none; padding: 0 12px; font-size: 15px; }
    .dm-taby .dm-sekce-vse { display: none; }
    .dm-inspirace-mrizka,
    .dm-inspirace--3 .dm-inspirace-mrizka { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    #prostredek .dm-insp-n, .dm-insp-n { font-size: calc(24px - var(--tpl-head-shrink)); }
    .dm-clanky-seznam,
    .dm-recenze-seznam { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 78%; gap: 12px; margin: 0 calc(-1 * var(--tpl-gutter)); padding: 0 var(--tpl-gutter) 8px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 var(--tpl-gutter); scrollbar-width: none; }
    .dm-clanky-seznam > li,
    .dm-recenze-seznam > li { scroll-snap-align: start; }
    .dm-onas-in,
    .dm-onas--foto .dm-onas-in { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 40px var(--tpl-gutter); }
    .dm-onas-info > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
    .dm-citace { padding: 20px; }
    .dm-znacky-seznam { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dm-znacky-seznam li:nth-child(odd) { border-left: 0; }
    .dm-znacky-seznam li:nth-child(n+3) { border-top: 1px solid var(--tpl-line); }
    .dm-znacky-seznam a { height: 80px; }
}
