/* =========================================================
   PAGE — vzhľad textových stránok (destinácia, hotel, miesto).
   Glóbus má vlastné css/stage.css. Farby a písma sú v tokens.css.
   ========================================================= */

body.doc{
  background:var(--c-ground);
  color:var(--c-ink);
  min-height:100dvh;
  display:flex;flex-direction:column;
}

/* ---------- hlavička ---------- */
.topbar{
  display:flex;align-items:baseline;gap:var(--sp-2);
  padding:var(--sp-3) var(--sp-4);
  border-bottom:1px solid var(--c-hair);
}
.topbar .brand{
  font-family:var(--f-display);font-weight:700;font-size:18px;
  color:var(--c-ink);text-decoration:none;
}
.topbar .brand:hover{text-decoration:underline;text-underline-offset:3px}
.brand-sub{color:var(--c-muted)}

/* ---------- omrvinky ---------- */
.crumbs-bar{
  display:flex;align-items:center;gap:var(--sp-1);flex-wrap:wrap;
  padding:var(--sp-2) var(--sp-4);
  color:var(--c-muted);
  border-bottom:1px solid var(--c-hair);
}
.crumbs-bar a{color:var(--c-muted);text-decoration:underline;text-underline-offset:3px}
.crumbs-bar a:hover{color:var(--c-ink)}
.crumbs-bar .sep{opacity:.5}
.crumbs-bar .now{color:var(--c-ink)}

/* ---------- telo ---------- */
.doc-main{
  flex:1;width:100%;max-width:760px;
  margin:0 auto;padding:var(--sp-5) var(--sp-4) var(--sp-6);
}
.kicker{color:var(--c-muted);margin:0 0 var(--sp-2)}
.doc-main h1{
  font-size:var(--fs-hero);line-height:1.05;
  margin:0 0 var(--sp-3);
}
.doc-main h2{
  font-size:var(--fs-h2);line-height:1.1;
  margin:0 0 var(--sp-2);
  display:flex;align-items:baseline;gap:var(--sp-2);
}
.count{color:var(--c-muted);font-family:var(--f-mono)}
.lede{font-size:17px;line-height:1.55;max-width:62ch;margin:0 0 var(--sp-4)}

.sec{margin-top:var(--sp-5);padding-top:var(--sp-3);border-top:1px solid var(--c-hair)}

/* ---------- údaje ---------- */
.facts{
  display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);
  margin:0 0 var(--sp-4);padding:var(--sp-3) 0;
  border-top:1px solid var(--c-hair);border-bottom:1px solid var(--c-hair);
}
.facts div{display:flex;flex-direction:column;gap:2px}
.facts dt{color:var(--c-muted)}
.facts dd{margin:0;font-family:var(--f-mono);font-size:14px}

/* ---------- fotky ---------- */
.shots{
  margin:0 0 var(--sp-4);
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
}
.shots img{
  width:100%;display:block;
  aspect-ratio:1/1;object-fit:cover;
  border-radius:var(--r-card);
  background:var(--c-surface-2);
}
.shots img:first-child{grid-column:1/-1;aspect-ratio:3/2}
@media (max-width:520px){
  .shots{grid-template-columns:repeat(2,1fr)}
}

/* ---------- odkaz na ponuku ---------- */
.offer-link{
  display:inline-block;
  padding:11px 18px;border-radius:var(--r-pill);
  background:var(--c-mark-dest);border:1px solid var(--c-mark-dest);
  font-family:var(--f-mono);font-size:var(--fs-label);
  letter-spacing:var(--ls-label);text-transform:uppercase;
  color:#1A1203;text-decoration:none;font-weight:500;
}
.offer-link:hover{filter:brightness(1.08)}

/* ---------- odkaz na glóbus ---------- */
.globe-link{
  display:inline-block;
  padding:9px 16px;border-radius:var(--r-pill);
  border:1px solid var(--c-hair);background:var(--c-surface);
  font-family:var(--f-mono);font-size:var(--fs-label);
  letter-spacing:var(--ls-label);text-transform:uppercase;
  color:var(--c-ink);text-decoration:none;
}
.globe-link:hover{background:var(--c-surface-2)}

/* ---------- zoznamy ---------- */
ul.cards{list-style:none;margin:var(--sp-2) 0 0;padding:0}
ul.cards li{border-bottom:1px solid var(--c-hair)}
ul.cards a{
  display:grid;grid-template-columns:1fr auto;gap:2px var(--sp-2);
  padding:var(--sp-3) 2px;text-decoration:none;color:var(--c-ink);
}
ul.cards a:hover{background:var(--c-surface-2)}
ul.cards .c-name{font-weight:600;font-size:16px}
ul.cards .c-right{font-family:var(--f-mono);font-size:12px;color:var(--c-muted);white-space:nowrap}
ul.cards .c-sub{grid-column:1/-1;font-size:var(--fs-small);color:var(--c-muted)}

ul.legs{list-style:none;margin:var(--sp-2) 0 0;padding:0}
ul.legs li{
  display:grid;grid-template-columns:auto 1fr;gap:var(--sp-2);
  align-items:baseline;padding:var(--sp-2) 0;
  border-bottom:1px solid var(--c-hair);font-size:var(--fs-small);
}
ul.legs .l-mode{color:var(--c-muted);min-width:74px}
.muted{color:var(--c-muted)}

ul.chips{
  list-style:none;display:flex;flex-wrap:wrap;gap:6px;
  margin:var(--sp-2) 0 0;padding:0;
}
ul.chips li{
  font-size:13px;line-height:1;padding:6px 10px;
  border:1px solid var(--c-hair);border-radius:var(--r-pill);
  background:var(--c-surface-2);
}

/* ---------- pätička ---------- */
.doc-foot{
  border-top:1px solid var(--c-hair);
  padding:var(--sp-4);
}
.doc-foot .fineprint{
  max-width:62ch;margin:0 auto var(--sp-2);
  font-size:var(--fs-small);color:var(--c-muted);
}
.doc-foot a{color:var(--c-muted)}

@media (max-width:760px){
  .topbar{padding:var(--sp-3)}
  .crumbs-bar{padding:var(--sp-2) var(--sp-3)}
  .doc-main{padding:var(--sp-4) var(--sp-3) var(--sp-6)}
  .doc-foot{padding:var(--sp-3)}
}
