/* ============================================================
   VÝLETY S DANIM — cinematic scroll journey
   Paleta: nočná bazaltová tma + slnečné zlato + plytká voda
   Stránka je zámerne jednofarebná (tmavá) — video je hlavný obraz.
   ============================================================ */
:root{
  --night:#080A0C;
  --basalt:#101418;
  --basalt-2:#171C21;
  --bone:#F3F0EA;
  --bone-soft:#A6ADB4;
  --sun:#E9B457;
  --sun-ink:#1A1204;
  --aqua:#63D6C6;
  --line:rgba(243,240,234,.14);
  --line-2:rgba(243,240,234,.28);
  --glass:rgba(10,14,18,.52);
  --r:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
/* iOS/tablet: plynulý scroll v CSS koliduje s programovým scrollovaním */
@media (pointer:coarse),(max-width:1199px){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--night);color:var(--bone);
  font-family:Manrope,"Segoe UI",system-ui,sans-serif;font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden
}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance;line-height:1.05;letter-spacing:-.015em}
h1,h2.display{font-family:"Bodoni Moda",Didot,Georgia,serif}
h1{font-size:clamp(2.6rem,7vw,5.4rem)}
h2.display{font-size:clamp(2.1rem,5vw,3.8rem)}
h2.plain,h3{font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.02em}
h2.plain{font-size:clamp(1.6rem,3.4vw,2.35rem)}
h3{font-size:1.1rem;line-height:1.25}
p{margin:0}
a{color:inherit}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2.5px solid var(--sun);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}

/* ---------- vrstvy ---------- */
#stage{position:fixed;inset:0;z-index:0;background:#000;overflow:hidden}
#stage video{width:100%;height:100%;object-fit:cover;display:block}
#vignette{
  position:fixed;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(8,10,12,.62) 0%,rgba(8,10,12,.10) 26%,rgba(8,10,12,.10) 62%,rgba(8,10,12,.72) 100%),
    radial-gradient(130% 90% at 50% 50%,transparent 38%,rgba(8,10,12,.55) 100%);
}
#solidbg{position:fixed;inset:0;z-index:2;background:var(--night);opacity:0;pointer-events:none;will-change:opacity}
main{position:relative;z-index:3}

.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.narrow{max-width:760px}

/* ---------- akty nad videom ---------- */
.act{min-height:150vh;min-height:150svh;position:relative;padding:0;display:block}
.act .wrap{width:100%;position:sticky;top:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:118px;padding-bottom:88px}
@media(max-width:779px){.act{min-height:128vh;min-height:128svh}.act .wrap{min-height:100vh;min-height:100svh;padding-top:94px;padding-bottom:80px}}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.3,1),transform .9s cubic-bezier(.2,.7,.3,1)}
.reveal.in{opacity:1;transform:none}
.eyebrow{
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--sun);
  margin-bottom:18px
}
.act p.lead{font-size:clamp(1.02rem,1.6vw,1.22rem);color:#DCE1E4;max-width:46ch;margin-top:22px;text-shadow:0 1px 24px rgba(0,0,0,.7)}
.act h1,.act h2.display{text-shadow:0 2px 40px rgba(0,0,0,.65)}


/* ---------- V5: scroll-in, real assets ---------- */
#heroCover{position:absolute;inset:0;z-index:2;background:
 linear-gradient(90deg,rgba(5,8,10,.67),rgba(5,8,10,.10) 58%,rgba(5,8,10,.28)),
 linear-gradient(180deg,rgba(5,8,10,.08),rgba(5,8,10,.36)),
 url("/assets/images/01-1200.webp") center/cover no-repeat;
 opacity:1;will-change:opacity;transition:opacity .08s linear}
#stage video{position:relative;z-index:1}
.hero-proof{display:flex;flex-wrap:wrap;gap:9px 18px;margin-top:24px;color:#E5E1D8;font-size:.82rem;font-weight:700;letter-spacing:.02em}
.hero-proof span{display:flex;align-items:center;gap:7px}.hero-proof span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--sun)}
.tcard{overflow:hidden;padding:0!important;gap:0!important}
.tcard .tripimg{width:100%;height:180px;object-fit:cover;display:block;filter:saturate(.96) contrast(1.02)}
.tcard .tcontent{padding:20px 22px 22px;display:flex;flex-direction:column;gap:11px;min-height:255px}
.portrait.real{background:none!important;padding:0!important;overflow:hidden;position:relative}
.portrait.real img{width:100%;height:100%;object-fit:cover;display:block}
.portrait.real::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(8,10,12,.78) 100%);pointer-events:none}
.portrait.real .photoTag{position:absolute;left:18px;bottom:16px;z-index:2;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:#fff}
.trustbar{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:0;background:rgba(10,14,18,.56);backdrop-filter:blur(12px)}
.trustbar>div{padding:18px 20px;border-right:1px solid var(--line)}.trustbar>div:last-child{border-right:0}
.trustbar b{display:block;font-family:"Bodoni Moda",serif;font-size:1.55rem;font-weight:400;color:var(--sun);line-height:1}.trustbar span{font-size:.76rem;color:var(--bone-soft)}
@media(max-width:620px){.trustbar{grid-template-columns:1fr}.trustbar>div{border-right:0;border-bottom:1px solid var(--line)}.trustbar>div:last-child{border-bottom:0}}
.reviewshots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.reviewshot{background:var(--basalt);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;position:relative}
.reviewshot img{width:100%;display:block;height:auto;background:#fff}
.reviewshot .cap{padding:13px 16px;color:var(--bone-soft);font-size:.8rem;border-top:1px solid var(--line)}
.reviewshot.featured{grid-row:span 2}
@media(max-width:760px){.reviewshots{grid-template-columns:1fr}.reviewshot.featured{grid-row:auto}}
.photo-ribbon{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;margin-top:28px;max-width:780px}
.photo-ribbon img{width:100%;height:180px;object-fit:cover;border-radius:13px;border:1px solid var(--line)}
@media(max-width:620px){.photo-ribbon{grid-template-columns:1fr}.photo-ribbon img{height:160px}}
.package-badge{display:inline-flex;align-items:center;background:var(--sun);color:var(--sun-ink);font-size:.67rem;letter-spacing:.11em;text-transform:uppercase;font-weight:800;border-radius:999px;padding:5px 10px;margin-left:8px}

/* ---------- tlačidlá ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;text-decoration:none;border:0;border-radius:999px;
  padding:15px 26px;font-weight:700;font-size:.96rem;letter-spacing:.005em;
  transition:transform .18s ease,filter .18s ease,background .18s ease
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.btn-sun{background:var(--sun);color:var(--sun-ink)}
.btn-line{background:rgba(255,255,255,.06);color:var(--bone);box-shadow:inset 0 0 0 1.4px var(--line-2);backdrop-filter:blur(6px)}
.btn-row{display:flex;flex-wrap:wrap;gap:13px;margin-top:0;align-items:center}
.scrollhint{
  display:inline-flex;align-items:center;gap:9px;font-size:.82rem;color:var(--bone-soft);
  letter-spacing:.06em;text-decoration:none
}
.scrollhint .arw{animation:bob 2.4s ease-in-out infinite;display:inline-block}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}

/* ---------- hlavička ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:40;padding:16px 0;
  transition:background .35s ease,backdrop-filter .35s ease,border-color .35s ease;
  border-bottom:1px solid transparent
}
header.solid{background:rgba(8,10,12,.72);backdrop-filter:blur(14px);border-bottom-color:var(--line)}
.hd{display:flex;align-items:center;gap:14px;max-width:1120px;margin:0 auto;padding:0 24px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font-weight:800;letter-spacing:-.02em;font-size:1.05rem}
.brand i{width:7px;height:7px;border-radius:50%;background:var(--sun);display:block}
.brand small{display:block;font-weight:500;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-soft)}
.sp{flex:1}
.langs{display:flex;gap:1px;border:1px solid var(--line-2);border-radius:999px;padding:2px;background:rgba(8,10,12,.45);backdrop-filter:blur(8px)}
.langs button{border:0;background:none;border-radius:999px;padding:5px 11px;font-size:.72rem;font-weight:800;letter-spacing:.09em;color:var(--bone-soft)}
.langs button[aria-pressed="true"]{background:var(--bone);color:var(--night)}
.hd .btn{padding:10px 18px;font-size:.85rem;display:none}
@media(min-width:780px){.hd .btn{display:inline-flex}}

/* ---------- sklo ---------- */
.glass{
  background:var(--glass);backdrop-filter:blur(16px) saturate(1.2);
  border:1px solid var(--line);border-radius:var(--r)
}

/* ---------- akt: výlety ---------- */
.tripcards{display:grid;gap:16px;margin-top:34px}
@media(min-width:700px){.tripcards{grid-template-columns:1fr 1fr}}
.tcard{padding:24px;display:flex;flex-direction:column;gap:11px;text-align:left}
.tcard .kicker{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--aqua);font-weight:700}
.tcard h3{font-size:1.34rem}
.tcard .who{color:#CFD5D9;font-size:.95rem;line-height:1.5}
.tcard .facts{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.tcard .facts span{font-size:.74rem;letter-spacing:.05em;color:var(--bone-soft);border:1px solid var(--line);border-radius:999px;padding:4px 10px}
.tcard .bot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.tcard .pr{font-size:1.3rem;font-weight:800;font-variant-numeric:tabular-nums}
.tcard .pr small{font-size:.75rem;font-weight:500;color:var(--bone-soft)}
.tcard .go{font-size:.86rem;font-weight:700;color:var(--sun);text-decoration:none;white-space:nowrap}
.morelink{display:inline-flex;align-items:center;gap:8px;margin-top:26px;font-weight:700;font-size:.93rem;text-decoration:none;color:var(--bone);border-bottom:1.5px solid var(--sun);padding-bottom:3px}

/* ---------- akt: viac ako výlety ---------- */
.svc{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px;max-width:720px}
.svc span{border:1px solid var(--line-2);border-radius:999px;padding:9px 17px;font-size:.9rem;background:rgba(10,14,18,.35);backdrop-filter:blur(8px)}
.punch{margin-top:30px;font-family:"Bodoni Moda",Didot,Georgia,serif;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.25;max-width:22ch}

/* ---------- slová miest ---------- */
.places{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:30px;max-width:800px}
.places span{font-family:"Bodoni Moda",Didot,Georgia,serif;font-size:clamp(1.15rem,2.2vw,1.7rem);color:#E7E3DA;opacity:.9}
.places span::after{content:"·";margin-left:26px;color:var(--sun);opacity:.7}
.places span:last-child::after{content:""}

/* ---------- pevné sekcie ---------- */
.solid{position:relative}
.sect{padding:96px 0}
.sect-head{display:flex;flex-direction:column;gap:14px;margin-bottom:38px;max-width:60ch}
.sect-head p{color:var(--bone-soft)}

/* Dani */
.dani{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.dani{grid-template-columns:.85fr 1.15fr}}
.portrait{
  aspect-ratio:4/5;border-radius:var(--r);border:1px solid var(--line);
  background:linear-gradient(165deg,#1D242A,#0D1114);
  display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:20px
}
.slot{
  align-self:flex-start;font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;
  color:var(--sun);border:1px dashed rgba(233,180,87,.5);border-radius:5px;padding:4px 9px
}
.portrait em{font-style:normal;font-size:.85rem;color:var(--bone-soft);line-height:1.4}
.dani p{color:#D3D8DC;margin-bottom:15px}
.dani .sig{font-family:"Bodoni Moda",Didot,Georgia,serif;font-size:1.35rem;line-height:1.3;color:var(--bone);border-left:2px solid var(--sun);padding-left:18px;margin-top:22px}

/* Ask-this */
.asks{display:grid;gap:0;border-top:1px solid var(--line)}
.ask{display:grid;gap:6px;padding:20px 0;border-bottom:1px solid var(--line)}
@media(min-width:760px){.ask{grid-template-columns:.9fr 1.1fr;gap:26px;align-items:start}}
.ask .q{font-weight:800;font-size:1rem;display:flex;gap:11px}
.ask .q b{color:var(--sun);font-weight:800;flex:none}
.ask .a{color:var(--bone-soft);font-size:.95rem}

/* builder */
.builder{display:grid;gap:26px;align-items:start}
@media(min-width:980px){.builder{grid-template-columns:1fr 330px}}
.trips{display:grid;gap:12px}
@media(min-width:640px){.trips{grid-template-columns:1fr 1fr}}
.trip{
  background:var(--basalt);border:1px solid var(--line);border-radius:13px;padding:16px 17px;
  display:flex;gap:13px;align-items:flex-start;text-align:left;color:inherit;
  transition:border-color .16s ease,background .16s ease
}
.trip:hover{border-color:var(--line-2)}
.trip[aria-pressed="true"]{border-color:var(--aqua);background:#122023}
.tick{width:23px;height:23px;border-radius:50%;border:1.5px solid var(--line-2);flex:none;display:grid;place-items:center;font-size:.72rem;color:transparent;margin-top:2px}
.trip[aria-pressed="true"] .tick,.addon[aria-pressed="true"] .tick{background:var(--aqua);border-color:var(--aqua);color:#04201C}
.trip .nm{flex:1;display:flex;flex-direction:column;gap:3px}
.trip .nm b{font-weight:700;font-size:.99rem;line-height:1.3}
.trip .nm span{font-size:.78rem;color:var(--bone-soft);letter-spacing:.04em}
.trip .pr{font-weight:800;font-variant-numeric:tabular-nums;font-size:.98rem;white-space:nowrap}
.addons{margin-top:22px;border-top:1px solid var(--line);padding-top:20px}
.addon-list{display:grid;gap:9px;margin-top:14px}
@media(min-width:640px){.addon-list{grid-template-columns:1fr 1fr}}
.addon{display:flex;align-items:center;gap:11px;background:var(--basalt);border:1px solid var(--line);border-radius:11px;padding:11px 13px;font-size:.9rem;text-align:left;color:inherit}
.addon[aria-pressed="true"]{border-color:var(--aqua)}
.addon .nm{flex:1}
.addon .pr{font-size:.84rem;color:var(--bone-soft);white-space:nowrap}
.cart{background:var(--basalt-2);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:15px}
@media(min-width:980px){.cart{position:sticky;top:88px}}
.cart-lines{display:flex;flex-direction:column;gap:7px;font-size:.9rem}
.cart-lines .empty{color:var(--bone-soft);line-height:1.45}
.cl{display:flex;justify-content:space-between;gap:10px}
.cl span:last-child{color:var(--bone-soft);font-variant-numeric:tabular-nums}
.totals{border-top:1px solid var(--line);padding-top:13px;display:flex;flex-direction:column;gap:6px;font-size:.92rem}
.totals div{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}
.totals .save{color:var(--sun);font-weight:800}
.totals .grand{font-size:1.55rem;font-weight:800;align-items:baseline;font-family:Manrope,sans-serif}
.ladder{display:none}
.rung{display:flex;gap:10px;font-size:.85rem;line-height:1.35;color:var(--bone-soft)}
.rung .mk{width:18px;height:18px;border-radius:50%;flex:none;border:1.5px solid var(--line-2);display:grid;place-items:center;font-size:.6rem;color:transparent;margin-top:2px}
.rung.on{color:var(--bone)}
.rung.on .mk{background:var(--sun);border-color:var(--sun);color:var(--sun-ink)}
.rung b{color:var(--bone)}

/* recenzie + príbehy */
.grid3{display:grid;gap:16px}
@media(min-width:820px){.grid3{grid-template-columns:repeat(3,1fr)}}
.rev{border:1px dashed var(--line-2);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:12px;min-height:180px;background:var(--basalt)}
.rev .st{color:var(--sun);letter-spacing:.16em;font-size:.9rem}
.rev .ph{color:var(--bone-soft);font-size:.92rem;line-height:1.5}
.rev .who{margin-top:auto;font-size:.78rem;color:var(--bone-soft);letter-spacing:.05em}
.story{background:var(--basalt);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:11px}
.story h3{font-family:"Bodoni Moda",Didot,Georgia,serif;font-weight:400;font-size:1.42rem;line-height:1.15}
.story p{color:var(--bone-soft);font-size:.93rem}
.story .todo{margin-top:auto;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--sun);opacity:.75}

/* ako to funguje */
.how{counter-reset:h;display:grid;gap:2px}
.how li{list-style:none;display:flex;gap:16px;padding:17px 0;border-bottom:1px solid var(--line);align-items:baseline}
.how li::before{counter-increment:h;content:counter(h);font-family:"Bodoni Moda",serif;font-size:1.5rem;color:var(--sun);width:30px;flex:none}
.how b{display:block;font-size:1rem}
.how span{color:var(--bone-soft);font-size:.93rem}

/* FAQ */
details{border-bottom:1px solid var(--line)}
details:first-of-type{border-top:1px solid var(--line)}
summary{cursor:pointer;padding:18px 36px 18px 0;font-weight:700;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:6px;top:15px;font-size:1.4rem;color:var(--sun);font-weight:400}
details[open] summary::after{content:"–"}
details .ans{padding:0 0 20px;color:var(--bone-soft);font-size:.95rem;max-width:70ch}

/* formulár */
.bookgrid{display:grid;gap:30px}
@media(min-width:920px){.bookgrid{grid-template-columns:1.05fr .95fr}}
.form{display:grid;gap:13px}
@media(min-width:560px){.form{grid-template-columns:1fr 1fr}}
.field{display:flex;flex-direction:column;gap:6px}
.field.wide{grid-column:1/-1}
.field label{font-size:.71rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--bone-soft)}
.field input,.field textarea{background:var(--basalt);border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:var(--bone);font:inherit;font-size:.95rem;width:100%}
.field input::placeholder,.field textarea::placeholder{color:#6C757C}
.field input:focus,.field textarea:focus{border-color:var(--aqua);outline:none}

/* Rezervačný výber priamo pri formulári */
.booking-picker{
  margin:clamp(24px,3vw,36px) 0 30px;
  padding:clamp(18px,2.4vw,28px);
  border:1px solid var(--line);border-radius:var(--r);
  background:rgba(10,14,17,.78);backdrop-filter:blur(10px)
}
.booking-picker-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:20px}
.booking-picker-head h3{font-size:clamp(1.15rem,1.5vw,1.45rem);line-height:1.2;margin:0}
.booking-picker-head p{max-width:62ch;color:var(--bone-soft);font-size:.9rem;margin:5px 0 0}
.booking-picker .trips{grid-template-columns:repeat(2,minmax(0,1fr))}
.booking-picker .addons{margin-top:20px}
.booking-picker .addon-list{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Booking-style termín OD–DO v jednom vizuálnom poli */
.stay-range{gap:8px}
.date-range-box{
  display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;
  border:1px solid var(--line);border-radius:13px;background:var(--basalt);overflow:hidden
}
.date-part{display:flex;flex-direction:column;gap:6px;padding:11px 14px 12px;min-width:0}
.date-part>span{font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;font-weight:800;color:var(--bone-soft)}
.date-part input{border:0!important;background:transparent!important;padding:2px 0!important;border-radius:0!important;min-height:28px}
.date-part input:focus{outline:none!important}
.date-range-arrow{display:grid;place-items:center;padding:0 8px;color:var(--sun);font-size:1.1rem;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.range-hint{margin:0;color:var(--bone-soft);font-size:.78rem;line-height:1.45}

@media(max-width:719px){
  .booking-picker{padding:16px;margin-bottom:24px}
  .booking-picker-head{display:block;margin-bottom:16px}
  .booking-picker .trips,.booking-picker .addon-list{grid-template-columns:1fr}
  .date-range-box{grid-template-columns:1fr}
  .date-range-arrow{height:28px;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(90deg)}
}
.sumbox{background:var(--basalt-2);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:14px}
.sumbox .lines{font-size:.92rem;color:var(--bone-soft);display:flex;flex-direction:column;gap:6px}
.sumbox .tot{font-size:1.7rem;font-weight:800;font-variant-numeric:tabular-nums}
.note{font-size:.83rem;color:var(--bone-soft);line-height:1.5}

/* kontakt */
.cc-grid{display:grid;gap:12px}
@media(min-width:700px){.cc-grid{grid-template-columns:1fr 1fr}}
.cc{display:flex;align-items:center;gap:14px;background:var(--basalt);border:1px solid var(--line);border-radius:13px;padding:15px 17px;text-decoration:none;transition:border-color .16s ease}
.cc:hover{border-color:var(--sun)}
.cc .ic{width:38px;height:38px;border-radius:10px;background:rgba(233,180,87,.13);color:var(--sun);display:grid;place-items:center;flex:none}
.cc .ic svg{width:19px;height:19px;fill:currentColor}
.cc b{display:block;font-size:.97rem}
.cc em{font-style:normal;font-size:.82rem;color:var(--bone-soft)}

/* záverečný akt + päta */
#act-sunset{text-align:center}
#act-sunset .wrap{max-width:820px}
#act-sunset .btn-row{justify-content:center}
footer{position:relative;z-index:3;background:var(--night);border-top:1px solid var(--line);padding:34px 0 96px;font-size:.84rem;color:var(--bone-soft)}
.legal-inline{margin-top:10px;max-width:70ch}.legal-inline a{text-decoration:underline;text-underline-offset:3px}.foot .lnk{display:flex;gap:16px 22px;flex-wrap:wrap}.foot .lnk a{text-decoration:none}.foot .lnk a:hover{text-decoration:underline}
.foot{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}
.foot a{text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:1px}
.foot .lnk{display:flex;gap:16px;flex-wrap:wrap}

/* sticky WhatsApp */
#wafloat{
  position:fixed;z-index:45;right:22px;bottom:22px;display:none;align-items:center;gap:10px;
  background:var(--sun);color:var(--sun-ink);border-radius:999px;padding:13px 20px;font-weight:800;
  text-decoration:none;font-size:.9rem;box-shadow:0 10px 30px -12px rgba(0,0,0,.9)
}
#wafloat.show{display:inline-flex}
@media(max-width:779px){
  #wafloat{left:14px;right:14px;bottom:14px;bottom:calc(14px + env(safe-area-inset-bottom));justify-content:center;padding:15px}
}
#wafloat svg{width:17px;height:17px;fill:currentColor}


/* ===== V6 — scroll-in journey: text dwells, background travels ===== */
#stage{background:#050708}
#stage .sceneLayer{position:absolute;inset:-4%;z-index:2;background-position:center;background-size:cover;opacity:0;transform:scale(1.07) translate3d(0,0,0);will-change:opacity,transform;pointer-events:none}
#stage .sceneLayer.armed{background-image:var(--layer-img)}
#stage .sceneLayer::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,10,.69) 0%,rgba(5,8,10,.18) 55%,rgba(5,8,10,.36) 100%),linear-gradient(180deg,rgba(5,8,10,.15),rgba(5,8,10,.52))}
#stage .sceneLayer.active{opacity:1}
#stage.videoMode video{opacity:1}#stage:not(.videoMode) video{opacity:.08}
#stage video{transition:opacity .45s ease}
#heroCover{z-index:4}
.act.journey{min-height:150vh;min-height:150svh}
.act.journey .wrap{position:sticky;top:0;min-height:100vh;min-height:100svh;justify-content:center}
.act.journey .reveal{max-width:780px}
.act.journey.right .reveal{margin-left:auto;max-width:650px}
.act.journey.center .reveal{margin-left:auto;margin-right:auto;text-align:center;max-width:790px}
.act.journey.center .lead{margin-left:auto;margin-right:auto}
.journey-cta{margin-top:28px}
.micro{margin-top:13px;color:var(--bone-soft);font-size:.78rem;letter-spacing:.04em}
.scene-index{position:absolute;right:25px;bottom:26px;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(243,240,234,.52)}
.package-grid{display:grid;gap:18px;margin-top:30px}
@media(min-width:820px){.package-grid{grid-template-columns:repeat(3,1fr)}}
.package-card{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--basalt);display:flex;flex-direction:column;min-height:100%}
.package-card.popular{border-color:rgba(233,180,87,.62);transform:translateY(-6px);box-shadow:0 26px 80px -55px rgba(233,180,87,.6)}
.package-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.package-card .body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.package-card h3{font-family:"Bodoni Moda",Didot,Georgia,serif;font-size:1.45rem;font-weight:400}
.package-card p{color:var(--bone-soft);font-size:.9rem}
.package-card ul{list-style:none;padding:0;margin:4px 0 14px;display:grid;gap:7px;font-size:.84rem;color:#D5DBDF}.package-card li::before{content:"— ";color:var(--sun)}
.package-card .btn{margin-top:auto;justify-content:center}
.popular-tag{position:absolute;top:14px;right:14px;background:var(--sun);color:var(--sun-ink);font-weight:800;text-transform:uppercase;letter-spacing:.09em;font-size:.63rem;padding:7px 10px;border-radius:999px;z-index:2}
.funnel-rail{display:flex;align-items:center;gap:8px;margin-top:18px;color:var(--bone-soft);font-size:.75rem;flex-wrap:wrap}.funnel-rail b{color:var(--bone)}.funnel-rail i{width:24px;height:1px;background:var(--line-2);display:inline-block}
.reserve-note{padding:16px 18px;border:1px solid rgba(233,180,87,.35);border-radius:12px;background:rgba(233,180,87,.07);font-size:.88rem;color:#E7E1D6;margin-bottom:18px}
.reserve-note b{color:var(--sun)}
.review-cta{margin-top:28px}
@media(max-width:779px){.act.journey{min-height:126vh;min-height:126svh}.act.journey.right .reveal{margin-left:0}.package-card.popular{transform:none}.scene-index{display:none}}


/* ===== PREZENTAČNÁ VERZIA — kontrolované vizuálne úpravy ===== */
#stage{background:#071016 url("/assets/images/01-1200.webp") center/cover no-repeat}
#stage.videoMode video{opacity:1!important;visibility:visible!important}
#stage video{z-index:1;opacity:1;filter:saturate(1.04) contrast(1.03)}
#stage .sceneLayer{z-index:2}
#solidbg{background:#080a0c;opacity:0;z-index:2}
.act h1,.act h2.display{font-weight:500;text-shadow:0 3px 36px rgba(0,0,0,.94),0 1px 4px rgba(0,0,0,.9)}
.act .lead{font-weight:500;text-shadow:0 2px 18px rgba(0,0,0,.92)}

/* V pevnej polovici má KAŽDÁ hlavná sekcia vlastný obraz, nie čiernu plochu. */
.solid{background:#0a0d10}
.photo-sect{position:relative;isolation:isolate;overflow:hidden;background:#0b0f12}
.photo-sect::before{content:"";position:absolute;inset:0;z-index:-2;background-image:none;background-position:center;background-size:cover;opacity:.42;transform:scale(1.02)}
.photo-sect::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,10,12,.92) 0%,rgba(8,10,12,.72) 48%,rgba(8,10,12,.85) 100%),linear-gradient(180deg,rgba(8,10,12,.38),rgba(8,10,12,.78))}
.photo-sect.bg-in::before{background-image:var(--sect-img)}
.photo-sect:nth-of-type(even)::before{background-position:60% center;opacity:.36}
.photo-dani{--sect-img:url("/assets/images/02-1200.webp")}
.photo-ask{--sect-img:url("/assets/images/03-1200.webp")}
.photo-packages{--sect-img:url("/assets/images/04-720.webp")}
.photo-builder{--sect-img:url("/assets/images/03-1200.webp")}
.photo-reviews{--sect-img:url("/assets/images/05-1200.webp")}
.photo-stories{--sect-img:url("/assets/images/06-1200.webp")}
.photo-how{--sect-img:url("/assets/images/07-900.webp")}
.photo-faq{--sect-img:url("/assets/images/08-1080.webp")}
.photo-book{--sect-img:url("/assets/images/01-1200.webp")}
.photo-contact{--sect-img:url("/assets/images/04-720.webp")}
.photo-sect .wrap{position:relative;z-index:1}
.photo-sect + .photo-sect{border-top:1px solid rgba(255,255,255,.06)}

/* Dani musí byť vizuálne dominantný */
.portrait.real{min-height:560px;overflow:hidden;background:#111}
.portrait.real img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%;display:block}
.photoTag{background:rgba(8,10,12,.72);backdrop-filter:blur(8px)}

/* Balíky: fotografie sú povinná vizuálna časť karty */
.package-card{background:rgba(12,16,19,.90);backdrop-filter:blur(10px);box-shadow:0 22px 65px rgba(0,0,0,.26)}
.package-card img{height:230px;aspect-ratio:auto;object-fit:cover;filter:saturate(1.08) contrast(1.03)}
.package-card h3{font-weight:500;font-size:1.62rem}
.mini-kicker{font-size:.69rem;letter-spacing:.16em;text-transform:uppercase;color:var(--aqua);font-weight:800}
.package-price{display:flex;align-items:baseline;gap:8px;margin:2px 0 8px}.package-price b{font-size:1.7rem}.package-price span{color:var(--bone-soft);font-size:.75rem}

/* Builder a rezervácia ako svetlé ostrovčeky nad fotkou */
.builder,.bookgrid{position:relative}
.cart,.sumbox{background:rgba(18,23,28,.92);backdrop-filter:blur(16px)}
.trips .trip,.addon{background:rgba(15,19,23,.90)}
.reserve-note{background:rgba(8,10,12,.70);backdrop-filter:blur(12px)}
.reserve-note span{color:var(--sun)}

/* Reálne screenshoty musia byť jasne viditeľné */
.reviewshot{background:#f6f6f6;box-shadow:0 22px 60px rgba(0,0,0,.26)}
.reviewshot img{background:#fff;filter:none}
.reviewshot .cap{background:rgba(12,16,19,.97)}

/* Texty na obrazových sekciách */
.photo-sect .sect-head p,.photo-sect .ask .a,.photo-sect .how span,.photo-sect details .ans{color:#cbd2d7}

@media(max-width:779px){
  #wafloat{left:auto;right:14px;width:54px;height:54px;padding:0;justify-content:center;border-radius:50%}
  #wafloat span{display:none}
  #wafloat svg{width:21px;height:21px}
  .photo-sect::before{opacity:.32;background-position:center}
  .photo-sect::after{background:linear-gradient(180deg,rgba(8,10,12,.76),rgba(8,10,12,.90))}
  .portrait.real{min-height:440px}
  .package-card img{height:205px}
  .act h1,.act h2.display{font-weight:500}
}

.sumbox .tot small{font-size:.72rem;color:var(--bone-soft);font-weight:600}.deposit-info{font-size:.9rem;color:var(--sun);font-family:Manrope,sans-serif}.calc-detail{margin-top:8px;color:var(--sun);font-size:.8rem}

/* ===== FINAL CONCEPT · PERFORMANCE + TABLET/MOBILE ===== */
html,body{max-width:100%;overflow-x:hidden}
#stage{contain:layout paint;transform:translateZ(0)}
#stage video{will-change:contents;transform:translateZ(0)}
.sceneLayer{transition:opacity .36s ease;backface-visibility:hidden}
@media (max-width:1180px){
  #wafloat{width:54px;height:54px;right:16px;left:auto;bottom:16px;padding:0;border-radius:50%;justify-content:center}
  #wafloat span{display:none}
  #wafloat svg{width:20px;height:20px}
  .act.journey{min-height:125vh;min-height:125svh;padding:0}
  .act.journey .wrap{position:sticky;top:0;min-height:100vh;min-height:100svh;padding-top:104px;padding-bottom:88px;justify-content:center}
  .act.journey.right .reveal{margin-left:0;max-width:760px}
  .scene-index{display:none}
  .glass,.cart,.sumbox,.package-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .photo-sect::before{transform:none!important}
}
@media (max-width:779px){
  body{font-size:16px;-webkit-overflow-scrolling:touch}
  .wrap{padding-left:18px;padding-right:18px}
  .act.journey{min-height:118vh;min-height:118svh}
  .act.journey .wrap{min-height:100vh;min-height:100svh;padding-top:92px;padding-bottom:86px}
  .act h1{font-size:clamp(2.45rem,13vw,4rem);line-height:.98}
  .act h2.display{font-size:clamp(2.15rem,11vw,3.45rem);line-height:1.01}
  .act .lead{font-size:1rem;line-height:1.55;max-width:34ch}
  .places{gap:7px 14px}.places span{font-size:1.05rem}.places span::after{margin-left:14px}
  .tripcards{grid-template-columns:1fr}
  .tcard{padding:18px}
  .sect{padding:72px 0}
  .sect-head{margin-bottom:28px}
  .photo-sect::before{opacity:.38!important}
  .photo-sect::after{background:linear-gradient(180deg,rgba(8,10,12,.66),rgba(8,10,12,.89))!important}
  .dani{gap:26px}.portrait.real{min-height:410px}
  .package-grid{grid-template-columns:1fr}.package-card img{height:215px}
  .builder,.bookgrid{grid-template-columns:1fr!important}
  .cart{position:relative!important;top:auto!important}
  .reviewshots{grid-template-columns:1fr!important}
  .field,.field.wide{grid-column:1/-1}
  .btn{padding:14px 19px}.btn-row{gap:10px;margin-top:26px}
}
@media (prefers-reduced-motion:reduce){#stage video{display:none}.sceneLayer{transform:none!important}}


/* --- iOS / tablet: backdrop-filter je na Safari drahý, pod 1200px ho vypíname --- */
@media (max-width:1199px),(pointer:coarse){
  .glass,.langs,.btn-line,.svc span,.tcard,.pack,.package-card,.cart,.sumbox,header.solid{
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .glass,.tcard,.pack,.package-card{background:rgba(9,13,16,.86)}
  header.solid{background:rgba(8,10,12,.94)}
  #stage .sceneLayer,#stage video{transform:none!important}
}
/* safe-area aj pre plávajúce CTA na výšku aj šírku */
#wafloat{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
/* na malých výškach nech sticky scéna nezožerie celú obrazovku */
@media (max-height:520px){.act.journey{min-height:135vh;min-height:135svh}}

/* ============================================================
   MOBIL — opravy layoutu (pridané pri produkčnom dotiahnutí)
   ============================================================ */
@media (max-width:759px){
  /* "Na toto sa pýtaj" ostávalo dvojstĺpcové → otázka bola nečitateľne malá */
  .ask{grid-template-columns:1fr!important;gap:8px!important;padding:16px 0!important}
  .ask .q{font-size:1.02rem!important;line-height:1.3}
  .ask .a{font-size:.97rem!important;line-height:1.55}

  /* screenshoty recenzií musia byť čitateľné → jeden stĺpec na plnú šírku */
  .reviewshots{grid-template-columns:1fr!important;gap:14px!important}
  .reviewshot{width:100%!important}
  .reviewshot img{width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}
  .reviewshot .cap{font-size:.95rem!important;line-height:1.45!important;padding:14px 16px!important}

  /* nič v obsahu nesmie zostať dvojstĺpcové */
  .grid3,.tripcards,.package-grid,.builder,.bookgrid,.form,.cc-grid,.photo-ribbon,.trustbar,.months,.addon-list{
    grid-template-columns:1fr!important}
}
@media (max-width:420px){
  .act h1{font-size:clamp(2.1rem,11.5vw,3.2rem)!important}
  .act h2.display{font-size:clamp(1.85rem,10vw,2.8rem)!important}
}

/* rýchly rozcestník — na mobile/tablete pod herom, na desktope v menu */
#quicknav{display:none}
/* ============================================================
   V12 — VISUAL QA / SPACING / RESPONSIVE POLISH
   Schválený dizajn ostáva zachovaný. Tieto pravidlá iba čistia
   rozostupy, zalamovanie, recenzie a CTA na všetkých breakpointoch.
   ============================================================ */

/* Typografia: prirodzené riadky bez osamelých slov a delenia slov */
h1,h2,h3,.sig,.punch,.package-card h3,.story h3{
  text-wrap:balance;
  hyphens:none;
  -webkit-hyphens:none;
  word-break:normal;
  overflow-wrap:normal;
}
p,.lead,.ask .a,.how span,.cap,.note,details .ans{
  text-wrap:pretty;
  hyphens:none;
  -webkit-hyphens:none;
  word-break:normal;
  overflow-wrap:normal;
}

/* Konzistentný vertikálny rytmus */
.sect{padding-block:clamp(78px,8vw,112px)}
.sect-head{gap:16px;margin-bottom:clamp(30px,4vw,46px)}
.sect-head p{max-width:68ch}
.photo-sect .wrap{padding-top:2px;padding-bottom:2px}

/* CTA majú vždy samostatný priestor — nie sú nalepené na text/karty */
.btn-row,.journey-cta,.review-cta{margin-top:clamp(28px,3vw,38px)}
.btn-row{gap:14px 16px}
.btn{min-height:50px;padding:14px 24px;line-height:1.2;text-align:center;justify-content:center;text-wrap:balance}
.package-card .btn{margin-top:20px;min-height:52px}
.cart>.btn{margin-top:4px}
.field.wide>.btn,#sendWa{margin-top:4px}

/* Hero / cinematic text — menej široké bloky, lepšia čitateľnosť cez obraz */
.act.journey .reveal{max-width:min(720px,72vw)}
.act.journey.right .reveal{max-width:min(620px,62vw)}
.act.journey.center .reveal{max-width:min(780px,80vw)}
.act.journey .lead{max-width:42ch}
.act.journey h1,.act.journey h2.display{max-width:16ch}
.act.journey.center h1,.act.journey.center h2.display{max-width:18ch;margin-inline:auto}
.act.journey.right .lead{max-width:39ch}
.hero-proof{margin-top:26px;row-gap:10px}

/* Dani blok */
.dani{gap:clamp(34px,5vw,64px)}
.dani>div:last-child{max-width:680px}
.dani .sig{margin-top:26px;margin-bottom:26px}
.trustbar{margin-top:24px}
.dani .btn-row{margin-top:28px}

/* Balíky — rovnaké dýchanie a CTA spodok */
.package-grid{gap:22px}
.package-card .body{padding:24px 24px 26px;gap:12px}
.package-card ul{margin-bottom:12px}
.package-price{margin-top:6px!important;margin-bottom:2px!important}

/* Recenzie: vyvážené dva stĺpce bez prázdnych dier medzi rôzne vysokými screenshotmi */
.reviewshots{display:block;columns:2;column-gap:20px}
.reviewshot,.reviewshot.featured{display:inline-block;width:100%;margin:0 0 20px;break-inside:avoid;grid-row:auto}
.reviewshot img{width:100%;height:auto;max-height:none;object-fit:contain}
.reviewshot .cap{padding:14px 16px;line-height:1.45}
.review-cta{clear:both;padding-top:4px}

/* Príbehy a FAQ */
.grid3{gap:20px}
.story{padding:26px;gap:13px}
.how li{padding:20px 0;gap:18px}
details summary{padding-block:20px}

/* Builder / formulár — viac vzduchu medzi funkčnými prvkami */
.trips{gap:14px}.addon-list{gap:11px}
.trip{padding:17px 18px}.addon{padding:13px 14px}
.cart{padding:24px;gap:17px}
.reserve-note{margin-bottom:24px;padding:18px 20px;line-height:1.55}
.funnel-rail{margin-top:0;margin-bottom:28px;gap:9px 10px}
.bookgrid{gap:28px}
.form{gap:18px}
.sumbox{padding:24px}

/* Tablet: vizuálne rovnaký web, ale pohodlnejšie šírky a CTA */
@media (min-width:760px) and (max-width:1199px){
  .wrap{padding-left:30px;padding-right:30px}
  h2.plain{font-size:clamp(1.75rem,3.2vw,2.15rem);line-height:1.08}
  .sect-head{max-width:64ch}
  .package-grid{gap:18px}
  .package-card .body{padding:22px}
  .reviewshots{columns:2;column-gap:18px}
  .btn{padding-inline:22px}
}

/* Mobil: nič neorezávať, menšie fonty radšej než osamelé slovo v novom riadku */
@media (max-width:759px){
  .wrap{padding-left:20px;padding-right:20px}
  body{font-size:16px;line-height:1.58}
  .sect{padding-block:64px}
  .sect-head{gap:12px;margin-bottom:26px}
  h2.plain{font-size:clamp(1.45rem,6.6vw,1.82rem);line-height:1.1;letter-spacing:-.025em}
  h3{line-height:1.22}
  .act.journey .reveal,.act.journey.right .reveal,.act.journey.center .reveal{max-width:100%}
  .act.journey h1,.act.journey h2.display,.act.journey.center h1,.act.journey.center h2.display{max-width:18ch}
  .act.journey .lead{max-width:35ch}
  .btn-row,.journey-cta,.review-cta{margin-top:26px}
  .btn-row{gap:12px;align-items:stretch}
  .btn-row .btn{max-width:100%}
  .btn{min-height:50px;padding:14px 20px;font-size:.94rem}
  .package-card .body{padding:21px 20px 23px}
  .package-card .btn{margin-top:18px;width:100%}
  .package-price{margin-top:8px!important}
  .reviewshots{columns:1!important;column-gap:0!important}
  .reviewshot,.reviewshot.featured{display:block!important;width:100%!important;margin-bottom:18px!important}
  .reviewshot img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}
  .reviewshot .cap{font-size:.9rem!important;padding:13px 15px!important}
  .review-cta .btn{width:100%}
  .story{padding:22px}
  .how li{padding:18px 0}
  .dani{gap:28px}
  .dani .sig{margin-block:22px}
  .trustbar{margin-top:20px}
  .reserve-note{margin-bottom:20px;padding:16px}
  .funnel-rail{margin-bottom:22px}
  .form{gap:15px}
  .cart,.sumbox{padding:20px}
}

@media (max-width:420px){
  .wrap{padding-left:17px;padding-right:17px}
  h2.plain{font-size:clamp(1.38rem,6.3vw,1.7rem)}
  .btn{padding-inline:17px}
  .hero-proof{font-size:.78rem;gap:8px 14px}
}


.photo-consult{--sect-img:url("/assets/images/10-1200.webp")}
.consult-card{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;padding:30px;border:1px solid rgba(233,180,87,.28);border-radius:var(--r);background:rgba(9,13,16,.82)}
.consult-card p:not(.eyebrow){color:#cbd2d7;max-width:64ch;margin-top:14px}
.consult-card .btn{min-width:210px}
.checkline{display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;color:var(--bone-soft);font-size:.9rem;cursor:pointer}
.checkline input{width:18px;height:18px;accent-color:var(--sun)}
.send-row{gap:14px!important}.send-row .btn{width:100%}
@media(max-width:759px){.consult-card{grid-template-columns:1fr;padding:22px;gap:20px}.consult-card .btn{width:100%;min-width:0}}



/* ===== V14 DESKTOP COMPOSITION PASS =====
   Desktop využíva šírku obrazovky. Tablet a mobil ostávajú kompaktné. */
@media (min-width:1200px){
  /* širší desktopový pracovný priestor */
  .wrap{max-width:1280px;padding-left:42px;padding-right:42px}
  .hd{max-width:1280px;padding-left:42px;padding-right:42px}

  /* Cinematic text: desktop už nededí tabletové max-width limity */
  .act.journey .reveal{max-width:820px}
  .act.journey.right .reveal{max-width:700px}
  .act.journey .lead{max-width:52ch}
  .act.journey.right .lead{max-width:46ch}
  .act.journey h1,.act.journey h2.display{max-width:22ch}

  /* Záver pôvodného videa využije šírku desktopu a nebude zalomený ako tablet */
  #act-sunset-video .wrap{max-width:1280px}
  #act-sunset-video .reveal{max-width:1120px;margin-inline:auto}
  #act-sunset-video h2.display{max-width:24ch;margin-inline:auto;font-size:clamp(3.4rem,5.3vw,5.7rem);line-height:.98}
  #act-sunset-video .lead{max-width:68ch;margin-inline:auto;font-size:1.2rem}

  /* Papagáj: nechávame celý subjekt vpravo, copy ide do voľného ľavého priestoru */
  #scene-parrot{background-position:68% 34%;transform:scale(1.015) translate3d(0,0,0)}
  #scene-parrot::after{background:
    linear-gradient(90deg,rgba(5,8,10,.82) 0%,rgba(5,8,10,.66) 31%,rgba(5,8,10,.16) 58%,rgba(5,8,10,.06) 78%,rgba(5,8,10,.22) 100%),
    linear-gradient(180deg,rgba(5,8,10,.12),rgba(5,8,10,.38));}
  #act-nature .wrap{max-width:1280px}
  #act-nature .reveal{margin-left:0;margin-right:auto;max-width:570px}
  #act-nature h2.display{max-width:15ch;font-size:clamp(3rem,4.4vw,5rem)}
  #act-nature .places{max-width:560px;gap:8px 20px}
  #act-nature .places span{font-size:clamp(1.08rem,1.55vw,1.45rem)}
  #act-nature .places span::after{margin-left:20px}
  #act-nature .lead{max-width:44ch}
  #act-nature .micro{max-width:58ch}

  /* Kakao ostáva vzdušné, ale text môže využiť desktopovú šírku */
  #act-cacao .reveal{max-width:800px}
  #act-cacao h2.display{max-width:19ch}
  #act-cacao .lead{max-width:56ch}

  /* 4 hlavné dni: presne štyri karty vedľa seba na širokom desktope */
  #act-trips .wrap{max-width:1340px}
  #act-trips .reveal{max-width:100%}
  #act-trips h2.display{max-width:none;width:100%;font-size:clamp(2.9rem,4.2vw,4.7rem)}
  #act-trips .tripcards{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:30px}
  #act-trips .tcard{padding:0;gap:0;overflow:hidden;min-width:0}
  #act-trips .tcard .tripimg{height:150px}
  #act-trips .tcard .tcontent{padding:18px 18px 20px;min-height:286px;gap:9px}
  #act-trips .tcard h3{font-size:1.13rem;line-height:1.17}
  #act-trips .tcard .who{font-size:.85rem;line-height:1.43}
  #act-trips .tcard .facts{gap:6px}
  #act-trips .tcard .facts span{font-size:.68rem;padding:4px 8px}
  #act-trips .tcard .bot{gap:8px;padding-top:10px}
  #act-trips .tcard .pr{font-size:1.12rem}
  #act-trips .tcard .go{font-size:.78rem}
  #act-trips .btn-row{justify-content:center;margin-top:30px}

  /* Pevná časť používa šírku desktopu, nie tabletový stĺpec */
  .solid>.sect>.wrap{max-width:1280px}
  .solid .narrow{max-width:860px}

  /* Recenzie: symetrickejší masonry layout s rovnomerným horným zarovnaním */
  .reviewshots{columns:2;column-gap:26px;max-width:1120px;margin-inline:auto}
  .reviewshot,.reviewshot.featured{margin-bottom:26px}
  .review-cta{text-align:center}

  /* CTA majú na desktopoch viditeľný priestor od susedných prvkov */
  .btn-row,.journey-cta,.review-cta{margin-top:34px}
  .btn{padding-left:28px;padding-right:28px}
}

@media (min-width:1500px){
  .wrap,.hd,#act-sunset-video .wrap,#act-nature .wrap{max-width:1380px}
  #act-trips .wrap{max-width:1440px}
  #act-trips .tripcards{gap:22px}
  #act-trips .tcard .tripimg{height:165px}
}


/* ===== V17 MASTER POLISH ===== */
/* Native date controls remain native for reliability, but the call-to-action is explicit. */
.date-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px}
.date-part input[type="date"]{color-scheme:dark;cursor:pointer;color:var(--bone)}
.date-part input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(87%) sepia(31%) saturate(1147%) hue-rotate(339deg) brightness(104%) contrast(87%);opacity:1;cursor:pointer;width:19px;height:19px}
.date-open{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 11px;border:1px solid rgba(233,180,87,.42);border-radius:10px;background:rgba(233,180,87,.09);color:var(--sun);font:inherit;font-size:.73rem;font-weight:800;cursor:pointer;white-space:nowrap}
.date-open:hover{background:rgba(233,180,87,.16);border-color:var(--sun)}
.date-open svg{width:16px;height:16px;fill:currentColor;flex:none}

/* Strong dark-section typography follows the visual rhythm of the cinematic half. */
.solid h2.plain{font-weight:800;letter-spacing:-.038em;line-height:1.04;text-wrap:balance}
.solid .sect-head>p{max-width:72ch}

/* Final desktop act: use the available canvas, deliberately two-line-ish rather than tablet width. */
@media(min-width:1200px){
  #act-sunset .wrap{max-width:1320px}
  #act-sunset .reveal{max-width:1180px;margin-inline:auto}
  #act-sunset h2.display{max-width:30ch;margin-inline:auto;font-size:clamp(3.7rem,5.4vw,6rem);line-height:.96;text-wrap:balance}
  #act-sunset .lead{max-width:72ch;font-size:1.18rem}
  #act-sunset .btn-row{margin-top:36px}
  .date-range-box{min-height:92px}
  .date-part{padding:14px 16px}
  .date-part input[type="date"]{font-size:1.05rem;min-height:34px}
}

/* Mobile: two clean date cards like the earlier version; no tall connected vertical widget. */
@media(max-width:719px){
  .date-range-box{grid-template-columns:1fr 1fr;gap:10px;border:0;background:transparent;overflow:visible}
  .date-range-arrow{display:none}
  .date-part{border:1px solid var(--line);border-radius:13px;background:var(--basalt);padding:12px 12px 13px;min-width:0}
  .date-input-row{grid-template-columns:1fr;gap:7px}
  .date-part input[type="date"]{font-size:.93rem;min-width:0;width:100%}
  .date-open{width:100%;min-height:36px;padding:7px 8px;font-size:.7rem}
  .range-hint{margin-top:2px}
}
@media(max-width:390px){
  .date-range-box{gap:8px}
  .date-part{padding:11px 9px 12px}
  .date-part>span{font-size:.56rem;letter-spacing:.08em}
  .date-open{font-size:.65rem}
}

/* Hungarian contains long compounds: scale typography instead of pushing text outside the viewport. */
@media(max-width:759px){
  html[lang="hu"] #act-space h1{font-size:clamp(2.1rem,9vw,2.75rem)!important;line-height:1.02;letter-spacing:-.025em;max-width:100%;overflow-wrap:normal;word-break:normal}
  html[lang="hu"] h2.plain{font-size:clamp(1.34rem,5.9vw,1.68rem);overflow-wrap:normal;word-break:normal}
  html[lang="hu"] .package-card h3{font-size:1.32rem}
  html[lang="hu"] .btn{font-size:.88rem;padding-inline:14px}
}

/* Footer/social rows stay readable and separated. */
.foot .lnk a{margin-block:3px}



/* ===== V18 FINAL QA ===== */
/* Major headings on dark photographic sections use the same elegant family as the cinematic half. */
.solid h2.plain{
  font-family:"Bodoni Moda",Didot,Georgia,serif;
  font-weight:600;
  letter-spacing:-.026em;
  line-height:1.02;
  text-wrap:balance;
  -webkit-text-stroke:.12px currentColor;
}
@media(max-width:719px){
  .solid h2.plain{font-size:clamp(2rem,9vw,2.9rem);line-height:1.02}
  html[lang="hu"] .solid h2.plain{font-size:clamp(1.85rem,8.2vw,2.55rem)}
}

/* iPhone/iPad/tablet reliability: below desktop width the native date field itself is the control.
   No secondary calendar button = nothing for Safari/WebView to block. */
@media(max-width:1199px), (pointer:coarse){
  .date-input-row{display:block!important}
  .date-open{display:none!important}
  .date-part input[type="date"]{
    display:block!important;
    width:100%!important;
    min-height:52px!important;
    padding:10px 2px!important;
    font-size:16px!important;
    line-height:1.2!important;
    color:var(--bone)!important;
    background:transparent!important;
    -webkit-appearance:auto!important;
    appearance:auto!important;
    touch-action:manipulation;
    pointer-events:auto!important;
    position:relative;
    z-index:2;
  }
  .date-part input[type="date"]::-webkit-calendar-picker-indicator{
    opacity:1!important;
    width:22px!important;
    height:22px!important;
  }
  .date-part input[type="date"]::-webkit-date-and-time-value{text-align:left}
}

/* Reviews are the proof themselves — no internal marketing captions below screenshots. */
.reviewshot .cap{display:none!important}
.reviewshot{background:transparent}
.reviewshot img{border-radius:inherit}

/* Keep CTA breathing room consistent on all viewports. */
.btn-row,.journey-cta,.review-cta,.send-row{scroll-margin-top:96px}
@media(max-width:719px){
  .btn-row{gap:12px}
  .btn-row .btn,.journey-cta .btn,.review-cta .btn{margin-block:2px}
}


/* ============================================================
   V19 — PRODUKČNÁ VRSTVA
   Dizajn ostáva. Menia sa iba technické veci: responzívne obrázky,
   navigácia na dlhej stránke, consent, validácia, prístupnosť.
   ============================================================ */

/* --- font fallback: menší CLS kým sa načíta Bodoni/Manrope --- */
@font-face{font-family:"Bodoni fallback";src:local("Georgia"),local("Times New Roman"),local("DejaVu Serif");
  size-adjust:104%;ascent-override:92%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:"Manrope fallback";src:local("Segoe UI"),local("Helvetica Neue"),local("Arial"),local("DejaVu Sans");
  size-adjust:100%;ascent-override:100%;descent-override:26%;line-gap-override:0%}
body{font-family:Manrope,"Manrope fallback","Segoe UI",system-ui,sans-serif}
h1,h2.display,.solid h2.plain,.punch,.places span,.dani .sig,.story h3,.package-card h3,.trustbar b,.how li::before{
  font-family:"Bodoni Moda","Bodoni fallback",Didot,Georgia,serif}

/* --- skip link --- */
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--sun);color:var(--sun-ink);
  padding:12px 18px;border-radius:0 0 10px 0;font-weight:800;text-decoration:none}
.skip:focus{left:0}

/* --- responzívne pozadia: menšie obrázky na menších obrazovkách --- */
#heroCover{background-image:
 linear-gradient(90deg,rgba(5,8,10,.67),rgba(5,8,10,.10) 58%,rgba(5,8,10,.28)),
 linear-gradient(180deg,rgba(5,8,10,.08),rgba(5,8,10,.36)),
 url("/assets/images/01-720.webp")}
@media(min-width:721px){#heroCover{background-image:
 linear-gradient(90deg,rgba(5,8,10,.67),rgba(5,8,10,.10) 58%,rgba(5,8,10,.28)),
 linear-gradient(180deg,rgba(5,8,10,.08),rgba(5,8,10,.36)),
 url("/assets/images/01-1200.webp")}}

#stage{background-image:url("/assets/images/01-720.webp")}
@media(min-width:721px){#stage{background-image:url("/assets/images/01-1200.webp")}}

#scene-beach{--layer-img:url("/assets/images/05-760.webp")}
#scene-jungle{--layer-img:url("/assets/images/10-760.webp")}
#scene-stairs{--layer-img:url("/assets/images/07-480.webp")}
#scene-waterfall{--layer-img:url("/assets/images/11-720.webp")}
#scene-parrot{--layer-img:url("/assets/images/12-720.webp")}
#scene-cacao{--layer-img:url("/assets/images/08-720.webp")}
#scene-underwater{--layer-img:url("/assets/images/13-720.webp")}
#scene-sunset{--layer-img:url("/assets/images/04-720.webp")}
@media(min-width:1000px){
  #scene-beach{--layer-img:url("/assets/images/05-1680.webp")}
  #scene-jungle{--layer-img:url("/assets/images/10-1680.webp")}
  #scene-stairs{--layer-img:url("/assets/images/07-900.webp")}
  #scene-waterfall{--layer-img:url("/assets/images/11-900.webp")}
  #scene-parrot{--layer-img:url("/assets/images/12-1080.webp")}
  #scene-cacao{--layer-img:url("/assets/images/08-1080.webp")}
  #scene-underwater{--layer-img:url("/assets/images/13-900.webp")}
  #scene-sunset{--layer-img:url("/assets/images/04-720.webp")}
}
@media(max-width:999px){
  .photo-dani{--sect-img:url("/assets/images/02-720.webp")}
  .photo-ask,.photo-builder{--sect-img:url("/assets/images/03-720.webp")}
  .photo-packages,.photo-contact{--sect-img:url("/assets/images/04-720.webp")}
  .photo-reviews{--sect-img:url("/assets/images/05-760.webp")}
  .photo-stories{--sect-img:url("/assets/images/06-720.webp")}
  .photo-how{--sect-img:url("/assets/images/07-480.webp")}
  .photo-faq{--sect-img:url("/assets/images/08-720.webp")}
  .photo-book{--sect-img:url("/assets/images/01-720.webp")}
  .photo-consult{--sect-img:url("/assets/images/10-760.webp")}
}

/* --- menu na dlhej stránke (stránka má cez 20 000 px) --- */
.menu-btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;
  padding:10px 16px;font-size:.85rem;font-weight:700;background:rgba(255,255,255,.06);color:var(--bone);
  box-shadow:inset 0 0 0 1.4px var(--line-2)}
.menu-btn svg{width:15px;height:15px;fill:currentColor}
#quicknav{
  display:none;position:fixed;z-index:44;top:0;left:0;right:0;
  padding:76px 18px 20px;background:rgba(8,10,12,.97);
  border-bottom:1px solid var(--line);
  grid-template-columns:repeat(2,1fr);gap:9px;
  max-height:100vh;max-height:100svh;overflow:auto
}
#quicknav.open{display:grid}
#quicknav a{
  display:flex;align-items:center;justify-content:center;text-align:center;min-height:54px;
  border:1px solid var(--line-2);border-radius:13px;text-decoration:none;
  font-weight:700;font-size:.92rem;line-height:1.2;padding:10px 12px;background:var(--basalt)}
#quicknav a.hot{background:var(--sun);color:var(--sun-ink);border-color:var(--sun)}
@media(min-width:620px){#quicknav{grid-template-columns:repeat(3,1fr);padding-left:30px;padding-right:30px}}
@media(min-width:1200px){#quicknav{grid-template-columns:repeat(6,1fr);padding:82px 42px 22px}}
body.nav-open{overflow:hidden}

/* --- consent lišta --- */
#consent{
  position:fixed;z-index:70;left:0;right:0;bottom:0;display:none;
  background:rgba(8,10,12,.97);border-top:1px solid var(--line);
  padding:18px 0 calc(18px + env(safe-area-inset-bottom))}
#consent.show{display:block}
.consent-in{max-width:1120px;margin:0 auto;padding:0 24px;display:grid;gap:16px}
@media(min-width:900px){.consent-in{grid-template-columns:1fr auto;align-items:center}}
.consent-in p{font-size:.87rem;color:var(--bone-soft);line-height:1.5;max-width:74ch}
.consent-in p a{color:var(--bone);text-decoration:underline;text-underline-offset:3px}
.consent-actions{display:flex;flex-wrap:wrap;gap:10px}
.consent-actions .btn{min-height:46px;padding:12px 20px;font-size:.88rem}
.btn-ghost{background:none;color:var(--bone-soft);box-shadow:inset 0 0 0 1.2px var(--line)}
#consentPrefs{display:none;gap:14px;margin-top:4px;flex-direction:column}
#consentPrefs.show{display:flex}
#consentPrefs label{display:flex;gap:11px;align-items:flex-start;font-size:.87rem;color:var(--bone-soft)}
#consentPrefs input{width:20px;height:20px;accent-color:var(--sun);margin-top:2px;flex:none}
#consentPrefs b{color:var(--bone);display:block;font-size:.9rem}

/* --- validácia formulára --- */
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#E0705F}
.field .err{display:none;font-size:.78rem;color:#F09282;letter-spacing:0;text-transform:none;font-weight:600}
.field.invalid .err{display:block}
.form-status{font-size:.86rem;color:#F09282;min-height:1px}
.form-status:empty{display:none}

/* --- obrázky nikdy neposunú layout --- */
img{max-width:100%;height:auto}
.reviewshot img,.package-card img,.portrait.real img,.tcard .tripimg{background:#0e1216}

/* --- redukovaný pohyb --- */
@media (prefers-reduced-motion:reduce){
  #stage video{display:none}
  #heroCover{opacity:1!important}
  .sceneLayer{transition:none}
}

/* --- hlavička sa musí zmestiť aj na 360 px --- */
@media(max-width:560px){
  .menu-btn span{position:absolute;left:-9999px}
  .menu-btn{padding:11px 13px}
  .menu-btn svg{width:17px;height:17px}
}
@media(max-width:430px){
  .brand small{display:none}
  .hd{gap:10px}
  .langs button{padding:5px 9px;font-size:.68rem}
}
/* --- consent lišta nesmie na mobile zožrať celý hero --- */
@media(max-width:759px){
  #consent{padding:12px 0 calc(12px + env(safe-area-inset-bottom))}
  .consent-in{gap:10px;padding:0 16px}
  .consent-in p{font-size:.76rem;line-height:1.4;margin-top:3px}
  .consent-actions{gap:8px;flex-wrap:nowrap}
  .consent-actions .btn{min-height:42px;padding:10px 8px;font-size:.78rem;flex:1 1 0;min-width:0}
  .consent-actions .btn-ghost{flex:0 0 auto;padding-inline:12px}
  #consentTitle{font-size:.9rem}
  #consentPrefs label{font-size:.8rem}
}
@media(max-width:390px){.consent-actions .btn{font-size:.72rem;padding-inline:6px}}
.foot .linklike{background:none;border:0;padding:0 0 1px;color:inherit;font:inherit;
  border-bottom:1px solid var(--line-2);cursor:pointer}
.foot .linklike:hover{color:var(--bone)}

/* --- WCAG 2.2: minimálna veľkosť dotykového cieľa --- */
.date-part>label{font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;font-weight:800;color:var(--bone-soft)}
.tcard .go{display:inline-flex;align-items:center;min-height:26px;padding:3px 0}
.foot .lnk a,.foot .lnk .linklike{display:inline-flex;align-items:center;min-height:26px}
.checkline input{width:20px;height:20px}
#quicknav a,.langs button{min-height:34px;display:inline-flex;align-items:center;justify-content:center}


/* ============================================================
   V19.2 — ČITATEĽNOSŤ SERIFOVÝCH NADPISOV (mobil, tablet AJ desktop)
   ------------------------------------------------------------
   Bodoni Moda je didone — vlasové ťahy sú súčasťou jeho kresby.
   Font má ale variabilnú os "opsz" (optická veľkosť) a prehliadač
   si ju nastavuje sám podľa veľkosti písma. Veľký nadpis preto
   automaticky dostane tú najkontrastnejšiu kresbu s najtenšími
   vlasovými ťahmi. Nižšia hodnota opsz = kresba určená pre malé
   veľkosti = výrazne hrubšie tenké ťahy pri rovnakom charaktere.

   Nasadená je varianta B z testovacej stránky.

   TU SI TO LADÍŠ (platí pre celý web):
     --serif-opsz : 8 až 20. Nižšie číslo = hrubšie vlasové ťahy.
     --serif-wght : 400 až 700. Vyššie číslo = hrubšie celé písmo.

   Varianta B (nasadené):  opsz 12 / wght 620
   Ešte hrubšie (C):       opsz  9 / wght 660
   Jemnejšie (D):          opsz 18 / wght 560
   ============================================================ */
:root{
  --serif-opsz:12;
  --serif-wght:620;
}

h1,
h2.display,
.act h1,
.act h2.display,
.solid h2.plain,
.punch,
.places span,
.dani .sig,
.story h3,
.package-card h3,
.quick-package-card h3,
.trustbar b,
.how li::before{
  font-optical-sizing:none;
  font-variation-settings:"opsz" var(--serif-opsz),"wght" var(--serif-wght);
  /* poistka pre prehliadač bez podpory variabilných fontov */
  font-weight:600;
}

/* Nad videom pomôže aj tesný tieň — vlasový ťah tak nesplynie s pozadím. */
.act h1,
.act h2.display{
  text-shadow:
    0 0 2px rgba(0,0,0,.55),
    0 1px 4px rgba(0,0,0,.92),
    0 3px 36px rgba(0,0,0,.94);
}

/* Jemné obtiahnutie na tmavých fotosekciách. */
.solid h2.plain{-webkit-text-stroke:.18px currentColor}

/* Malé serify (podpis, karty, čísla) znesú ešte nižšiu optickú veľkosť. */
@media (max-width:759px){
  .dani .sig,.story h3,.package-card h3,.quick-package-card h3,.trustbar b,.how li::before,.places span{
    font-variation-settings:"opsz" 9,"wght" var(--serif-wght);
  }
}

/* ------------------------------------------------------------
   AK BY SI PREDSA LEN CHCEL INÝ FONT
   Odkomentuj blok nižšie a v index.html (aj v /cz/ a /hu/) vymeň
   v odkaze na fonts.googleapis.com reťazec
   "Bodoni+Moda:opsz,wght@6..96,400..700" za jeden z týchto:

   A) Playfair Display — rovnaká elegancia, pevnejšie vlasové ťahy
      family=Playfair+Display:wght@500;600;700
   B) Fraunces — mäkší, teplejší, veľmi dobre čitateľný cez fotku
      family=Fraunces:opsz,wght@9..144,500;9..144,600

   :root{--serif-family:"Playfair Display";}
   h1,h2.display,.act h1,.act h2.display,.solid h2.plain,.punch,.places span,
   .dani .sig,.story h3,.package-card h3,.trustbar b,.how li::before{
     font-family:var(--serif-family),Didot,Georgia,serif;
     font-variation-settings:normal;font-weight:600}
   ------------------------------------------------------------ */


/* ===== v19.3: skorý výber balíkov + varianty Saony ===== */
.quick-packages-bridge{position:relative;z-index:3;padding:78px 0 86px;background:#0a0e11;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
/* Pozadie sa načíta až tesne pred zobrazením (trieda .bg-in pridá app.js). */
.quick-packages-bridge::before{content:"";position:absolute;inset:0;z-index:-1;background-image:none;background-position:center;background-size:cover;background-repeat:no-repeat}
.quick-packages-bridge.bg-in::before{background-image:linear-gradient(180deg,rgba(6,10,12,.84),rgba(8,12,14,.96)),url("/assets/images/05-1200.webp")}
.quick-pack-head{max-width:760px;margin-bottom:30px}.quick-pack-head>p:last-child{color:var(--bone-soft);margin-top:14px}
.quick-package-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.quick-package-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:rgba(10,14,18,.92);box-shadow:0 18px 60px rgba(0,0,0,.22)}
.quick-package-card.popular{border-color:rgba(233,180,87,.72)}
.quick-package-card>img{width:100%;height:150px;object-fit:cover;display:block}
.quick-package-card>div{padding:18px;display:flex;flex-direction:column;gap:10px;height:calc(100% - 150px)}
.quick-package-card h3{font-family:"Bodoni Moda",Didot,Georgia,serif;font-size:1.55rem;line-height:1.08}
.quick-package-card p{color:var(--bone-soft);font-size:.87rem;line-height:1.45;min-height:3.7em}
.quick-package-card .btn{margin-top:auto;justify-content:center;text-align:center}
.quick-package-price{font-size:1.45rem;font-weight:800;font-variant-numeric:tabular-nums;color:var(--bone)}
.quick-pack-footer{display:flex;justify-content:center;margin-top:26px}

.saona-options{margin-top:28px}
.saona-options-head{max-width:720px;margin-bottom:16px}
.saona-options-head .eyebrow{margin-bottom:8px}.saona-options-head h3{font-size:1.18rem}
.saona-options-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.saona-option{display:grid;grid-template-columns:190px 1fr;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:rgba(9,13,16,.88);min-height:180px}
.saona-option>img{width:100%;height:100%;object-fit:cover;display:block}
.saona-option>div{padding:17px 18px;display:flex;flex-direction:column;gap:8px;justify-content:center}
.saona-option b{font-size:1rem;line-height:1.3}.saona-option p{font-size:.83rem;line-height:1.45;color:var(--bone-soft)}
.saona-option .btn.compact{align-self:flex-start;min-height:40px;padding:8px 15px;font-size:.78rem}

@media(max-width:899px){
  .quick-packages-bridge{padding:58px 0 66px}
  .quick-packages-bridge.bg-in::before{background-image:linear-gradient(180deg,rgba(6,10,12,.84),rgba(8,12,14,.96)),url("/assets/images/05-760.webp")}
  .quick-package-grid{grid-template-columns:1fr;gap:14px}
  .quick-package-card{display:grid;grid-template-columns:38% 1fr}
  .quick-package-card>img{height:100%;min-height:190px}
  .quick-package-card>div{height:auto;padding:17px}
  .quick-package-card p{min-height:0}
  .saona-options-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .quick-package-card{display:block}
  .quick-package-card>img{height:170px;min-height:0}
  .saona-option{grid-template-columns:1fr}
  .saona-option>img{height:170px}
  .saona-option .btn.compact{width:100%;justify-content:center}
}

/* ============================================================
   v20.0 — plávajúce menu, poistka proti prázdnej stránke, online hovor
   ============================================================ */

/* --- Plávajúce tlačidlo menu ------------------------------------
   Hlavička sa pri scrolle stráca, ale rozcestník má byť po ruke
   stále — rovnako ako plávajúce WhatsApp tlačidlo.
   Je vpravo hore, takže nekoliduje s WhatsApp tlačidlom dole.      */
#navfloat{
  position:fixed;z-index:46;top:14px;top:calc(14px + env(safe-area-inset-top));
  right:14px;right:calc(14px + env(safe-area-inset-right));
  width:46px;height:46px;display:none;align-items:center;justify-content:center;
  border:1px solid var(--line-2);border-radius:50%;cursor:pointer;
  background:rgba(10,13,16,.86);color:var(--bone);
  -webkit-backdrop-filter:saturate(140%) blur(9px);backdrop-filter:saturate(140%) blur(9px);
  box-shadow:0 10px 30px -14px rgba(0,0,0,.9)
}
#navfloat[hidden]{display:none}
#navfloat.show{display:inline-flex}
#navfloat svg{width:19px;height:19px;fill:currentColor}
/* kým je panel otvorený, tlačidlo prekáža — panel má vlastné zatváranie */
body.nav-open #navfloat{display:none}
@media(min-width:1200px){ #navfloat{width:50px;height:50px;top:18px;right:18px} }

/* Zatvorenie panela — panel sa dá otvoriť aj hlboko v stránke,
   kde hlavička s tlačidlom Menu nie je viditeľná. */
#navClose{
  position:absolute;top:16px;top:calc(16px + env(safe-area-inset-top));right:16px;
  width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line-2);border-radius:50%;background:var(--basalt);
  color:var(--bone);cursor:pointer
}
#navClose svg{width:18px;height:18px;fill:currentColor}
#quicknav{padding-top:76px;padding-top:calc(76px + env(safe-area-inset-top))}

/* --- Sekundárne CTA: krátky online hovor -------------------------
   Zobrazí sa iba vtedy, keď je v content.js vyplnená callBookingUrl. */
.callcta{
  margin-top:18px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r);
  background:rgba(10,14,18,.72);display:flex;flex-direction:column;gap:9px;align-items:flex-start
}
.callcta[hidden]{display:none}
.callcta .eyebrow{margin:0}
.callcta-text{color:var(--bone-soft);font-size:.9rem;line-height:1.5;margin:0}
.callcta .btn{margin-top:4px}
@media(max-width:620px){ .callcta .btn{width:100%;justify-content:center} }

/* --- Poistka: keby JavaScript zlyhal ----------------------------
   Obsah je bežne neviditeľný (.reveal{opacity:0}), kým ho JS
   nezobrazí. Keby app.js spadol — napríklad kvôli preklepu
   v content.js — ostala by prázdna stránka. Preto sa po 2,5 s
   bez potvrdenia od aplikácie všetko odkryje a dlhé cinematic
   sekcie sa zmrštia na normálne čitateľnú stránku.                */
html.app-failed .reveal{opacity:1;transform:none}
html.app-failed .act,
html.app-failed .act.journey{min-height:auto}
html.app-failed .act.journey .wrap,
html.app-failed .act .wrap{position:static;min-height:auto;padding-top:72px;padding-bottom:72px}
html.app-failed .sceneLayer,
html.app-failed #stage,
html.app-failed .scene-index{display:none}
html.app-failed #navfloat{display:none}
