:root {
  --papir: #f4ede1;
  --papir-tmavsi: #ece2d1;
  --karta: #fbf7f0;
  --olivova: #3b3a24;
  --hneda: #5a2f1c;
  --terakota: #a85a33;
  --sage: #c9c9b2;
  --peach: #efcfb6;
  --text: #3a3226;
  --text-jemny: #6b6153;
  --linka: #d8cbb6;
  --chyba: #a33a22;
  --ok: #55613a;
  --serif-nadpis: "Cormorant Garamond", Georgia, serif;
  --serif: "Lora", Georgia, serif;
  --sans: "Jost", system-ui, sans-serif;
  --rukopis: "Caveat", cursive;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--papir);
  color: var(--text);
  font: 400 1.0625rem/1.65 var(--serif);
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--terakota); text-underline-offset: 3px; }
a:hover { color: var(--hneda); }
:focus-visible { outline: 2px solid var(--terakota); outline-offset: 3px; border-radius: 4px; }

.wrap { width: 100%; max-width: 1080px; margin: 0 auto; padding: 0 20px; }
.uzky { max-width: 640px; }
.na-stred { text-align: center; }

h1, h2, h3 { font-family: var(--serif-nadpis); color: var(--olivova); font-weight: 600; line-height: 1.15; margin: 0 0 .6em; }
h2 { font-size: clamp(2rem, 5vw, 2.75rem); }
h3 { font-size: 1.45rem; }
p { margin: 0 0 1em; }

.kicker {
  font: 500 .8rem/1.4 var(--sans);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--terakota);
  margin-bottom: .8em;
}

/* Hero */
.hero { position: relative; overflow: hidden; padding: 120px 0 72px; text-align: center; background: radial-gradient(120% 80% at 80% 0%, #f8e6cc 0%, var(--papir) 60%); }
.hero-listy { position: absolute; top: 0; left: 0; width: min(560px, 75vw); -webkit-mask-image: linear-gradient(to bottom right, #000 45%, transparent 85%); mask-image: linear-gradient(to bottom right, #000 45%, transparent 85%); pointer-events: none; }
.hero-motto { position: absolute; top: 28px; right: 28px; margin: 0; font: 500 1.6rem/1.15 var(--rukopis); color: var(--hneda); transform: rotate(-6deg); text-align: left; }
.hero-in { position: relative; }
.hero .kicker { color: var(--olivova); }
h1 {
  font-size: clamp(3.2rem, 13vw, 7.5rem);
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--hneda);
  margin: 0;
  line-height: 1;
}
.listek { width: 120px; color: var(--terakota); margin: 18px auto 10px; }
.podtitul { font: 400 clamp(.95rem, 2.6vw, 1.3rem)/1.4 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--olivova); }
.perex { max-width: 34em; margin: 0 auto 2em; font-size: 1.15rem; }

.fakta { list-style: none; padding: 0; margin: 0 auto 2.2em; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; max-width: 880px; }
.fakta li { display: flex; align-items: center; gap: 12px; text-align: left; background: rgba(251, 247, 240, .75); border: 1px solid var(--linka); border-radius: 14px; padding: 14px 16px; }
.fakta svg { flex: none; width: 30px; height: 30px; fill: none; stroke: var(--terakota); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fakta span { font-size: .95rem; line-height: 1.3; color: var(--text-jemny); }
.fakta strong { display: block; color: var(--olivova); font-family: var(--serif); font-weight: 500; font-size: 1.05rem; }

.tlacitko {
  display: inline-block;
  font: 500 .95rem/1 var(--sans);
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--karta);
  background: var(--hneda);
  border: 0;
  border-radius: 999px;
  padding: 18px 34px;
  cursor: pointer;
  transition: background .2s;
}
.tlacitko:hover { background: var(--terakota); color: var(--karta); }
.mista { margin: 14px 0 0; font: 500 1.4rem/1.2 var(--rukopis); color: var(--terakota); }

/* Sekce */
.sekce { padding: 88px 0; }
.sekce-svetla { background: var(--papir-tmavsi); }
.dvojice { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.dvojice-zarovnana { align-items: start; }
.foto { margin: 0; }
.foto img { width: 100%; border-radius: 6px; }
.foto-trhana img {
  border-radius: 22px 6px 22px 6px;
  box-shadow: 0 20px 50px -30px rgba(90, 47, 28, .55);
}
.odrazky { padding-left: 1.2em; margin: 0 0 1em; }
.odrazky li { margin-bottom: .35em; }
.odrazky li::marker { color: var(--terakota); }
.poznamka { color: var(--text-jemny); font-style: italic; font-size: .95rem; }

.aktivity { list-style: none; padding: 0; margin: 40px 0 28px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 28px; text-align: center; max-width: 860px; margin-left: auto; margin-right: auto; }
.aktivity h3 { font: 500 .85rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--olivova); margin: 16px 0 8px; }
.aktivity p { font-size: .97rem; color: var(--text-jemny); margin: 0; }
.ikona { display: grid; place-items: center; width: 104px; height: 104px; margin: 0 auto; border-radius: 52% 48% 55% 45% / 48% 55% 45% 52%; }
.ikona-sage { background: var(--sage); }
.ikona-peach { background: var(--peach); }
.ikona svg { width: 56px; height: 56px; fill: none; stroke: var(--olivova); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.lide { list-style: none; padding: 0; margin: 40px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.lide li { background: var(--karta); border-radius: 18px; padding: 28px 24px; text-align: center; }
.lide p { color: var(--text-jemny); margin: 0; font-size: .98rem; }
.avatar { display: grid; place-items: center; width: 88px; height: 88px; margin: 0 auto 16px; border-radius: 50%; background: var(--sage); font: 600 2.4rem/1 var(--serif-nadpis); color: var(--olivova); }
.avatar-peach { background: var(--peach); }
.lide h3 { margin-bottom: .3em; }

.karta { background: var(--karta); border-radius: 22px; padding: 32px; border: 1px solid var(--linka); }
.cena { font: 600 3rem/1 var(--serif-nadpis); color: var(--hneda); margin-bottom: .6em; }
.cena span { font: 400 1rem var(--serif); color: var(--text-jemny); }
.info { margin: 0; display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 14px 18px; }
.info dt { font: 500 .78rem/1.9 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--terakota); }
.info dd { margin: 0; }

/* Rezervace */
.sekce-rezervace { background: linear-gradient(180deg, var(--papir-tmavsi), var(--papir)); }
.sekce-rezervace h2 { margin-bottom: .3em; }
.mista-velke { margin: 0 0 24px; }
.formular { background: var(--karta); border-radius: 22px; padding: 28px; border: 1px solid var(--linka); margin-top: 20px; }
.pole { margin-bottom: 18px; }
.pole-radek { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; }
label { display: block; font: 500 .95rem/1.4 var(--sans); color: var(--olivova); margin-bottom: 6px; }
.povinne { color: var(--terakota); }
.nepovinne { font-weight: 400; color: var(--text-jemny); }
input[type=text], input[type=email], input[type=tel], select, textarea {
  width: 100%;
  font: 400 16px/1.4 var(--sans);
  color: var(--text);
  background: #fff;
  border: 1px solid var(--linka);
  border-radius: 12px;
  padding: 14px 14px;
  min-height: 52px;
  appearance: none;
}
select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235a2f1c' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 12px; padding-right: 36px; }
textarea { resize: vertical; min-height: 96px; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--terakota); box-shadow: 0 0 0 3px rgba(168, 90, 51, .18); }
[aria-invalid=true] { border-color: var(--chyba) !important; }
.napoveda { font: 400 .85rem/1.4 var(--sans); color: var(--text-jemny); margin: 6px 0 0; }
.pole-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.souhlas { display: flex; gap: 12px; align-items: flex-start; font-weight: 400; font-size: .92rem; color: var(--text); margin: 6px 0 18px; cursor: pointer; }
.souhlas input { flex: none; width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--hneda); }
.souhrn { font: 400 1rem var(--sans); color: var(--text-jemny); }
.souhrn strong { color: var(--hneda); font-size: 1.15rem; }
.chyba { background: #f7e1d8; color: var(--chyba); border-radius: 12px; padding: 12px 16px; font: 400 .95rem/1.5 var(--sans); }
.formular .tlacitko { width: 100%; padding: 20px; }
.tlacitko[disabled] { opacity: .6; cursor: progress; }

.potvrzeni, .obsazeno { background: var(--karta); border-radius: 22px; padding: 32px 28px; border: 1px solid var(--linka); text-align: center; margin-top: 20px; }
.potvrzeni:focus { outline: none; }
.fajfka { width: 64px; height: 64px; margin: 0 auto 12px; fill: none; stroke: var(--ok); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.platba { display: flex; gap: 24px; align-items: center; justify-content: center; flex-wrap: wrap; margin: 24px 0 8px; text-align: left; }
.platba img { width: 180px; height: 180px; background: #fff; padding: 8px; border-radius: 12px; border: 1px solid var(--linka); image-rendering: pixelated; }
.platba dl { margin: 0; }
.platba dt { font: 500 .75rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--terakota); }
.platba dd { margin: 0 0 10px; font: 500 1.15rem var(--sans); color: var(--olivova); }

.velky-odkaz { font-size: 1.25rem; }
.citat { font: 500 2rem/1.25 var(--rukopis); color: var(--hneda); margin: 40px auto 0; max-width: 16em; }

.paticka { background: var(--olivova); color: #e9e2d2; padding: 40px 0; font: 400 .9rem/1.6 var(--sans); }
.paticka p { margin: 0 0 .3em; }
.paticka details { margin-top: 14px; }
.paticka summary { cursor: pointer; color: #fff; }
.paticka details p { margin-top: 8px; max-width: 46em; opacity: .85; }

@media (max-width: 900px) {
  .fakta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aktivity { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .hero { padding: 150px 0 56px; }
  .hero-motto { font-size: 1.35rem; top: 18px; right: 16px; }
  .sekce { padding: 64px 0; }
  .dvojice { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .dvojice-obracena .foto { order: 2; }
  .aktivity { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
  .ikona { width: 84px; height: 84px; }
  .ikona svg { width: 46px; height: 46px; }
  .lide { grid-template-columns: minmax(0, 1fr); }
  .formular { padding: 22px 18px; }
  .pole-radek { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .info { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .info dd { margin-bottom: 12px; }
}
@media (max-width: 400px) {
  .fakta { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Odstranit před spuštěním naostro */
.test-pruh { position: sticky; top: 0; z-index: 10; background: #a33a22; color: #fff; text-align: center; font: 400 .9rem/1.4 var(--sans); padding: 10px 16px; }