/* Křižovatka — úvodní stránka (index.html). Navazuje na css/zaklad.css. */

/* ---------- drobnosti mimo společný základ ---------- */
.preskocit{position:absolute;left:16px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:4px;font-weight:700;text-decoration:none}
.preskocit:focus{top:12px}
html{scroll-padding-top:84px}
body{overflow-x:clip}
.na-zelene :focus-visible{outline-color:#fff}

/* =====================================================================
   OPENER „ČTYŘI CESTY“
   Kříž ±40° od svislice, průsečík ve středu plochy. Každý výsek je tlačítko
   přes celou plochu oříznuté clip-path trojúhelníkem: střed + dva body daleko
   na ramenech (L = 4000 px → L·sin40 = 2571 px, L·cos40 = 3064 px).
   Rozložení: vlevo Dnes vaříme, nahoře Akce, vpravo Kudy k nám, dole Jídelní lístek.
   Mobil/tablet: čtvercový kříž, obsah ťuknutého výseku pod ním.
   Desktop (≥ 1100 px, ≥ 600 px výšky): obsah se ukáže přímo ve výseku, bez karty.
   Všechny prvky křížku leží v jedné buňce mřížky (grid-area: kriz), obsahy
   na mobilu v buňce „obsah“ pod ním, na desktopu ve stejné buňce jako kříž.
   ===================================================================== */
.cesty{
  --L-x:2571px; --L-y:3064px;
  position:relative;background:var(--g-tma);color:#fff;isolation:isolate;
  padding-bottom:28px;
}
.krizovatka{
  position:relative;display:grid;grid-template-columns:minmax(0, 1fr);grid-template-areas:"kriz" "obsah";
  max-width:560px;margin-inline:auto;container-type:inline-size;
}
.pole{grid-area:kriz;aspect-ratio:1;background:var(--g-tma)}

.vysek{
  grid-area:kriz;position:relative;margin:0;padding:0;border:0;border-radius:0;
  background:var(--g-tma);color:inherit;font:inherit;cursor:pointer;
  -webkit-tap-highlight-color:transparent;outline:none;
  transition:background-color .45s ease;
  animation:cesty-plocha .7s ease-out both;
}
.pos-nahore{clip-path:polygon(50% 50%, calc(50% - var(--L-x)) calc(50% - var(--L-y)), calc(50% + var(--L-x)) calc(50% - var(--L-y)))}
.pos-vpravo{clip-path:polygon(50% 50%, calc(50% + var(--L-x)) calc(50% - var(--L-y)), calc(50% + var(--L-x)) calc(50% + var(--L-y)))}
.pos-dole  {clip-path:polygon(50% 50%, calc(50% + var(--L-x)) calc(50% + var(--L-y)), calc(50% - var(--L-x)) calc(50% + var(--L-y)))}
.pos-vlevo {clip-path:polygon(50% 50%, calc(50% - var(--L-x)) calc(50% + var(--L-y)), calc(50% - var(--L-x)) calc(50% - var(--L-y)))}

/* fotka budovy jen jako tichá textura; otevřený výsek je čistá světlejší zelená */
.foto{
  position:absolute;inset:0;
  background:var(--g-tma) url("../img/budova.jpg") 42% 38% / cover no-repeat;
  opacity:.09;filter:grayscale(1);
  transition:opacity .5s ease;
}
.foto::after{content:"";position:absolute;inset:0;background:var(--g-tma);mix-blend-mode:multiply}
.pos-nahore .foto{background-position:45% 20%}
.pos-dole   .foto{background-position:45% 75%}
.pos-vlevo  .foto{background-position:30% 45%}
.pos-vpravo .foto{background-position:70% 45%}
.vysek.je-aktivni{background:var(--g)}
.vysek.je-aktivni .foto{opacity:0}
@media (hover:hover){.vysek:not(.je-aktivni):hover .foto{opacity:.2}}

/* štítek výseku: ikona dvojice v kříži + název (+ podtitul na desktopu) */
.znak{
  position:absolute;display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;
  font-weight:900;font-size:clamp(13px, 4cqw, 19px);letter-spacing:-.02em;line-height:1;
  transform:translate(-50%, -50%);opacity:.72;transition:opacity .35s ease, scale .35s ease;
}
.znak svg{width:clamp(28px, 10cqw, 50px);height:clamp(28px, 10cqw, 50px);--knock:var(--g-tma)}
.znak-t{white-space:nowrap}
.znak-p{display:none}
.vysek.je-aktivni .znak{opacity:1}
.vysek.je-aktivni .znak svg{--knock:var(--g)}
@media (hover:hover){.vysek:hover .znak{opacity:1}}
.vysek:focus-visible .znak-t{outline:2px solid #fff;outline-offset:5px;border-radius:2px}
.pos-nahore .znak{left:50%;top:15.5%}
.pos-dole   .znak{left:50%;top:84.5%}
.pos-vlevo  .znak{left:17%;top:50%}
.pos-vpravo .znak{left:83%;top:50%}
.pos-vlevo .znak-t,.pos-vpravo .znak-t{white-space:normal;width:4.8em}

/* ramena kříže: čtyři půlramena ze středu, při startu „dojedou“ z dálky do středu */
.ramena{grid-area:kriz;position:relative;overflow:hidden;pointer-events:none;z-index:2}
.rameno{
  --sirka:clamp(6px, 1.3cqw, 12px);
  position:absolute;left:50%;top:50%;
  width:var(--sirka);margin-left:calc(var(--sirka) / -2);height:100cqw;
  background:var(--papir);border-radius:var(--sirka);
  transform-origin:50% 0;transform:rotate(var(--r));
  animation:dojezd .95s cubic-bezier(.17,.84,.25,1) var(--zpozdeni,0s) both;
}
.r-sv{--r:220deg;--zpozdeni:0s}    /* nahoru doprava */
.r-jz{--r:40deg;--zpozdeni:.06s}   /* dolů doleva */
.r-sz{--r:140deg;--zpozdeni:.12s}  /* nahoru doleva */
.r-jv{--r:-40deg;--zpozdeni:.18s}  /* dolů doprava */
@keyframes dojezd{from{transform:rotate(var(--r)) translateY(100%)}to{transform:rotate(var(--r)) translateY(0)}}
@keyframes cesty-plocha{from{opacity:0}to{opacity:1}}

/* střed: kruh s příborem a claimem */
.stred{
  --d:clamp(84px, 24cqw, 150px);
  grid-area:kriz;place-self:center;z-index:3;position:relative;
  width:var(--d);height:var(--d);
  border-radius:50%;background:var(--papir);color:var(--ink);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--d) * .035);
  text-align:center;pointer-events:none;
  box-shadow:0 0 0 calc(var(--d) * .035) rgba(22,22,22,.18);
  animation:stred-objev .5s cubic-bezier(.3,1.4,.5,1) .62s both;
}
.stred-logo{width:calc(var(--d) * .36);height:calc(var(--d) * .36);color:var(--g);animation:pribor .55s cubic-bezier(.3,1.3,.5,1) .78s both}
.stred-claim{font-weight:900;letter-spacing:-.03em;line-height:.98;font-size:calc(var(--d) * .125);animation:claim .45s ease-out 1.02s both}
@keyframes stred-objev{from{opacity:0;scale:.35}to{opacity:1;scale:1}}
@keyframes pribor{from{opacity:0;rotate:-75deg;scale:.4}to{opacity:1;rotate:0deg;scale:1}}
@keyframes claim{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}

/* ---------- obsah výseku (žádná karta: text přímo na zelené) ---------- */
.obsah{
  grid-area:obsah;z-index:4;min-width:0;
  padding:22px var(--gutter) 6px;
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
}
.js .obsah{display:none}
.js .obsah.je-otevreny{display:flex;animation:obsah-objev .4s ease-out both}
@keyframes obsah-objev{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}

.o-stitek{font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--g-svetla)}
.o-nadpis{font-weight:900;letter-spacing:-.03em;line-height:1;font-size:clamp(28px, 7cqw, 38px)}
.o-text{max-width:44ch;line-height:1.45}
.o-pozn{font-size:14px;color:var(--g-svetla)}
.obsah a:not(.btn){color:#fff;font-weight:800;text-decoration-thickness:1.5px;text-underline-offset:3px}
.o-odkazy{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:15px}
.o-menu{width:100%;display:flex;flex-direction:column;gap:8px}

/* menu dne: P / 1…n / lísteček, název, cena */
.o-polozky{list-style:none;margin:0;padding:0;width:100%;font-size:15px;line-height:1.25}
.o-polozky li{display:grid;grid-template-columns:22px minmax(0, 1fr) auto;gap:10px;align-items:baseline;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.o-polozky li.predel{border-top:1.5px solid rgba(255,255,255,.55)}
.o-polozky .n{font-weight:900;color:var(--g-svetla);text-align:center;font-variant-numeric:tabular-nums}
.o-polozky .n svg{width:15px;height:15px;color:var(--g-svetla);--knock:var(--g);vertical-align:-2px}
.o-polozky .d b{font-weight:700}
.o-polozky .p{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}

/* výběr ze stálého lístku */
.o-vyber{list-style:none;margin:0;padding:0;width:100%;display:grid;gap:0}
.o-vyber li{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.o-vyber b{font-weight:700}
.o-vyber span{font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.o-vyber[hidden]{display:none}

/* kudy k nám */
.o-mapa{margin:0;width:100%}
.o-mapa svg{display:block;width:100%;height:auto;border-radius:6px}
.o-adresa{line-height:1.5}
.o-akce{margin-top:2px}
.cesty .btn{background:var(--papir);border-color:var(--papir);color:var(--g-tma);padding:12px 20px;font-size:15px}
.cesty .btn:hover{background:#fff;border-color:#fff}

.cesty-napoveda{text-align:center;font-size:14px;color:var(--g-svetla);padding:16px var(--gutter) 0}
.js .cesty.ma-otevreno .cesty-napoveda,html:not(.js) .cesty-napoveda{display:none}

/* bez JS: všechny čtyři obsahy pod křížem */
html:not(.js) .obsah{padding-top:28px}
html:not(.js) .obsah + .obsah{border-top:1px solid rgba(255,255,255,.2)}
html:not(.js) .vysek{cursor:default}

/* ---------- desktop: obsah přímo ve výseku ---------- */
@media (min-width:1100px) and (min-height:600px){
  .cesty{padding:0}
  .krizovatka{
    --okraj:max(var(--gutter), 4cqw);
    --bok:min(460px, calc(50cqw - 30cqh - var(--okraj)));
    max-width:none;height:clamp(600px, calc(100svh - 68px), 920px);
    grid-template-areas:"kriz";grid-template-rows:100%;container-type:size;
  }
  .pole{aspect-ratio:auto}
  .rameno{--sirka:clamp(8px, 1.2cqmin, 13px);height:calc(80cqw + 70cqh)}
  .stred{--d:clamp(124px, 21cqh, 196px)}
  .znak{gap:8px;font-size:clamp(20px, 3.4cqh, 34px)}
  .znak svg{width:clamp(40px, 8cqh, 72px);height:clamp(40px, 8cqh, 72px)}
  .znak-p{display:block;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--g-svetla);margin-top:2px}
  .pos-nahore .znak{top:17%}
  .pos-dole   .znak{top:83%}
  .pos-vlevo  .znak{left:max(15%, 120px)}
  .pos-vpravo .znak{left:min(85%, calc(100% - 120px))}
  .pos-vlevo .znak-t,.pos-vpravo .znak-t{width:auto;white-space:nowrap}
  /* otevřený výsek: štítek ustoupí obsahu */
  .vysek.je-aktivni .znak{opacity:0;scale:.92}

  .obsah{grid-area:kriz;padding:0;max-height:84cqh;overflow:auto;scrollbar-width:thin}
  .js .obsah{display:flex;visibility:hidden;opacity:0;translate:var(--odkud);transition:opacity .3s ease, translate .45s cubic-bezier(.2,.7,.2,1), visibility 0s linear .45s}
  .js .obsah.je-otevreny{visibility:visible;opacity:1;translate:0 0;animation:none;transition:opacity .45s ease .05s, translate .55s cubic-bezier(.2,.7,.2,1) .05s, visibility 0s}
  /* jemná vlna: řádky obsahu naskočí krátce po sobě */
  .js .obsah.je-otevreny > *{animation:vlna .5s cubic-bezier(.2,.7,.2,1) both}
  .js .obsah.je-otevreny > :nth-child(2){animation-delay:.04s}
  .js .obsah.je-otevreny > :nth-child(3){animation-delay:.08s}
  .js .obsah.je-otevreny > :nth-child(4){animation-delay:.12s}
  .js .obsah.je-otevreny > :nth-child(n+5){animation-delay:.16s}
  .vysek:focus-visible + .obsah{outline:2px dashed rgba(255,255,255,.55);outline-offset:12px}

  .o-vlevo{--odkud:22px 0;justify-self:start;align-self:center;margin-left:var(--okraj);width:var(--bok);max-height:72cqh}
  .o-vpravo{--odkud:-22px 0;justify-self:end;align-self:center;margin-right:var(--okraj);width:var(--bok);max-height:72cqh}
  .o-nahore{--odkud:0 16px;justify-self:center;align-self:start;margin-top:9cqh;align-items:center;text-align:center;overflow:visible}
  .o-dole{--odkud:0 -16px;justify-self:center;align-self:end;margin-bottom:3.6cqh;align-items:center;text-align:center;gap:1.1cqh;overflow:visible}
  .o-nadpis{font-size:clamp(28px, 4.4cqh, 44px)}
  .o-vlevo .o-polozky{font-size:clamp(14px, 1.9cqh, 16px)}
  .o-vlevo .o-polozky li{padding:clamp(3px, .7cqh, 7px) 0}

  /* dolní výsek: obsah se rozšiřuje směrem dolů, jako trojúhelník */
  .o-dole .o-nadpis{font-size:clamp(26px, 3.6cqh, 36px)}
  .o-dole .o-text{max-width:min(37cqh, 40ch);font-size:clamp(14px, 1.8cqh, 16px);line-height:1.4}
  .o-dole .o-vyber{width:auto;justify-items:center;margin-top:.4cqh}
  .o-dole .o-vyber li{justify-content:center;gap:12px;border-bottom:0;padding:clamp(2px, .45cqh, 5px) 0;font-size:clamp(15px, 1.9cqh, 17px)}
  .o-dole .o-vyber span{color:var(--g-svetla);font-weight:700}
  .o-dole .o-odkazy{justify-content:center}
  .o-nahore .o-text{font-size:clamp(17px, 2.2cqh, 20px)}

  .cesty-napoveda{display:none}
  html:not(.js) .vysek .znak{display:none}
  html:not(.js) .obsah + .obsah{border-top:0}
  html:not(.js) .obsah{padding-top:0}
}
/* nižší okno: lístek dne zhustit */
@media (min-width:1100px) and (min-height:600px) and (max-height:820px){
  .o-vlevo{gap:8px}
  .o-vlevo .o-nadpis{font-size:30px}
  .o-vlevo .o-polozky li{padding:3px 0}
}
@keyframes vlna{from{opacity:0;translate:var(--odkud)}to{opacity:1;translate:0 0}}

@media (prefers-reduced-motion:reduce){
  .cesty *, .cesty{animation:none!important}
  .js .obsah{translate:none!important}
}

/* mapa Velkého Dřevíče (OSM) – barvy jen z tokenů; stejná kresba v „Kudy k nám“ i v „Kde a kdy“ */
.mapa-drevic .m-pozadi{fill:var(--g)}
.mapa-drevic .m-les{fill:var(--g-tma);opacity:.55}
.mapa-drevic .m-voda{fill:none;stroke:var(--g-svetla);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.mapa-drevic .m-potok{fill:none;stroke:var(--g-svetla);stroke-width:1.4;stroke-linecap:round;opacity:.7}
.mapa-drevic .m-budovy{fill:var(--bila);opacity:.2}
.mapa-drevic .m-cesty{fill:none;stroke:var(--bila);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.5}
.mapa-drevic .m-silnice{fill:none;stroke:var(--bila);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.mapa-drevic .m-hospoda{fill:var(--papir);stroke:var(--bila);stroke-width:2}
.mapa-drevic .m-znak{color:var(--g-tma)}
.mapa-drevic .m-znak circle{fill:var(--papir)}
.mapa-drevic .m-nazev{font:900 15px var(--font);fill:var(--bila);letter-spacing:-.02em}
.mapa-drevic .m-reka{font:700 10px var(--font);fill:var(--g-svetla);letter-spacing:.18em}
.mapa-drevic .m-smer rect{fill:var(--papir)}
.mapa-drevic .m-sipka{fill:none;stroke:var(--g-tma);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.mapa-drevic .m-smer text{font:800 13px var(--font);fill:var(--ink)}
.mapa-drevic .m-ref{font-weight:600;fill:var(--g);font-size:11px}
.mapa-drevic .m-osm{font:500 9px var(--font);fill:var(--bila);opacity:.75}

/* =====================================================================
   PŘÍBĚH
   ===================================================================== */
.pribeh{padding-block:clamp(72px, 10vw, 128px) 0}
.pribeh-mrizka{display:grid;grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr);gap:clamp(32px, 6vw, 88px);align-items:center}
.pribeh h2{font-size:var(--t-h2);margin:12px 0 26px;max-width:12ch}
.pribeh-text p:not(.stitek){max-width:58ch;color:#2b2926}
.pribeh-text p + p{margin-top:16px}
.pribeh-uvod{font-size:clamp(19px, 1.7vw, 22px);font-weight:600;line-height:1.45;color:var(--ink)!important}
.pribeh-dovetek{font-size:15px;color:var(--sede)!important;border-top:1px solid var(--linka);padding-top:16px;margin-top:24px!important}
.sc-inline{height:.72em;width:auto;vertical-align:-.04em;color:var(--sepie)}
.pribeh-foto{margin:0}
.pribeh-foto svg{display:block;width:100%;height:auto}
.foto-stin{fill:var(--g-svetla)}
.pribeh-foto figcaption{margin-top:8px;text-align:center;font-size:var(--t-male);color:var(--sede)}

.fakta{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));margin:clamp(48px, 7vw, 88px) 0 0;border-top:2px solid var(--ink)}
.fakta > div{padding:20px 20px 4px 0}
.fakta > div + div{padding-left:20px;border-left:1px solid var(--linka)}
.fakta dt{font-weight:900;font-size:clamp(22px, 2.4vw, 32px);letter-spacing:-.03em;line-height:1.05;color:var(--g);font-variant-numeric:tabular-nums}
.fakta dd{margin:8px 0 0;font-size:15px;color:var(--sede);line-height:1.4}
.fakta{grid-template-columns:repeat(2, minmax(0, 1fr))}
.fakta p{margin:0}
.fakt-velky{font-weight:900;font-size:clamp(34px, 4.4vw, 56px);letter-spacing:-.03em;line-height:1;color:var(--g);font-variant-numeric:tabular-nums}
.fakt-pod{margin-top:8px!important;font-size:16px;color:var(--sede);line-height:1.4}
.hvezdy{display:flex;gap:4px;color:var(--g);margin-bottom:10px!important}
.hvezdy svg{width:clamp(26px, 2.6vw, 34px);height:clamp(26px, 2.6vw, 34px)}
.coakdy-text{font-size:clamp(18px, 1.6vw, 22px);font-weight:600;max-width:40ch}

/* =====================================================================
   CO A KDY
   ===================================================================== */
.coakdy{padding-block:clamp(80px, 10vw, 128px) 0}
.sekce-hlava{max-width:640px;margin-bottom:clamp(32px, 4vw, 48px)}
.sekce-hlava h2{font-size:var(--t-h2);margin:12px 0 16px}
.sekce-hlava p:not(.stitek){color:var(--sede)}
.karty{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:clamp(16px, 2vw, 28px)}
.karta{position:relative;background:var(--bila);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 1px 0 var(--linka);transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s}
.karta:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(22,22,22,.35)}
.karta-dlazdice{position:relative;aspect-ratio:16/10;background:var(--g);display:grid;place-items:center;overflow:hidden}
.karta-dlazdice::before,.karta-dlazdice::after{content:"";position:absolute;left:41%;width:18%;top:-80%;bottom:-80%;background:var(--g-tma);border-radius:999px;transform:rotate(40deg)}
.karta-dlazdice::after{transform:rotate(-40deg)}
.karta-dlazdice svg{position:relative;z-index:1;width:42%;height:auto;aspect-ratio:1;color:#fff;--knock:var(--g);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.karta:hover .karta-dlazdice svg{transform:scale(1.07) rotate(-3deg)}
.karta-telo{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.karta-kdy{font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--g)}
.karta h3{font-size:var(--t-h3);font-weight:900;letter-spacing:-.02em;margin:10px 0 10px;line-height:1.1}
.karta h3 a{text-decoration:none}
.karta h3 a::after{content:"";position:absolute;inset:0;z-index:2}
.karta h3 a:focus-visible{outline:none}
.karta:has(a:focus-visible){outline:3px solid var(--g);outline-offset:3px}
.karta-telo > p:not(.karta-kdy){color:var(--sede);font-size:16px}
.karta-odkaz{margin-top:auto;padding-top:18px;font-weight:800;font-size:15px;color:var(--g)}

/* =====================================================================
   KDE A KDY
   ===================================================================== */
.kde{padding-block:clamp(80px, 10vw, 128px) 0}
.kde-mrizka{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.05fr);gap:clamp(32px, 6vw, 80px);align-items:start}
.kde h2{font-size:var(--t-h2);margin:12px 0 10px}
.kde-adresa{font-size:18px;font-weight:600}
.kde-h3{font-size:15px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin:32px 0 12px;padding-top:20px;border-top:1px solid var(--linka)}
.kde-stav{font-weight:700;color:var(--g);margin:-4px 0 12px}
.kde-stav:empty{display:none}
.kde-stav::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:currentColor;margin-right:8px;vertical-align:1px}
.kde-stav.zavreno{color:var(--sede)}
.dny{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));gap:6px}
.dny li{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 2px;border-radius:4px;background:var(--bila);font-size:13px;color:var(--sede);font-variant-numeric:tabular-nums;border:1px solid var(--linka)}
.dny b{font-size:15px;color:var(--ink)}
.dny li.dnes{background:var(--g);border-color:var(--g);color:#fff}
.dny li.dnes b{color:#fff}
.kde-pozn{margin-top:10px;font-size:14px;color:var(--sede)}
.doprava{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.doprava li{display:grid;grid-template-columns:110px 1fr;gap:12px;font-size:16px}
.doprava b{font-weight:800}
.doprava small{color:var(--sede);font-size:14px}
.kontakt{font-size:18px;font-weight:700;line-height:1.7}
.kontakt a{text-decoration-color:var(--g);text-underline-offset:3px;overflow-wrap:anywhere}
.kde-akce{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px!important}
.mapa{margin:0;position:sticky;top:96px}
.mapa svg{display:block;width:100%;height:auto;border-radius:8px;background:var(--g)}
.mapa figcaption{margin-top:8px;font-size:var(--t-male);color:var(--sede)}

/* =====================================================================
   odhalování při scrollu (jen s JS; bez JS je vše vidět)
   ===================================================================== */
.js .odhal{opacity:0;translate:0 22px;transition:opacity .7s ease, translate .7s cubic-bezier(.2,.7,.2,1)}
.js .odhal.videt{opacity:1;translate:0 0}
@media (prefers-reduced-motion:reduce){.js .odhal{opacity:1;translate:none}}

/* =====================================================================
   responzivita obsahu pod openerem
   ===================================================================== */
@media (max-width:900px){
  .pribeh-mrizka,.kde-mrizka{grid-template-columns:1fr}
  .pribeh-foto{max-width:520px;margin-inline:auto;width:100%}
  .mapa{position:static;max-width:560px}
  .karty{grid-template-columns:1fr;max-width:560px}
  .karta{flex-direction:row}
  .karta-dlazdice{aspect-ratio:auto;width:34%;flex:none}
  .fakta{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .fakta > div:nth-child(3){padding-left:0;border-left:0}
  .fakta > div:nth-child(n+3){border-top:1px solid var(--linka)}
}
@media (max-width:520px){
  .karta{flex-direction:column}
  .karta-dlazdice{width:auto;aspect-ratio:16/8}
  .karta-dlazdice svg{width:30%}
  .doprava li{grid-template-columns:1fr;gap:0}
  .dny{gap:4px}
  .dny li{padding:8px 0;font-size:11px}
  .dny b{font-size:14px}
  .fakta > div{padding-right:12px}
  .fakta > div + div{padding-left:12px}
  .fakta > div:nth-child(3){padding-left:0}
}