:root{
  --ice:#f6fbfb;
  --snow:#ffffff;
  --mist:#e7f1f1;
  --line:#c9dddd;
  --turq:#5bbfc2;
  --turq-dark:#3b9fa3;
  --ink:#24383b;
  --muted:#6a7f82;
  --warm:#f3e7c2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--ink);
  background:var(--ice);
}
a{color:inherit;text-decoration:none}
button,a.button{
  font:inherit;
}
.page{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
.screen{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:32px 20px;
  position:relative;
  overflow:hidden;
}
.screen::before,
.screen::after{
  content:"";
  position:absolute;
  width:10px;
  height:75%;
  background:rgba(255,255,255,.88);
  border-radius:60%;
  transform:rotate(4deg);
  top:-5%;
  right:14%;
  box-shadow:44px 38px 0 -2px rgba(255,255,255,.68);
  pointer-events:none;
}
.screen::after{
  width:220px;
  height:220px;
  border-radius:50%;
  background:rgba(91,191,194,.09);
  box-shadow:none;
  top:auto;
  right:-80px;
  bottom:-70px;
}
.enter-wrap{
  position:relative;
  z-index:2;
  display:grid;
  justify-items:center;
  gap:26px;
  text-align:center;
}
.book-cover{
  width:min(54vw,320px);
  aspect-ratio:2/3;
  border:1px solid var(--line);
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(224,239,239,.95)),
    linear-gradient(145deg,var(--snow),var(--mist));
  border-radius:8px;
  box-shadow:0 20px 50px rgba(36,56,59,.10);
  display:grid;
  place-items:center;
  padding:24px;
  position:relative;
  overflow:hidden;
}
.book-cover .uki{
  font-family:Georgia, serif;
  font-size:clamp(3.5rem,12vw,6.4rem);
  line-height:.8;
  color:var(--turq);
  letter-spacing:-.06em;
}
.book-cover small{
  position:absolute;
  bottom:22px;
  color:var(--muted);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  border:1px solid var(--turq-dark);
  background:var(--turq);
  color:#163438;
  font-weight:750;
  cursor:pointer;
  transition:transform .18s ease, background .18s ease;
}
.button.secondary{
  background:var(--snow);
  border-color:var(--line);
}
.button:hover{transform:translateY(-1px)}
.motto{
  max-width:780px;
  text-align:center;
  z-index:2;
}
.motto h1{
  font-family:Georgia, serif;
  font-weight:400;
  font-size:clamp(2.1rem,7vw,4.8rem);
  margin:0 0 42px;
}
.motto .next{
  opacity:.92;
}
.topbar{
  width:min(1120px,calc(100% - 32px));
  margin:20px auto 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
}
.brand{
  font-family:Georgia,serif;
  font-size:1.4rem;
  color:var(--turq-dark);
  font-weight:700;
}
.back{
  color:var(--muted);
  font-size:.95rem;
}
.content{
  width:min(1040px,calc(100% - 36px));
  margin:0 auto;
  padding:64px 0 80px;
}
.kicker{
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--muted);
  font-weight:800;
  font-size:.74rem;
}
h1,h2{
  font-family:Georgia,serif;
  font-weight:500;
}
.content h1{
  font-size:clamp(2.1rem,6vw,4rem);
  margin:.3rem 0 1rem;
}
.lead{
  max-width:720px;
  font-size:1.13rem;
  line-height:1.75;
  color:#42595c;
}
.crossroads{
  width:min(1000px,calc(100% - 36px));
  margin:0 auto;
  padding:50px 0 80px;
}
.crossroads-head{
  text-align:center;
  margin-bottom:42px;
}
.crossroads-head h1{
  font-size:clamp(2.2rem,6vw,4.2rem);
  margin:.25rem 0 .65rem;
}
.crossroads-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.cross-card{
  min-height:190px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.72);
  border-radius:20px;
  padding:24px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
  position:relative;
  overflow:hidden;
}
.cross-card::before{
  content:"";
  position:absolute;
  top:18px;
  right:20px;
  width:32px;
  height:32px;
  border-top:1px solid var(--turq);
  border-right:1px solid var(--turq);
  opacity:.7;
}
.cross-card:hover{
  transform:translateY(-3px);
  border-color:#8fc8ca;
  background:#fff;
}
.cross-card h2{
  margin:0 0 7px;
  font-size:1.55rem;
}
.cross-card p{
  margin:0;
  color:var(--muted);
  line-height:1.5;
}
.cards{
  margin-top:34px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.card{
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.76);
  padding:22px;
}
.card h2{margin:.1rem 0 .6rem}
.placeholder{
  border:1px dashed #a8c9ca;
  background:linear-gradient(145deg,#fafdfe,#e4f0ef);
  border-radius:18px;
  min-height:210px;
  display:grid;
  place-items:center;
  color:var(--muted);
  text-align:center;
  padding:24px;
}
.gallery{
  margin-top:34px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.gallery .placeholder{aspect-ratio:4/3;min-height:0}
.audio-box{
  margin-top:36px;
  max-width:680px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:20px;
  padding:24px;
}
.audio-row{
  display:flex;
  gap:16px;
  align-items:center;
}
.play{
  width:48px;height:48px;border-radius:50%;border:1px solid var(--turq-dark);
  background:var(--turq);cursor:pointer;font-size:1rem;
}
.progress{
  height:4px;background:var(--mist);border-radius:999px;margin-top:18px;overflow:hidden
}
.progress span{
  display:block;height:100%;width:0;background:var(--turq);transition:width .35s ease
}
.timeline{
  margin-top:36px;
  display:grid;
  gap:16px;
}
.timeline .card{display:grid;grid-template-columns:64px 1fr;gap:18px}
.num{
  font-family:Georgia,serif;
  font-size:2rem;
  color:var(--turq-dark);
}
.events{
  margin-top:34px;
  border-top:1px solid var(--line);
}
.event{
  display:grid;
  grid-template-columns:90px 1fr;
  gap:18px;
  padding:22px 0;
  border-bottom:1px solid var(--line);
}
.event-date{
  font-weight:800;
  color:var(--turq-dark);
}
.quote{
  margin-top:32px;
  max-width:720px;
  border-left:3px solid var(--turq);
  padding-left:20px;
  font-family:Georgia,serif;
  font-size:1.35rem;
  line-height:1.55;
}
.footer{
  margin-top:auto;
  padding:28px 18px 38px;
  text-align:center;
  color:var(--muted);
  font-size:.9rem;
}
.fade-in{animation:fade .7s ease both}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:760px){
  .crossroads-grid,.cards,.gallery{grid-template-columns:1fr}
  .topbar{margin-top:14px}
  .content{padding-top:46px}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}


/* --- Vstupní stránka podle skutečné obálky Uki --- */
.cover-screen{
  background:
    radial-gradient(circle at 28% 20%, rgba(45,180,181,.18), transparent 28%),
    radial-gradient(circle at 72% 18%, rgba(24,88,105,.12), transparent 34%),
    linear-gradient(180deg,#edf6f5 0%,#f7fbfb 66%,#eef5f4 100%);
}
.cover-screen::before{
  opacity:.45;
}
.real-cover-wrap{
  width:min(58vw,340px);
  border-radius:7px;
  overflow:hidden;
  box-shadow:0 22px 55px rgba(21,55,63,.18);
  border:1px solid rgba(80,133,140,.20);
  background:#fff;
}
.real-cover{
  display:block;
  width:100%;
  height:auto;
}
.enter-sillanmaa{
  background:#6cced0;
  color:#173b40;
  border-color:#449ea3;
  box-shadow:0 7px 22px rgba(45,134,140,.12);
}
.enter-sillanmaa:hover{
  background:#79d5d6;
}
@media (max-width:560px){
  .real-cover-wrap{width:min(76vw,320px)}
}


/* --- Jak vznikla Uki --- */
.story-block{
  max-width:780px;
  margin-top:34px;
  font-family:Georgia,serif;
  font-size:1.14rem;
  line-height:1.9;
  color:#354b4e;
}
.story-block p{margin:0 0 1.35rem}
.story-block blockquote{
  margin:28px 0;
  padding:18px 22px;
  border-left:3px solid var(--turq);
  background:rgba(255,255,255,.62);
  font-size:1.35rem;
  font-style:italic;
}
.story-emphasis{
  font-size:1.35rem;
  color:var(--turq-dark);
}
.story-ending{
  font-size:1.28rem;
}
.origin-gallery,
.timeline-section{
  margin-top:64px;
}
.origin-gallery h2{
  font-size:clamp(1.8rem,4vw,2.6rem);
  margin:.3rem 0 .8rem;
}


/* --- Původní ilustrace Uki --- */
.origin-images{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:28px;align-items:start}
.origin-images figure{margin:0;background:rgba(255,255,255,.68);padding:12px;border:1px solid rgba(80,133,140,.18);border-radius:12px}
.origin-images img{display:block;width:100%;height:auto;border-radius:7px}
.origin-images figcaption{text-align:center;color:var(--muted);font-size:.88rem;padding:10px 4px 2px}

/* --- Pointa / kampaň --- */
.campaign-actions{margin:58px auto 0;max-width:780px;display:flex;flex-wrap:wrap;justify-content:center;gap:14px;text-align:center}
.campaign-button{min-width:250px;background:#6cced0;color:#173b40;border-color:#449ea3}
.campaign-button-alt{background:transparent;color:var(--turq-dark);border:1px solid var(--turq)}
.campaign-note{flex-basis:100%;margin:8px auto 0;color:var(--muted);font-size:.92rem;line-height:1.55}
@media (max-width:760px){.origin-images{grid-template-columns:1fr}.campaign-actions{margin-top:42px}.campaign-button{width:100%}}

/* --- doplnění: kniha, PDF ukázka a cesta na sever --- */
.book-section,
.sample-box,
.travel-teaser {
  margin-top: 2.6rem;
}
.cms-prose p {
  margin: 0 0 1em;
}
.sample-box {
  padding: 2rem;
  border: 1px solid rgba(30, 48, 55, .14);
  border-radius: 24px;
  background: rgba(255,255,255,.55);
}
.sample-box .button { margin-top: .8rem; }
.muted { opacity: .62; font-size: .95rem; }
.travel-teaser {
  max-width: 760px;
  margin-inline: auto;
  text-align: center;
  padding: 2.4rem 2rem;
  border-top: 1px solid rgba(30,48,55,.14);
}
.travel-teaser p { max-width: 580px; margin: .8rem auto 1.5rem; }
.travel-page .quote { margin: 2rem 0; }
@media (max-width: 640px) {
  .sample-box, .travel-teaser { padding: 1.4rem 1rem; }
}


/* CMS galerie a poslech */
.cms-gallery{align-items:start}
.gallery-item{margin:0;background:rgba(255,255,255,.72);border:1px solid rgba(28,60,67,.12);border-radius:16px;overflow:hidden;box-shadow:0 12px 34px rgba(20,48,54,.08)}
.gallery-item img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:#f3f6f5}
.gallery-item figcaption{padding:14px 16px 16px;display:grid;gap:5px;color:var(--muted);line-height:1.45}
.gallery-item figcaption strong{color:var(--ink);font-size:1rem}
.gallery-item figcaption span{font-size:.92rem}
.gallery-empty{text-align:center;margin:28px auto}
.listen-page{max-width:900px}
.listen-section{margin:34px 0 46px;padding:28px;border:1px solid rgba(28,60,67,.12);border-radius:20px;background:rgba(255,255,255,.58)}
.listen-section h2{margin:.3rem 0 .6rem}
.cms-audio audio{display:block;width:100%;margin-top:18px}
.youtube-wrap{position:relative;width:100%;aspect-ratio:16/9;margin-top:20px;border-radius:18px;overflow:hidden;background:#111;box-shadow:0 14px 35px rgba(18,42,48,.12)}
.youtube-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.text-link{display:inline-block;margin-top:8px;color:var(--turq-dark);font-weight:700;text-decoration:none}
.text-link:hover{text-decoration:underline}
@media (max-width:760px){.listen-section{padding:22px 18px}.gallery-item img{aspect-ratio:auto}}


/* --- definitivní oprava CMS galerie: celý obraz i na desktopu --- */
.cms-gallery > .gallery-item{
  display:flex;
  flex-direction:column;
  width:100%;
  max-width:320px;
  overflow:hidden;
}
.cms-gallery > .gallery-item > img{
  display:block !important;
  width:100% !important;
  height:330px !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:6px !important;
  box-sizing:border-box !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#fff !important;
}
.cms-gallery > .gallery-item > figcaption{
  margin-top:auto;
}
@media (max-width:620px){
  .cms-gallery > .gallery-item > img{
    height:250px !important;
    padding:5px !important;
  }
}