/* Restaurace Lihovar – styl webu (převod z Elementoru 1:1, bez frameworku) */

/* Písma: Bricolage Grotesque (nadpisy, menu, názvy jídel) + Instrument Sans (text, ceny, tlačítka). Obě SIL OFL 1.1. */
@font-face { font-family: "Bricolage Grotesque"; src: url(fonts/bricolage-ext.woff2) format("woff2"); font-weight: 300 700; font-stretch: 75% 100%; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Bricolage Grotesque"; src: url(fonts/bricolage.woff2) format("woff2"); font-weight: 300 700; font-stretch: 75% 100%; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Instrument Sans"; src: url(fonts/instrument-sans-ext.woff2) format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Instrument Sans"; src: url(fonts/instrument-sans.woff2) format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Instrument Sans"; src: url(fonts/instrument-sans-italic-ext.woff2) format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-style: italic; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Instrument Sans"; src: url(fonts/instrument-sans-italic.woff2) format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-style: italic; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --bg: #141414;
  --hdr: #040404;
  --light: #EAEAEA;
  --primary: #CDD4E8;
  --red: #BC1616;
  --red-h: #BB0000FA;
  --rm: #C33C10;
  --ink: #141414;
  --grey: #727272;
  --display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --text: "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
  --sys: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --pad: 4%;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 170px; }
body { margin: 0; background: var(--bg); color: #333; font-family: var(--text); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; font-kerning: normal; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 400; text-wrap: balance; }
p { margin: 0 0 .9em; }
button { font: inherit; }
.ico { width: 1em; height: 1em; fill: currentColor; flex: none; }
.skip { position: absolute; left: -9999px; top: 0; z-index: 1000; background: #fff; color: #000; padding: 10px 14px; }
.skip:focus { left: 10px; top: 10px; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }

/* ---------- tlačítka ---------- */
.btn { display: inline-flex; align-items: center; gap: 11px; border: 0; cursor: pointer; text-decoration: none; transition: background-color .3s, color .3s; }
.btn .ico { width: 17px; height: 17px; }
.btn--w { background: #fff; color: #000; font: 600 16px/1.2 var(--text); letter-spacing: .005em; padding: 20px 26px; border-radius: 40px; }
.btn--w:hover, .btn--w:focus-visible { background: var(--red-h); color: #fff; }
.btn--red { background: var(--red); color: #fff; font: 600 16px/1.2 var(--text); padding: 20px 26px; border-radius: 40px; gap: 9px; }
.btn--red:hover, .btn--red:focus-visible { background: var(--light); color: var(--ink); }
.btn--dark { background: var(--ink); color: #fff; font: 600 16px/1.2 var(--text); padding: 18px 24px; border-radius: 40px; }
.btn--dark:hover, .btn--dark:focus-visible { background: var(--red-h); }
.fade { animation: fadeIn 1.25s .4s both; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ---------- hlavička ---------- */
.hdr { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; min-height: 80px; padding: 1% var(--pad); background: var(--hdr); }
.hdr > div { flex: 1 1 0; min-width: 0; display: flex; }
.hdr__l { justify-content: flex-start; }
.hdr__c { justify-content: center; }
.hdr__r { justify-content: flex-end; padding-top: 30px; }
.hdr__logo { display: block; margin-top: -3px; }
.hdr__logo img { width: 319px; height: 143px; object-fit: contain; transition: filter .3s; }
.hdr__logo:hover img { filter: brightness(200%); }


/* ---------- úvodní blok (úvod, kontakt) ---------- */
.hero { display: flex; min-height: 830px; padding: 5.52% var(--pad) 0; }
.hero__text { flex: 0 0 55%; min-width: 0; display: flex; flex-direction: column; gap: 20px; padding: 4% 15% 0 0; }
.hero__photo { flex: 0 0 45%; position: relative; overflow: hidden; }
.hero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__title { font: 500 clamp(42px, 4.6vw, 68px)/1.02 var(--display); font-stretch: 88%; letter-spacing: -.025em; color: #fff; }
.hero__lead { font: 400 18px/1.6 var(--text); color: var(--light); margin: 0; max-width: 34em; }
.hero__sig { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; justify-items: center; }
.hero__gm { justify-self: start; width: 76%; }
.hero__podpis { margin: 0; align-self: end; justify-self: end; width: 72%; text-align: center; }
.hero__podpis figcaption { font: 400 14px/1.4 var(--text); color: var(--light); margin-top: 4px; }

/* ---------- aktuality ---------- */
.news { background: #fff; margin: 200px 0 100px; padding: 8% 2% 50px; display: flex; flex-direction: column; gap: 30px; }
.news__title { font: 600 clamp(36px, 3.4vw, 54px)/1 var(--display); font-stretch: 88%; letter-spacing: -.025em; color: var(--ink); }
.news__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: 26px; row-gap: 80px; }
.news__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.news__more { text-align: center; margin: -9px 0 0; }
.news__more[hidden], .news__more .btn[hidden] { display: none; }
.card { display: flex; flex-direction: column; background: #fff; border-radius: 3px; overflow: hidden; }
.card[hidden] { display: none; }
.card__img { position: relative; display: block; padding-bottom: 80%; margin-bottom: 20px; overflow: hidden; background: #f2f2f2; }
.card__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: filter .4s, transform .6s; }
.card:hover .card__img img { transform: scale(1.03); }
.card__text { display: flex; flex-direction: column; flex: 1; }
.card__date { font: 600 13px/1.3 var(--text); letter-spacing: .01em; color: var(--red); margin: 0 0 8px; font-variant-numeric: tabular-nums; }
.card__title { font: 600 21px/1.15 var(--display); letter-spacing: -.012em; color: var(--ink); margin: 0 0 10px; }
.card__title a { text-decoration: none; }
.card__perex { font: 400 15px/1.55 var(--text); color: #555; margin: 0 0 22px; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.card__more { margin-top: auto; margin-bottom: 20px; align-self: flex-start; font: 600 15px/1.2 var(--text); color: var(--ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; transition: color .2s; }
.card__more:hover { color: var(--red); }
.badge { position: absolute; top: 12px; right: 12px; z-index: 2; background: rgba(0, 0, 0, .74); color: #fff; font: 600 12px/1 var(--text); letter-spacing: .01em; padding: 7px 11px; border-radius: 20px; }
.badge:empty { display: none; }
.is-probiha .badge { background: var(--red); }
.card.is-probehlo .card__img img { filter: grayscale(100%); opacity: .75; }
.card.is-probehlo .card__text { opacity: .6; }
.card.is-probehlo:hover .card__text { opacity: .9; }

/* ---------- citát ---------- */
.quote { position: relative; display: flex; min-height: 950px; margin-top: 250px; padding: 0 var(--pad); isolation: isolate; }
.quote__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.quote__bg img { width: 100%; height: 100%; object-fit: cover; }
.quote__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--bg) 0%, #000 92%); opacity: .5; }
.quote__text { flex: 0 0 55%; display: flex; flex-direction: column; justify-content: flex-end; margin: 0; padding: 0 10% 0 0; }
.quote__text p { margin: 0; padding: 7%; font: 400 clamp(22px, 2.1vw, 32px)/1.3 var(--display); letter-spacing: -.012em; color: #fff; }
.quote__side { flex: 0 0 45%; }

/* ---------- obrázkové boxy (menu, nápoje, víno) ---------- */
.ibox { display: flex; align-items: stretch; margin-top: 15%; padding: 0 var(--pad); }
.ibox__img { position: relative; z-index: 1; flex: none; width: 285px; }
.ibox__img img { width: 680px; max-width: none; height: 416px; object-fit: cover; margin-top: -78px; }
.ibox--2 .ibox__img, .ibox--3 .ibox__img { width: 280px; }
.ibox--2 .ibox__img img, .ibox--3 .ibox__img img { height: 395px; margin-top: -65px; }
.ibox__box { flex: 1 0 0; min-height: 400px; display: flex; flex-direction: column; justify-content: center; gap: 30px; padding: 5% 10% 5% 35%; background: var(--light); }
.ibox__title { font: 600 clamp(32px, 2.8vw, 46px)/1.02 var(--display); font-stretch: 90%; letter-spacing: -.022em; color: var(--ink); margin: 8px 0 -14px; }
.ibox__text { font: 400 17px/1.6 var(--text); color: #2b2b2b; margin: 0; max-width: 32em; }
.ibox__btn { margin: 0; }

/* ---------- galerie ---------- */
.gal { margin-top: 150px; padding: 20px; }
.gal__grid { display: flex; flex-wrap: wrap; gap: 14px; }
.gal__item { --h: 200px; flex: var(--r) 1 calc(var(--h) * var(--r)); height: var(--h); position: relative; overflow: hidden; display: block; background: #222; }
.gal__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.gal__item::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0); transition: background-color .8s; }
.gal__item:hover::after { background: rgba(0, 0, 0, .5); }
.gal__fill { flex: 10 1 0; height: 0; }

/* lightbox */
.lb { position: fixed; inset: 0; z-index: 200; background: rgba(0, 0, 0, .92); display: flex; align-items: center; justify-content: center; }
.lb[hidden] { display: none; }
.lb img { max-width: 92vw; max-height: 88vh; width: auto; height: auto; object-fit: contain; }
.lb button { position: absolute; background: none; border: 0; color: #fff; font: 300 44px/1 var(--sys); cursor: pointer; padding: 16px; opacity: .8; }
.lb button:hover { opacity: 1; }
.lb__x { top: 8px; right: 12px; }
.lb__p { left: 8px; top: 50%; transform: translateY(-50%); }
.lb__n { right: 8px; top: 50%; transform: translateY(-50%); }

/* ---------- dorty (úvod) ---------- */
.dorty { display: flex; min-height: 823px; margin-top: 250px; padding: 0 var(--pad); }
.dorty__text { flex: 0 0 55%; min-width: 0; display: flex; flex-direction: column; gap: 20px; padding: 0 15% 0 0; background: linear-gradient(180deg, transparent 0%, var(--bg) 21%); }
.dorty__title { font: 500 clamp(40px, 4.2vw, 64px)/1.02 var(--display); font-stretch: 88%; letter-spacing: -.025em; color: var(--light); }
.dorty__body { font: 400 17px/1.6 var(--text); color: var(--light); max-width: 34em; }
.dorty__body p { margin: 0 0 14.4px; }
.dorty__body ul { margin: 0 0 14.4px; padding-left: 40px; }
.dorty__btn { margin: 30px 0 0; }
.dorty__photo { flex: 0 0 45%; position: relative; overflow: hidden; }
.dorty__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- patička ---------- */
.ftr { margin-top: 15%; }
.ftr__cta { padding: 0 var(--pad); text-align: center; }
.ftr__title { font: 500 clamp(44px, 6.4vw, 100px)/1 var(--display); font-stretch: 84%; letter-spacing: -.035em; color: var(--primary); }
.ftr__sub { font: 400 19px/1.5 var(--text); color: var(--light); margin: 14px 0 0; }
.ftr__btn { margin: 30px 0 0; }
.ftr__bar { display: flex; align-items: center; min-height: 100px; margin-top: 10%; padding: 0 var(--pad) 2%; }
.ftr__contact { flex: 0 0 25%; list-style: none; margin: 0; padding: 0; }
.ftr__contact a { display: inline-flex; align-items: center; gap: 8px; font: 400 15px/1.7 var(--text); color: var(--light); text-decoration: none; }
.ftr__contact a:hover { color: var(--primary); }
.ftr__contact .ico { width: 14px; height: 14px; fill: var(--light); }
.ftr__gm { flex: 0 0 50%; display: flex; justify-content: center; }
.ftr__gm img { width: 64px; }
.ftr__social { flex: 0 0 25%; display: flex; justify-content: flex-end; gap: 22px; }
.ftr__social a { color: var(--light); line-height: 0; transition: color .3s; }
.ftr__social a:hover { color: var(--primary); }
.ftr__social .ico { width: 38px; height: 38px; }

/* ---------- lístky ---------- */
.lhero { display: flex; min-height: 830px; padding: 5.52% var(--pad) 0; background: var(--light); }
.lhero__text { flex: 0 0 55%; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding: 0 10% 0 0; }
.lhero__title { font: 500 clamp(56px, 7.6vw, 124px)/.94 var(--display); font-stretch: 80%; letter-spacing: -.04em; color: var(--ink); }
.lhero__sub { font: 400 clamp(24px, 2.4vw, 38px)/1.15 var(--display); letter-spacing: -.015em; color: var(--ink); margin: 0; }
.lhero__body { max-width: 40em; font: 400 17px/1.6 var(--text); color: #222; }
.lhero__body p { margin: 0 0 14.4px; }
.lhero__body ul { margin: 0 0 14.4px; padding-left: 40px; }
.lhero__btn { margin: 0; align-self: center; }
.lhero__gm { display: block; width: 42%; margin-left: 13%; }
.lhero__photo { flex: 0 0 45%; position: relative; margin-bottom: -80px; z-index: 1; }
.lhero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.msec { display: flex; min-height: 860px; margin-top: 10%; padding: 0 var(--pad); }
.msec--first { min-height: 1150px; margin-top: -50px; }
.msec__photo { flex: 0 0 45%; position: relative; overflow: hidden; }
.msec__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.msec__text { flex: 0 0 55%; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 0 5% 0 10%; }
.msec--r .msec__photo { order: 2; }
.msec--r .msec__text { padding: 0 15% 0 0; }
.msec--noimg .msec__text { flex-basis: 100%; padding: 0 0 0 50%; }
.msec--noimg.msec--r .msec__text { padding: 0 50% 0 0; }
.msec--first .msec__text { padding-top: 6%; }
.msec__title { font: 600 clamp(36px, 3.3vw, 54px)/1.02 var(--display); font-stretch: 88%; letter-spacing: -.025em; color: var(--light); }
.msec__group { font: 500 22px/1.2 var(--display); letter-spacing: -.008em; color: var(--primary); }
.msec__title { margin-bottom: 14px; }
.msec__group { margin: 36px 0 4px; }
.msec__title + .msec__group { margin-top: 0; }
.plist { list-style: none; margin: 30px 0 0; padding: 0; }
.msec__group + .plist { margin-top: 10px; }
.plist + .msec__group { margin-top: 30px; }
.plist li + li { margin-top: 26px; }
.plist__head { display: flex; align-items: baseline; gap: 12px; font: 500 20px/1.25 var(--display); letter-spacing: -.008em; color: #F4F4F4; }
.plist__name { flex: 0 1 auto; max-width: 72%; }
.plist__lead { flex: 1 1 auto; min-width: 16px; border-bottom: 1.5px dotted rgba(205, 212, 232, .35); transform: translateY(-.3em); }
.plist__price { flex: none; font: 500 16px/1.4 var(--text); font-variant-numeric: tabular-nums; color: var(--primary); text-align: right; white-space: nowrap; }
.plist__desc { margin: 6px 0 0; max-width: 34em; font: 400 15px/1.5 var(--text); color: #A8A8A8; }

.kose { margin-top: -50px; min-height: 1150px; padding: 13.8% var(--pad) 0; }
.kose__title { font: 600 clamp(32px, 3vw, 48px)/1.05 var(--display); font-stretch: 88%; letter-spacing: -.02em; color: var(--light); text-align: center; margin-bottom: 40px; }
.kose__grid { display: grid; grid-template-columns: repeat(3, 31.3%); gap: 0; }
.kos { text-align: center; }
.kos { padding: 0 10px; }
.kos__title { font: 600 clamp(28px, 2.4vw, 38px)/1.08 var(--display); font-stretch: 90%; letter-spacing: -.02em; color: var(--primary); margin-bottom: 36px; }
.kos__list { list-style: none; margin: 0; padding: 0; font: 400 16px/1.55 var(--text); color: var(--light); }
.kos__list li { margin: 0 0 14.4px; }

/* ---------- detail aktuality ---------- */
.post { display: flex; align-items: flex-start; }
.post__img { flex: 0 0 25%; position: sticky; top: var(--hdr-h, 165px); }
.post__img img { width: 100%; height: calc(100vh - var(--hdr-h, 165px)); object-fit: cover; }
.post__main { flex: 0 0 62.667%; }
.post__box { background: #fff; padding: 80px 150px 150px; color: var(--ink); }
.post__back { margin: 0 0 30px; font: 500 14px/1.4 var(--text); }
.post__back a { color: var(--grey); text-decoration: none; }
.post__back a:hover { color: var(--red); }
.post__title { font: 600 clamp(36px, 3.4vw, 54px)/1.04 var(--display); font-stretch: 88%; letter-spacing: -.025em; color: var(--ink); }
.post__date { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 16px 0 0; font: 500 22px/1.3 var(--display); letter-spacing: -.01em; color: #444; font-variant-numeric: tabular-nums; }
.post__date .badge { position: static; font-size: 12px; }
.post.is-probehlo .post__img img { filter: grayscale(100%); }
.post__perex { padding-top: 26px; font: 400 20px/1.55 var(--text); color: #1f1f1f; max-width: 34em; white-space: pre-line; }
.post__perex p { margin: 0; }
.post__body { padding-top: 25px; }
.post__cta { margin: 50px 0 0; }

/* formátovaný text z editoru */
.rich { font: 400 17px/1.65 var(--text); }
.post__body.rich { color: #3a3a3a; }
.rich p { margin: 0 0 2px; min-height: 1em; }
.post__body.rich p { margin: 0 0 .7em; }
.rich strong { font-weight: 600; color: var(--ink); }
.rich h2, .rich h3, .rich h4 { font-family: var(--display); font-weight: 600; color: var(--ink); letter-spacing: -.012em; line-height: 1.15; margin: 1.9em 0 .7em; }
.rich h2 strong, .rich h3 strong, .rich h4 strong { font-weight: inherit; }
.post__body h2::before, .post__body h3::before, .post__body h4::before { content: ""; display: block; width: 32px; height: 2px; margin: 0 0 .75em; background: var(--red); }
.post__body h2[style*="center"]::before, .post__body h3[style*="center"]::before, .post__body h4[style*="center"]::before { margin-inline: auto; }
.rich h2 { font-size: 32px; }
.rich h3 { font-size: 26px; }
.rich h4 { font-size: 22px; }
.rich ul, .rich ol { margin: 0 0 14.4px; padding-left: 40px; }
.rich a { color: var(--red); text-underline-offset: 3px; }
.rich a.btn, .rich .btn { display: inline-flex; background: var(--ink); color: #fff; font: 600 16px/1.2 var(--text); padding: 18px 26px; border-radius: 40px; text-decoration: none; }
.rich a.btn:hover { background: var(--red-h); }
.rich hr { border: 0; border-top: 1px solid #ddd; margin: 24px 0; }
.lhero .rich a { color: var(--ink); }

.news--more { margin: 120px 0 0; padding-top: 80px; }

/* ---------- kontakt ---------- */
.hero--kontakt .hero__text { background: linear-gradient(180deg, transparent 0%, var(--bg) 20%); }
.kontakt__text { max-width: 34em; font: 400 17px/1.6 var(--text); color: var(--light); }
.kontakt__text p { margin: 0 0 14.4px; }
.kontakt__btn { margin: 30px 0 0; display: flex; flex-wrap: wrap; gap: 14px; }
.kontakt__addr { max-width: 460px; font: 400 17px/1.6 var(--text); font-style: normal; color: var(--light); margin-bottom: 14px; }
.kontakt__addr a { color: var(--light); text-decoration: none; }
.kontakt__addr a:hover { text-decoration: underline; }
.kontakt__hours { max-width: 460px; font: 400 22px/1.35 var(--display); letter-spacing: -.01em; color: var(--light); }
.kontakt__hours p { margin: 0 0 14.4px; }
.map { position: relative; height: 699px; background: #1d1d1d url(img/map-bg.webp) center / cover no-repeat; }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.map__ph { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; padding: 20px; background: rgba(20, 20, 20, .55); }
.map__ph p { margin: 0 0 12px; }
.map__addr { font: 500 26px/1.25 var(--display); letter-spacing: -.012em; color: #fff; }
.map__ext { display: inline-block; margin-left: 18px; color: var(--light); font: 500 15px/1 var(--text); }
.map__note { font: 400 13px/1.4 var(--text); color: #bbb; }
.map.is-on .map__ph { display: none; }

/* ---------- 404 ---------- */
.hero--404 { min-height: 520px; }

/* ---------- animace při scrollu (jen když je zapnutý JS a uživatel nechce omezit pohyb) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .js .fx-par img { will-change: transform; }
}
@media (prefers-reduced-motion: reduce) {
  .fade { animation: none; }
  html { scroll-behavior: auto; }
}

/* =================== tablet (≤ 1024 px) =================== */
@media (max-width: 1024px) {
  html { scroll-padding-top: 160px; }
  .hero { min-height: 465px; }
  .hero__text { padding: 4% 10% 0 0; }
  .news { padding-left: 5%; padding-right: 5%; }
  .news__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 71px; }
  .quote { min-height: 465px; margin-top: 20%; }
  .ibox { margin-top: 32%; }
  .ibox__img, .ibox--2 .ibox__img, .ibox--3 .ibox__img { width: 200px; }
  .ibox__img img, .ibox--2 .ibox__img img, .ibox--3 .ibox__img img { width: 350px; height: 250px; margin-top: -65px; }
  .ibox__box { min-height: 325px; padding: 5% 4% 5% 25%; }
  .gal__item { --h: 150px; }
  .gal__grid { gap: 10px; }
  .dorty { min-height: 465px; margin-top: 20%; }
  .dorty__text { padding-right: 5%; }
  .dorty__photo { flex-basis: 44%; }
  .ftr__bar { flex-wrap: wrap; row-gap: 80px; }
  .ftr__contact, .ftr__gm, .ftr__social { flex-basis: 100%; }
  .ftr__contact { text-align: center; }
  .ftr__social { justify-content: center; }
  .lhero { min-height: 465px; }
  .lhero__text { padding-right: 4%; }
  .lhero__photo { flex-basis: 44%; margin-bottom: -40px; }
  .msec, .msec--first { flex-wrap: wrap; min-height: 420px; gap: 50px 0; margin-top: 15%; }
  .msec__photo { flex-basis: 100%; min-height: 430px; order: -1 !important; }
  .msec__text, .msec--r .msec__text, .msec--first .msec__text, .msec--noimg .msec__text, .msec--noimg.msec--r .msec__text { flex-basis: 100%; padding: 0; }
  .kose { min-height: 0; padding-top: 15%; margin-top: 0; }
  .kose__grid { grid-template-columns: 1fr; gap: 60px; }
  .post__box { padding: 60px 50px 80px; }
  .post__main { flex-basis: 75%; }
}

/* =================== mobil (≤ 767 px) =================== */
@media (max-width: 767px) {
  :root { --pad: 6%; }
  html { scroll-padding-top: 150px; }
  .hdr { padding: 0 var(--pad); }
  .hdr__l { flex: 0 0 20%; }
  .hdr__c { flex: 0 0 80%; justify-content: flex-end; }
  .hdr__r { display: none !important; }
  .hdr__logo img { width: 100px; }
  .hero { flex-wrap: wrap; padding: 0 var(--pad); min-height: 0; }
  .hero__photo { order: -1; flex-basis: 100%; min-height: 450px; }
  .hero__text { flex-basis: 100%; padding: 0; z-index: 5; }
  .hero--kontakt .hero__text { margin-top: -100px; }
  .hero__title { padding-top: 30px; }
  .hero--kontakt .hero__title { padding-top: 0; }
  .hero__sig { grid-template-columns: minmax(0, 1fr); }
  .hero__gm { justify-self: center; width: 62%; padding: 25px; box-sizing: content-box; max-width: 62%; }
  .hero__podpis { justify-self: center; }
  .news__grid, .news__grid--3 { grid-template-columns: 1fr; row-gap: 30px; }
  .card__img { padding-bottom: 50%; }
  .card__title { margin-bottom: 9px; }
  .quote { flex-wrap: wrap; flex-direction: column; margin-top: 30%; min-height: 0; gap: 50px; }
  .quote__bg img { object-position: top center; }
  .quote__side { order: -1; min-height: 214px; flex: none; }
  .quote__text { flex: none; padding: 0; }
  .ibox { flex-direction: column; margin-top: 0; padding: 0; }
  .ibox--1 { margin-top: 30%; }
  .ibox__img, .ibox--2 .ibox__img, .ibox--3 .ibox__img { width: 100%; }
  .ibox__img img, .ibox--2 .ibox__img img, .ibox--3 .ibox__img img { width: 100%; height: 350px; margin: 0; }
  .ibox__box { flex: none; padding: 14% var(--pad); min-height: 0; }
  .gal { margin-top: 100px; }
  .dorty { flex-direction: column; margin-top: 30%; gap: 50px; min-height: 0; }
  .dorty__text { padding: 0; flex: none; }
  .dorty__photo { order: -1; flex: none; min-height: 350px; }
  .ftr { margin-top: 30%; }
  .ftr__btn { margin-top: 20px; }
  .ftr__bar { margin-top: 30%; padding-bottom: 4%; row-gap: 50px; }
  .ftr__social { gap: 0; }
  .ftr__social a { padding: 8px; }
  .ftr__social .ico { width: 14px; height: 14px; }
  .lhero { flex-wrap: wrap; gap: 30px 0; padding: 7% var(--pad) 0; min-height: 0; }
  .lhero__photo { order: -1; flex-basis: 100%; min-height: 350px; margin: 0; }
  .lhero__text { flex-basis: 100%; padding: 0; }
  .lhero__gm { width: 62%; margin: 0 auto; align-self: center; }
  .msec, .msec--first { margin-top: 30%; padding: 0 var(--pad); gap: 50px 0; }
  .msec__photo { min-height: 380px; }
  .plist__name { max-width: 68%; }
  .post__perex { font-size: 18px; }
  .lhero__sub { font-size: 24px; }
  .ftr__sub { font-size: 17px; }
  .post { flex-direction: column; }
  .post__img { position: static; flex: none; width: 100%; }
  .post__img img { height: 220px; }
  .post__main { flex: none; width: 100%; }
  .post__box { padding: 28px 22px 44px; }
  .rich h3 { font-size: 23px; }
  .map { height: 480px; }
  .map__ext { display: block; margin: 16px 0 0; }
}

/* =================== hlavička: tlačítko menu =================== */
.hdr__burger { display: inline-flex; align-items: center; gap: 14px; background: none; border: 0; padding: 10px 0; margin: 0; color: var(--light); cursor: pointer; font: 500 15px/1 var(--text); letter-spacing: .01em; }
.hdr__lines { position: relative; width: 30px; height: 11px; border-top: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transition: width .3s; }
.hdr__burger:hover .hdr__lines { width: 22px; }
.hdr__burger:hover .hdr__mtxt { color: var(--primary); }

/* =================== menu: celoobrazovkový „lístek“ =================== */
.nav { --mist: #CDD4E8; --slate: #4F5669; --dots: rgba(20, 20, 20, .32); position: fixed; inset: 0; z-index: 100; }
.nav[hidden] { display: none; }
.nav__in {
  position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain;
  display: grid; grid-template-columns: minmax(0, 1fr) min(40vw, 660px); grid-template-rows: auto 1fr auto;
  background: var(--mist); color: var(--ink);
  clip-path: inset(0 0 100% 0); transition: clip-path .6s cubic-bezier(.76, 0, .24, 1);
}
.nav.is-open .nav__in { clip-path: inset(0 0 0 0); }

.nav__top { grid-column: 1; grid-row: 1; display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 112px; padding: 0 6vw 0 4%; }
.nav__close { display: inline-flex; align-items: center; gap: 14px; background: none; border: 0; padding: 10px 0; cursor: pointer; font: 500 15px/1 var(--text); color: var(--ink); }
.nav__x { position: relative; width: 30px; height: 30px; }
.nav__x::before, .nav__x::after { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1.5px; background: currentColor; transition: transform .35s; }
.nav__x::before { transform: rotate(45deg); }
.nav__x::after { transform: rotate(-45deg); }
.nav__close:hover .nav__x::before { transform: rotate(135deg); }
.nav__close:hover .nav__x::after { transform: rotate(45deg); }
.nav__cta { flex: none; background: var(--red); color: #fff; font: 600 15px/1 var(--text); padding: 17px 26px; border-radius: 40px; text-decoration: none; transition: background-color .25s; }
.nav__cta:hover, .nav__cta:focus-visible { background: #8f0d0d; }

.nav__list { grid-column: 1; grid-row: 2; align-self: center; display: flex; flex-direction: column; padding: 2vh 6vw 4vh calc(4% + 34px); max-width: 1060px; }
.nav__list a { display: flex; align-items: baseline; gap: 18px; padding: .1em 0; color: var(--ink); text-decoration: none; outline-offset: 6px; }
.nav__label { position: relative; flex: none; font: 400 clamp(26px, min(3.3vw, 5.2vh), 56px)/1.1 var(--display); font-stretch: 92%; letter-spacing: -.03em; white-space: nowrap; transition: transform .35s cubic-bezier(.2, .7, .2, 1), color .25s; }
.nav__lead { flex: 1 1 auto; min-width: 28px; border-bottom: 1.5px dotted var(--dots); transform: translateY(-.32em); transition: border-color .25s; }
.nav__note { flex: 0 1 auto; max-width: 44%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 14px/1.3 var(--text); color: var(--slate); transition: color .25s; }
.nav__list a:hover .nav__label, .nav__list a:focus-visible .nav__label { transform: translateX(12px); }
.nav__list a:hover .nav__lead, .nav__list a:focus-visible .nav__lead { border-bottom-color: var(--ink); }
.nav__list a:hover .nav__note, .nav__list a:focus-visible .nav__note { color: var(--ink); }
.nav__list:hover a:not(:hover) .nav__label { color: rgba(20, 20, 20, .5); }
.nav__list a[aria-current] .nav__label::before { content: ""; position: absolute; left: -32px; top: 50%; width: 10px; height: 10px; margin-top: -4px; border-radius: 50%; background: var(--red); }

.nav__info { grid-column: 1; grid-row: 3; display: grid; grid-template-columns: auto auto 1fr; align-items: start; gap: 24px 64px; margin: 0 6vw 0 4%; padding: 26px 0 38px 34px; border-top: 1px solid rgba(20, 20, 20, .16); }
.nav__h { margin: 0 0 8px; font: 500 13px/1.4 var(--text); color: var(--slate); }
.nav__hours, .nav__contact { list-style: none; margin: 0; padding: 0; font: 400 15px/1.65 var(--text); color: var(--ink); }
.nav__hours li, .nav__contact li { white-space: nowrap; }
.nav__hours li.is-today { font-weight: 600; }
.nav__hours li.is-today::after { content: "dnes"; margin-left: 10px; font-size: 12px; font-weight: 600; color: var(--red); }
.nav__contact a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(20, 20, 20, .25); transition: border-color .25s; }
.nav__contact a:hover { border-bottom-color: var(--ink); }
.nav__block--end { justify-self: end; align-self: end; display: flex; align-items: center; gap: 22px; }
.nav__social { display: flex; gap: 16px; }
.nav__social a { color: var(--ink); line-height: 0; transition: opacity .25s; }
.nav__social a:hover { opacity: .6; }
.nav__social .ico { width: 22px; height: 22px; }
.nav__gm { display: block; width: 58px; }

.nav__photo { grid-column: 2; grid-row: 1 / -1; position: relative; overflow: hidden; background: var(--bg); }
.nav__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .55s ease, transform 1.4s cubic-bezier(.2, .7, .2, 1); }
.nav__photo img.is-on { opacity: 1; }
.nav.is-open .nav__photo img { transform: scale(1); }

/* otevření: panel sjede shora, obsah se objeví postupně (jen při otevírání) */
.nav__top > *, .nav__list a, .nav__info { opacity: 0; transform: translateY(14px); transition: opacity .2s, transform .2s; }
.nav.is-open .nav__top > *, .nav.is-open .nav__list a, .nav.is-open .nav__info { opacity: 1; transform: none; transition: opacity .5s ease, transform .6s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(.24s + var(--i, 0) * .035s); }
.nav.is-open .nav__info { --i: 10; }

.nav :focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }

@media (max-height: 800px) and (min-width: 1025px) {
  .nav__top { min-height: 84px; }
  .nav__info { padding-top: 18px; padding-bottom: 24px; }
}
@media (max-width: 1024px) {
  .nav__in { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; align-content: start; }
  .nav__photo { display: none; }
  .nav__top { min-height: 96px; padding: 0 5%; }
  .nav__list { align-self: start; padding: 3vh 5% 5vh calc(5% + 30px); max-width: none; }
  .nav__label { font-size: clamp(32px, 5.6vw, 50px); }
  .nav__info { margin: 0 5%; padding-left: 30px; grid-template-columns: auto 1fr; }
  .nav__block--end { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 767px) {
  .hdr__mtxt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hdr__lines { width: 26px; }
  .nav__top { min-height: 72px; padding: 0 6%; }
  .nav__x { width: 24px; height: 24px; }
  .nav__cta { font-size: 15px; padding: 13px 18px; }
  .nav__list { padding: 6px 6% 28px; }
  .nav__list a { flex-direction: column; align-items: flex-start; gap: 3px; padding: 11px 0 12px; border-bottom: 1px solid rgba(20, 20, 20, .12); }
  .nav__list a:last-child { border-bottom: 0; }
  .nav__label { font-size: 30px; line-height: 1.12; white-space: normal; }
  .nav__lead { display: none; }
  .nav__note { max-width: 100%; font-size: 13.5px; }
  .nav__list a:hover .nav__label, .nav__list a:focus-visible .nav__label { transform: none; }
  .nav__list:hover a:not(:hover) .nav__label { color: inherit; }
  .nav__list a[aria-current] .nav__label::before { position: static; display: inline-block; vertical-align: middle; margin: -4px 10px 0 0; width: 8px; height: 8px; }
  .nav__info { grid-template-columns: 1fr; gap: 22px; margin: 0 6%; padding: 22px 0 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .nav__in, .nav__top > *, .nav__list a, .nav__info, .nav__photo img, .nav__label { transition: none !important; }
  .nav__photo img { transform: none; }
}
