/* =========================================================
   Tatra Green — style.css (podľa XD 2024, prekódované 2026)
   1 fonts · 2 tokens · 3 reset · 4 tlačidlá · 5 navbar+menu · 6 hero
   7 sekcie · 8 galéria · 9 footer · 10 responsive · 11 motion
   ========================================================= */

/* ---------- 1. Fonts ---------- */
/* Teodor (Displaay) = display serif na nadpisy. TRIAL rezy, pred nasadením nahradiť licencovanými (rovnaké názvy súborov). */
@font-face{ font-family:"Teodor"; src:url("../fonts/Teodor-VF.woff2") format("woff2"); font-weight:100 900; font-style:normal; font-display:swap; }
@font-face{ font-family:"Jost"; src:url("../fonts/jost-latin.woff2") format("woff2"); font-weight:100 900; font-style:normal; font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"Jost"; src:url("../fonts/jost-latin-ext.woff2") format("woff2"); font-weight:100 900; font-style:normal; font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

/* ---------- 2. Tokens ---------- */
:root{
  --ink:#202820;        /* tmavá zelená (text, tmavé plochy) */
  --ink-2:#4a5148;
  --sand:#cccbb0;       /* brandový akcent */
  --sand-2:#adac8f;
  --sand-bg:#d9d8c1;    /* rezervačná sekcia */
  --white:#fff;
  --line:rgba(204,203,176,.6);

  --serif:"Teodor","Georgia",serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;

  --maxw:980px; --gut:clamp(20px,4vw,40px); --nav-h:150px;
  --sec:clamp(64px,8vw,110px);
  --ease:cubic-bezier(.16,1,.3,1);

  /* Typografická škála: 6 krokov, pomer 1,25 od 18 px (viď TATRAGREEN/TYPOGRAFIA_FARBY_2026-08-28.html) */
  --t-display:clamp(2.75rem,5.2vw,4.5rem);        /* 44 → 72  hero domov */
  --t-h1:clamp(2.65rem,3.8vw,3.45rem);             /* 42 → 55  podstránky, menu */
  --t-h2:clamp(2rem,2.4vw,2.2rem);                 /* 32 → 35  sekcie, kapitoly, skóre */
  --t-lead:clamp(1.125rem,1.4vw,1.375rem);         /* 18 → 22  odsek pod h1 */
  --t-body:clamp(1.03rem,.95rem + .25vw,1.125rem); /* 16,5 → 18 */
  --t-small:.9rem;                                 /* 14,5     kontakty, sub-footer, kapitoly */
}

/* ---------- 3. Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
html,body{ overflow-x:hidden; }
body{ font-family:var(--sans); font-weight:450; color:var(--ink); background:var(--white);
  font-size:var(--t-body); line-height:1.6; -webkit-font-smoothing:antialiased;
  display:flex; flex-direction:column; min-height:100vh; }
main{ flex:1 0 auto; }
img,svg,video{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button,input{ font:inherit; color:inherit; background:none; border:0; }
button{ cursor:pointer; }
address{ font-style:normal; }
h1,h2,h3{ font-family:var(--serif); font-weight:300; line-height:1.1; letter-spacing:0; text-wrap:balance; }
/* h1 verzálky: kladný tracking (verzálky potrebujú vzduch), hero domova o krok väčšie (display) */
h1{ font-size:var(--t-h1); text-transform:uppercase; font-weight:500; letter-spacing:.02em; transform:scaleX(.85); transform-origin:center; line-height:1.05; }
.hero--home h1{ font-size:var(--t-display); letter-spacing:.015em; }
h2{ font-size:var(--t-h2); font-weight:500; letter-spacing:-.02em; transform:scaleX(.85); transform-origin:left center; }
.band h2,.pagehead h2{ transform-origin:center; }
p{ text-wrap:pretty; }
:focus-visible{ outline:2px solid var(--ink); outline-offset:3px; }
.nav :focus-visible,.menu :focus-visible,.footer :focus-visible,.hero :focus-visible,.band :focus-visible,.lb :focus-visible,.ck :focus-visible{ outline-color:var(--sand); }
.skip{ position:absolute; left:-999px; top:8px; background:var(--ink); color:var(--white); padding:8px 14px; z-index:200; }
.skip:focus{ left:8px; }
.wrap{ width:min(100% - 2*var(--gut), var(--maxw)); margin-inline:auto; }

/* Hover: opacity 50 % na logo a menu, pressed: jemné stlačenie na všetko klikateľné (instant) */
.nav__logo:hover,.footer__logo:hover,.menu__link:hover,.footer__col a:hover,.contact-list a:hover,.menu__social a:hover,.footer__social a:hover{ opacity:.5; }
/* pressed cez `scale` (samostatná vlastnosť), nekoliduje s transform:scaleX na nadpisoch a menu */
a:active,button:active{ scale:.96; }

/* Telefón a e-mail: jemné bodkované podčiarknutie, nech je jasné, že sa dá kliknúť */
a[href^="tel:"],a[href^="mailto:"],.contact-list__booking{ text-decoration:underline dotted; text-decoration-color:rgba(173,172,143,.9); text-underline-offset:4px; text-decoration-thickness:1px; }

/* ---------- 4. Tlačidlá (XD: tenký rám, uppercase, hover plná sand) ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; padding:.9em 1.5em; font-size:.9rem; letter-spacing:.03em; text-transform:uppercase;
  border:1px solid var(--sand); color:var(--ink); background:transparent; }
.btn:hover{ background:var(--sand); border-color:var(--sand); color:var(--ink); }
.btn--light{ color:var(--sand); }
.btn--light:hover{ color:var(--ink); }
.btn--dark{ border-color:var(--ink); }
.btn--dark:hover{ background:var(--ink); color:var(--sand); }

/* ---------- 5. Navbar + menu ---------- */
.nav{ position:absolute; inset:0 0 auto 0; z-index:100; height:var(--nav-h); color:var(--sand); }
body.menu-open .nav{ position:fixed; }
.nav__inner{ position:relative; z-index:2; height:100%; width:100%; padding-inline:30px; display:grid; grid-template-columns:1fr auto 1fr; align-items:start; }
/* symbol loga (pill) má stred 55px od vrchu (20px padding + 35px), burger aj tlačidlo sa naň zarovnávajú */
.nav__burger{ justify-self:start; width:48px; height:44px; position:relative; margin-top:33px; }
.nav__burger span{ position:absolute; left:4px; width:40px; height:3px; background:currentColor; transition:transform .4s var(--ease), top .4s var(--ease); }
.nav__burger span:first-child{ top:15px; } .nav__burger span:last-child{ top:26px; }
body.menu-open .nav__burger span:first-child{ top:21px; transform:rotate(45deg); }
body.menu-open .nav__burger span:last-child{ top:21px; transform:rotate(-45deg); }
.nav__logo{ display:flex; padding-top:20px; }
.nav__logo-img{ width:95px; height:131px; }
.nav__logo-mark{ display:none; }
.nav__book-short{ display:none; }
.nav__book{ justify-self:end; color:var(--sand); font-size:1.1rem; height:50px; padding-block:0; margin-top:30px; }
.nav__book:hover{ color:var(--ink); }

.menu{ position:fixed; inset:0; z-index:1; background:var(--ink); color:var(--sand); opacity:0; visibility:hidden; transition:opacity .45s var(--ease), visibility 0s .45s; overflow:auto; }
body.menu-open .menu{ opacity:1; visibility:visible; transition:opacity .45s var(--ease); }
body.menu-open{ overflow:hidden; }
/* dva symetrické stĺpce: každý polovica šírky, rovnaké vnútorné odsadenie; položky v Teodore ako nadpisy */
.menu__inner{ min-height:100%; padding:calc(var(--nav-h) + 14vh) 30px 8vh; width:100%; display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:start; }
.menu__list{ display:grid; gap:.2em; padding-inline:clamp(0px,4vw,60px); }
.menu__side{ padding-inline:clamp(0px,4vw,60px); }
.menu__link{ display:inline-block; font-family:var(--serif); font-weight:500; text-transform:uppercase; letter-spacing:.02em; transform:scaleX(.85); transform-origin:left center; font-size:var(--t-h1); line-height:1.1; }
.menu__link[aria-current]{ opacity:.5; }
.menu__side{ display:grid; gap:44px; align-content:start; }
.menu__side h2{ margin-bottom:18px; }
.menu__lang,.footer__lang{ display:flex; gap:18px; font-size:var(--t-small); letter-spacing:.06em; }
.menu__lang a,.footer__lang a{ padding:4px 0; border-bottom:1px solid transparent; }
.menu__lang a:hover,.footer__lang a:hover{ opacity:.5; }
.menu__lang a[aria-current],.footer__lang a[aria-current]{ border-bottom-color:currentColor; }
.menu__social{ display:flex; flex-wrap:wrap; gap:18px 22px; align-items:center; }
.menu__social p{ width:100%; font-size:var(--t-small); color:var(--sand-2); }
.menu__social img{ width:24px; height:24px; }

.contact-list{ display:grid; gap:12px; }
.contact-list a.contact-list__booking{ display:none; }   /* len v mobilnom menu (nahrádza blok Rezervácia cez Booking.com) */
.contact-list a,.contact-list span{ display:flex; align-items:center; gap:14px; font-size:var(--t-small); }
.contact-list img{ width:22px; height:22px; object-fit:contain; flex:none; }


/* ---------- 6. Hero (XD: nižší pás, uppercase nadpis, text pod ním) ---------- */
.hero{ position:relative; min-height:clamp(560px,82svh,900px); display:grid; place-items:center; color:var(--sand); text-align:center; isolation:isolate; overflow:hidden; }
.hero--home{ min-height:100svh; }
.hero__img{ position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; }
.hero::after{ content:""; position:absolute; inset:0; z-index:-1; background:rgba(32,40,32,.75); }
.hero__body{ padding:calc(var(--nav-h) + 24px) var(--gut) 120px; display:grid; gap:22px; justify-items:center; max-width:760px; }
.hero__body h1{ color:var(--sand); }
.hero__body p{ color:var(--sand); font-size:var(--t-lead); max-width:44ch; margin-inline:auto; line-height:1.45; }

/* Hero slideshow (domov): 3 fotky, pomalý rovnomerný zoom, ostrý strih (bez prelínania) */
.hero__slides{ position:absolute; inset:0; z-index:-2; }
.hero__slides picture{ position:absolute; inset:0; }
.hero__slides img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1); }
.hero__slides img.is-active{ opacity:1; animation:kenburns 7s linear forwards; }
@keyframes kenburns{ from{ transform:scale(1); } to{ transform:scale(1.08); } }
@media (prefers-reduced-motion:reduce){ .hero__slides img.is-active{ animation:none; } }

/* Booking skóre pod nadpisom (decentné) */
.hero__score{ display:inline-flex; align-items:center; gap:14px; color:var(--sand); opacity:0; animation:fadeIn 1s var(--ease) 1.1s forwards; }
.hero__score-num{ font-family:var(--serif); font-weight:500; font-size:var(--t-h2); line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.hero__score-num small{ font-size:.55em; font-weight:400; opacity:.8; }
.hero__score-txt{ font-size:.9rem; letter-spacing:.02em; text-align:left; border-left:1px solid rgba(204,203,176,.5); padding-left:14px; line-height:1.3; max-width:22ch; }
.hero__score:hover{ opacity:.5; }
@keyframes fadeIn{ to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .hero__score{ opacity:1; animation:none; } }

/* Chevron „scrolluj" dole v hero (jemný pomalý pohyb, reduced-motion statický) */
.hero__scroll{ position:absolute; left:50%; bottom:28px; transform:translateX(-50%); width:44px; height:44px; display:grid; place-items:center; color:var(--sand); animation:chev 2.2s var(--ease) infinite; }
.hero__scroll svg{ width:28px; height:28px; }
.hero__scroll:hover{ opacity:.5; }
.hero__scroll:active{ scale:.9; }
@keyframes chev{ 0%,100%{ transform:translate(-50%,0); } 50%{ transform:translate(-50%,8px); } }
@media (prefers-reduced-motion:reduce){ .hero__scroll{ animation:none; } }

/* ---------- 7. Sekcie ---------- */
.sec{ padding-block:var(--sec); }
.sec--sand{ background:var(--sand-bg); }
.intro{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,8vw,120px); align-items:center; }
.intro__text{ display:grid; gap:22px; justify-items:start; }
.intro__text p{ max-width:58ch; }
.intro__card{ display:grid; justify-items:center; align-content:center; gap:44px; }
.intro__card .contact-list{ gap:18px; justify-items:center; }
.intro__card .contact-list a{ justify-content:center; }
.intro__logo{ display:grid; justify-items:center; gap:8px; color:var(--sand); }
.intro__logo img{ width:95px; height:131px; }
.intro__logo b{ font-weight:400; text-transform:uppercase; text-align:center; line-height:1.05; }
.intro__logo b small{ display:block; font-size:.75rem; letter-spacing:.14em; }
.intro__logo b span{ display:block; font-size:1.15rem; letter-spacing:.06em; font-weight:500; }
.intro__card .contact-list{ justify-self:center; }

.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,80px); align-items:center; }
.split + .split{ margin-top:clamp(56px,7vw,96px); }
.split:nth-child(odd) .split__img{ order:-1; }   /* striedanie: 1. fotka vlavo, 2. vpravo */
.split__text{ display:grid; gap:22px; justify-items:start; }
.split__text p{ max-width:52ch; }
.split__img{ aspect-ratio:10/11; overflow:hidden; }
.split__img img{ width:100%; height:100%; object-fit:cover; }

.band{ position:relative; isolation:isolate; color:var(--sand); text-align:center; min-height:clamp(560px,78vh,820px); display:grid; place-items:center; overflow:hidden; }
.band__img{ position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; }
.band::after{ content:""; position:absolute; inset:0; z-index:-1; background:rgba(32,40,32,.75); }
.band__body{ padding:96px var(--gut); display:grid; gap:28px; justify-items:center; max-width:620px; }
.band__body h2{ color:var(--sand); }
.band__body p{ color:var(--sand); margin-inline:auto; }

.book{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,80px); align-items:start; }
.book__col{ display:grid; gap:22px; justify-items:start; }
.book__col h2{ margin-bottom:2px; }

.pagehead{ padding:calc(var(--nav-h) + var(--sec)) 0 clamp(32px,5vw,56px); text-align:center; }
/* Stránky bez hera (svetlý podklad): navbar v ink, inak sand na bielej 1,65 : 1 */
body:has(.pagehead) .nav,body:has(.notfound) .nav{ color:var(--ink); }
body:has(.pagehead) .nav__book,body:has(.notfound) .nav__book{ color:var(--ink); border-color:var(--ink); }
body:has(.pagehead) .nav__book:hover{ background:var(--ink); color:var(--sand); }
.nav__logo-img--ink{ display:none; }
@media (min-width:601px){
  body:has(.pagehead) .nav__logo-img--ink,body:has(.notfound) .nav__logo-img--ink{ display:block; }
  body:has(.pagehead) .nav__logo-img--sand,body:has(.notfound) .nav__logo-img--sand{ display:none; }
  body.menu-open .nav__logo-img--ink{ display:none; }
  body.menu-open .nav__logo-img--sand{ display:block; }
}
body.menu-open .nav{ color:var(--sand) !important; }
/* Hlavička galérie na desktope: vľavo h1, vpravo popis + kapitoly (menej scrollovania) */
.pagehead--split .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,80px); align-items:center; text-align:left; }
.pagehead--split h1{ transform-origin:left center; }
.pagehead--split p{ margin:0; }
.pagehead--split .tour-nav{ justify-content:flex-start; margin-top:24px; }
/* Právny dokument (OOÚ): vľavo lepkavý obsah, vpravo text; tabuľky s tenkými linkami */
.legal{ display:grid; grid-template-columns:220px 1fr; gap:clamp(40px,6vw,80px); align-items:start; padding-bottom:var(--sec); }
.legal__nav{ position:sticky; top:40px; display:grid; gap:10px; font-size:var(--t-small); }
.legal__nav a{ padding:2px 0; }
.legal__nav a:hover{ opacity:.5; }
.legal__meta{ font-size:var(--t-small) !important; color:var(--ink-2); margin-top:12px !important; }
.legal__body{ max-width:none; }
.legal__body h2{ margin-top:1.4em; scroll-margin-top:calc(var(--nav-h) + 20px); }
.legal__body h2:first-of-type{ margin-top:.6em; }
.legal__body ul{ list-style:none; display:grid; gap:8px; padding-left:0; }
.legal__body li{ padding-left:22px; position:relative; }
.legal__body li::before{ content:""; position:absolute; left:0; top:.7em; width:10px; height:1px; background:var(--sand-2); }
.legal__body a:not(.btn){ text-decoration:underline dotted; text-decoration-color:rgba(173,172,143,.9); text-underline-offset:4px; }
.tbl-wrap{ overflow-x:auto; }
.tbl{ width:100%; border-collapse:collapse; font-size:var(--t-small); line-height:1.5; }
.tbl th{ text-align:left; font-weight:500; padding:0 14px 10px 0; border-bottom:1px solid var(--ink); vertical-align:bottom; }
.tbl td{ padding:12px 14px 12px 0; border-bottom:1px solid var(--line); vertical-align:top; min-width:140px; }
.tbl td:first-child{ font-weight:500; }
@media (max-width:900px){
  .legal{ grid-template-columns:1fr; gap:32px; }
  .legal__nav{ position:static; grid-template-columns:1fr 1fr; gap:8px 20px; }
}
@media (max-width:600px){
  .legal__nav{ grid-template-columns:1fr; }
  /* tabuľky ako karty: riadok = blok, bunka = popis stĺpca + hodnota */
  .tbl thead{ display:none; }
  .tbl,.tbl tbody,.tbl tr,.tbl td{ display:block; }
  .tbl tr{ padding:14px 0; border-bottom:1px solid var(--ink); }
  .tbl td{ padding:4px 0; border:0; min-width:0; }
  .tbl td::before{ content:attr(data-label); display:block; font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--sand-2); margin-bottom:2px; }
  .tbl td:first-child{ padding-top:0; }
}

/* Galéria na sand podklade (skúška 28.8.) */
body:has(.tour),body:has(.legal){ background:var(--sand-bg); }
body:has(.tour) .sec--sand,body:has(.legal) .sec--sand{ background:var(--sand); }
body:has(.tour) .tour-nav a{ border-color:var(--ink); }
body:has(.tour) .tour-nav a:hover{ background:var(--ink); color:var(--sand); }
body:has(.tour) .collage a{ background:var(--sand-2); }
.pagehead h1{ text-transform:uppercase; }
.pagehead p{ margin:16px auto 0; max-width:44ch; font-size:var(--t-lead); line-height:1.45; }
.prose{ max-width:70ch; display:grid; gap:1.2em; margin-inline:auto; }
.prose h2{ margin-top:1.2em; }

/* ---------- 8. Prehliadka chaty (kapitoly po priestoroch, editoriálna koláž, <dialog> lightbox) ---------- */
.tour-nav{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:32px; }
.tour-nav a{ display:inline-flex; align-items:center; padding:.7em 1.2em; font-size:var(--t-small); letter-spacing:.03em; text-transform:uppercase; border:1px solid var(--sand); white-space:nowrap; }
.tour-nav a:hover{ background:var(--sand); }
.tour{ padding-block:clamp(24px,4vw,48px) var(--sec); display:grid; gap:clamp(96px,12vw,160px); }
.chapter{ scroll-margin-top:clamp(24px,6vh,60px); display:grid; gap:clamp(32px,4vw,48px); }
.chapter__head{ display:grid; gap:16px; justify-items:start; }
.chapter__head p{ max-width:52ch; }
/* riadky: fotky v riadku majú rovnakú výšku (šírka podľa pomeru strán --ar), medzera vždy 30 px; riadok môže byť užší a odsadený (--w, --off) */
.collage{ width:min(100% - 2*var(--gut), 1200px); margin-inline:auto; display:grid; gap:30px; }
.collage .row{ display:flex; gap:30px; width:var(--w,100%); margin-left:var(--off,0); }
.collage figure{ flex:var(--ar,1.5) 1 0; min-width:0; margin:0; }
.collage a{ display:block; overflow:hidden; background:var(--sand-bg); }
.collage img{ width:100%; height:auto; transition:transform 1.2s var(--ease); }
.collage a:hover img{ transform:scale(1.02); }

/* Lightbox: natívny <dialog>, pás fotiek so scroll-snap (swipe bez JS animácií), počítadlo + názov priestoru */
.lb{ border:0; padding:0; max-width:none; max-height:none; width:100vw; height:100dvh; background:rgba(32,40,32,.94); color:var(--sand); overflow:hidden; }
.lb::backdrop{ background:rgba(32,40,32,.4); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.lb[open]{ display:grid; grid-template-rows:minmax(0,1fr) auto; }
body.lb-open{ overflow:hidden; }
.lb__track{ display:flex; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; height:100%; }
.lb__track::-webkit-scrollbar{ display:none; }
.lb__slide{ flex:0 0 100%; width:100%; height:100%; min-height:0; scroll-snap-align:center; scroll-snap-stop:always; display:flex; align-items:center; justify-content:center; padding:64px clamp(16px,6vw,96px) 16px; box-sizing:border-box; }
/* celá fotka vždy viditeľná (aj na výšku): výška ohraničená viewportom mínus horný a dolný pás */
.lb__slide img{ max-width:100%; max-height:calc(100dvh - 64px - 16px - 60px); width:auto; height:auto; object-fit:contain; }
.lb__bar{ display:flex; justify-content:center; align-items:baseline; gap:14px; padding:14px 16px 22px; font-size:.9rem; color:var(--sand-2); }
.lb__count{ font-variant-numeric:tabular-nums; color:var(--sand); }
.lb button{ position:absolute; color:var(--sand); width:56px; height:56px; display:grid; place-items:center; font-size:2.4rem; line-height:1; font-weight:300; z-index:2; }
.lb button:hover{ opacity:.5; }
.lb__close{ top:12px; right:12px; }
.lb__prev{ left:8px; top:50%; transform:translateY(-50%); }
.lb__next{ right:8px; top:50%; transform:translateY(-50%); }
.lb button:active{ scale:.9; }
@media (max-width:600px){
  .lb__prev,.lb__next{ display:none; }
  .lb__slide{ padding:64px 0 8px; }
}

/* ---------- 9. Footer (logo, vľavo linky + adresa, vpravo newsletter; sekundárny pás) ---------- */
.footer{ background:var(--ink); color:var(--sand); }
.footer__inner{ width:100%; padding:clamp(56px,7vw,96px) 30px clamp(48px,6vw,80px); display:grid; gap:56px; }
.footer__logo{ width:43px; justify-self:center; }
.footer__cols{ display:grid; grid-template-columns:auto minmax(280px,380px); justify-content:space-between; gap:clamp(40px,6vw,96px); align-items:start; }
.footer__left{ display:grid; grid-template-columns:auto auto auto; justify-content:start; gap:clamp(40px,6vw,96px); }
.footer__col{ display:block; line-height:1.5; }
.footer__col a{ display:block; }
.footer__social-txt{ margin-top:16px; }
.footer__social{ display:flex; gap:14px; margin-top:10px; }
.footer__social img{ width:22px; height:22px; }
.news{ display:grid; gap:20px; justify-self:end; width:100%; max-width:380px; }
.news p{ max-width:34ch; }
.news form{ display:flex; align-items:center; gap:16px; border-bottom:1px solid var(--sand); padding-bottom:10px; }
.news input{ flex:1; min-width:0; font:inherit; color:var(--sand); padding:4px 0; }
.news input::placeholder{ color:var(--sand); opacity:.9; }
.news button img{ width:32px; }
/* Newsletter stavy: hover linka + šípka, focus (aktívny input) plná linka, pressed šípka */
.news form:hover{ border-bottom-color:rgba(204,203,176,.5); }
.news form:focus-within{ border-bottom-color:var(--sand); }
.news form:focus-within input::placeholder{ opacity:.4; }
.news input:focus-visible{ outline:none; }
.news button{ display:grid; place-items:center; width:44px; height:36px; }
.news button:hover{ opacity:.5; }
.news button:active{ opacity:1; scale:.9; }
.footer__sub{ }
.footer__sub-inner{ width:100%; padding:22px 30px 30px; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 32px; font-size:var(--t-small); color:var(--sand-2); }
.footer__legal{ display:flex; flex-wrap:wrap; gap:8px 24px; }
.footer__sub-inner .footer__lang{ order:2; }
.footer__credit{ order:3; }
.footer__legal a:hover{ opacity:.5; }
.footer__credit{ display:inline-flex; align-items:center; gap:8px; }
.footer__credit-logo{ width:16px; height:20px; color:var(--sand); }
.footer__credit{ color:var(--sand); }
.footer__credit:hover{ opacity:.5; }

/* 404 */
.notfound{ min-height:100svh; display:grid; place-items:center; text-align:center; padding:var(--nav-h) var(--gut); }
.notfound div{ display:grid; gap:24px; justify-items:center; }

/* ---------- 10. Responsive ---------- */
@media (max-width:900px){
  .intro,.split,.book{ grid-template-columns:1fr; }
  .split__img{ aspect-ratio:auto; }
  .split:nth-child(odd) .split__img{ order:0; }
  .footer__cols{ grid-template-columns:1fr; gap:40px; }
  .footer__left{ grid-template-columns:1fr 1fr; }
  .news{ justify-self:start; }
  .menu__inner{ grid-template-columns:1fr; gap:64px; padding-top:calc(var(--nav-h) + 6vh); padding-bottom:10vh; }
  .menu__list,.menu__side{ padding-inline:0; }
  .menu__side h2{ transform-origin:left center; }
}
@media (max-width:600px){
  h2{ transform-origin:center; }
  .hero__score{ flex-direction:column; gap:10px; }
  .hero__score-txt{ border-left:0; padding-left:0; text-align:center; max-width:26ch; }
  .intro,.split{ gap:48px; }
  .intro__text,.split__text{ text-align:center; justify-items:center; }
  .intro__text p,.split__text p{ margin-inline:auto; }
  .intro__card{ justify-items:center; padding-top:16px; }
  .split + .split{ margin-top:120px; }
  .intro{ margin-bottom:40px; }
  .book{ gap:48px; } .book__col{ justify-items:center; text-align:center; }
  .footer__cols,.footer__left{ justify-items:center; text-align:center; }
  .footer__left{ grid-template-columns:1fr; gap:32px; }
  .footer__social{ justify-content:center; }
  .news{ justify-self:center; text-align:center; } .news p{ margin-inline:auto; }
  .footer__sub-inner{ flex-direction:column; align-items:center; text-align:center; gap:18px; }
  .footer__legal{ justify-content:center; gap:10px 18px; }
  .footer__legal span{ flex-basis:100%; margin-bottom:6px; }
  .footer__lang{ justify-content:center; }
  :root{ --nav-h:96px; --gut:15px; }
  .nav__logo{ padding-top:20px; }
  .nav__burger{ margin-top:28px; height:44px; }
  .nav__book{ padding:0 10px; font-size:1rem; line-height:1; }
  /* mobil: symbol loga vľavo, burger vpravo, navbar fixný a priehľadný; farba sa mení podľa podkladu (main.js) */
  .nav{ position:fixed; transition:color .8s var(--ease); }
  .nav__burger span{ transition:transform .4s var(--ease), top .4s var(--ease), background-color .8s var(--ease); }
  .nav__logo-mark{ transition:color .8s var(--ease); }
  .nav--onlight{ color:var(--sand-2); }
  .nav__inner{ grid-template-columns:auto 1fr; padding-inline:15px; }
  .nav__burger{ order:2; justify-self:end; }
  .nav__logo{ order:1; justify-self:start; }
  .nav__book{ display:none; }
  .menu__inner{ padding:calc(var(--nav-h) + 40px) 15px 60px; gap:56px; }
  .menu__side{ gap:40px; }
  .menu__booking{ display:none; }
  .menu .contact-list a.contact-list__booking{ display:flex; }
  .footer__inner{ padding-inline:15px; }
  .footer__sub-inner{ padding-inline:15px; }
  .nav__book-full{ display:none; } .nav__book-short{ display:inline; }
  .nav__logo-img{ display:none; }
  /* mobil: farbu navbaru riadi navTone (podľa podkladu), nie typ stránky */
  body:has(.pagehead) .nav,body:has(.notfound) .nav{ color:var(--sand); }
  body:has(.pagehead) .nav.nav--onlight,body:has(.notfound) .nav.nav--onlight,.nav--onlight{ color:var(--ink-2); }
  .nav__logo-mark{ display:block; width:40px; height:60px; }
  .hero,.hero--home{ min-height:100svh; }
  .hero__body{ gap:18px; }
  .hero--home h1{ font-size:clamp(2.75rem,11vw,3.2rem); }
  .footer__inner{ gap:44px; }
  .footer__left{ grid-template-columns:1fr; gap:28px; }
  /* prehliadka na mobile: jeden stĺpec, striedanie šírok 100 % / 85 % vľavo a vpravo */
  /* mobil: jeden posúvateľný riadok tlačidiel cez celú šírku, bez lámania */
  .pagehead--split .wrap{ display:block; text-align:center; }
  .pagehead--split h1{ transform-origin:center; }
  .pagehead--split p{ margin:16px auto 0; }
  .tour-nav{ flex-wrap:nowrap; justify-content:flex-start; gap:8px; margin-inline:calc(-1*var(--gut)); padding-inline:var(--gut); overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; scroll-padding-inline:var(--gut); }
  .tour-nav::-webkit-scrollbar{ display:none; }
  .tour-nav a{ flex:none; scroll-snap-align:start; }
  .chapter__head{ justify-items:center; text-align:center; }
  .chapter__head p{ margin-inline:auto; }
  .collage{ gap:20px; }
  .collage .row{ display:contents; }
  .collage figure{ width:100%; }
  .collage .row:nth-child(even) figure:first-child{ width:85%; margin-left:auto; }
  .collage .row:nth-child(odd) figure:nth-child(2){ width:85%; }
}

/* ---------- 11. Cookie lišta (vlastná, ink karta vľavo dole) ---------- */
.ck{ position:fixed; left:30px; bottom:30px; z-index:150; width:min(440px, 100% - 60px); }
.ck[hidden]{ display:none; }
/* jemne rozmazané a pritmavené pozadie za lištou (neblokuje klikanie), karta s tenkou linkou, nech nesplýva s tmavými plochami */
.ck-backdrop{ position:fixed; inset:0; z-index:149; background:rgba(32,40,32,.35); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); pointer-events:none; transition:opacity .4s var(--ease); }
.ck-backdrop[hidden]{ display:none; }
.ck__box{ background:var(--ink); color:var(--sand); padding:30px 30px 26px; display:grid; gap:18px; border:1px solid rgba(204,203,176,.28); }
.ck__title{ font-family:var(--serif); font-weight:500; font-size:1.6rem; letter-spacing:-.01em; line-height:1.1; transform:none; }
.ck__text,.ck__desc{ font-size:var(--t-small); line-height:1.55; color:var(--sand); }
.ck__desc{ color:var(--sand-2); margin-top:6px; }
.ck__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 20px; margin-top:6px; }
.ck .btn{ font-size:.8rem; padding:.8em 1.2em; }
.ck__link{ font-size:var(--t-small); text-decoration:underline dotted; text-decoration-color:rgba(173,172,143,.9); text-underline-offset:4px; color:var(--sand); }
.ck__link:hover{ opacity:.5; }
.ck__foot{ font-size:.8rem; color:var(--sand-2); }
.ck__foot a{ text-decoration:underline dotted; text-underline-offset:4px; }
.ck__foot a:hover{ opacity:.5; }
.ck__list{ display:grid; border-top:1px solid rgba(204,203,176,.2); }
.ck__row{ display:grid; grid-template-columns:1fr auto; gap:0 20px; align-items:start; padding:16px 0; border-bottom:1px solid rgba(204,203,176,.12); }
.ck__row:last-child{ border-bottom:0; }
.ck__label{ font-weight:500; cursor:pointer; line-height:24px; }
.ck__always{ font-size:.72rem; color:var(--sand-2); letter-spacing:.06em; text-transform:uppercase; line-height:24px; }
.ck__switch{ position:absolute; opacity:0; width:1px; height:1px; }
.ck__toggle{ display:block; width:42px; height:24px; border:1px solid var(--sand); border-radius:999px; position:relative; cursor:pointer; transition:background .25s var(--ease); }
.ck__toggle::after{ content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:var(--sand); transition:transform .25s var(--ease); }
.ck__switch:checked + .ck__toggle{ background:var(--sand); }
.ck__switch:checked + .ck__toggle::after{ background:var(--ink); transform:translateX(18px); }
.ck__switch:disabled + .ck__toggle{ opacity:.5; cursor:default; }
.ck__switch:focus-visible + .ck__toggle{ outline:2px solid var(--sand); outline-offset:3px; }
@media (max-width:600px){
  .ck{ left:15px; right:15px; bottom:15px; width:auto; }
  .ck__box{ padding:22px 20px 18px; }
  .ck .btn{ flex:1 1 auto; justify-content:center; }
}

/* ---------- 11b. DEMO rezervácia (pages/demo-rezervacia.html) ---------- */
/* interné označenia ukážky: zámerne mimo dizajnu webu (žltý pás, prerušované rámiky), nech je jasné, čo nie je súčasť návrhu */
.demo-bar{ position:fixed; left:0; right:0; bottom:0; z-index:140; background:#f3d34a; color:#1a1a1a; font:500 13px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; padding:10px 30px; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; border-top:2px dashed #1a1a1a; }
body:has(.demo-bar) .ck{ bottom:72px; }
.demo-bar b{ text-transform:uppercase; letter-spacing:.08em; font-weight:700; }
.demo-tag{ display:inline-block; font:600 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#1a1a1a; background:#f3d34a; border:1px dashed #1a1a1a; padding:3px 6px; margin-left:6px; vertical-align:middle; }
.demo-note{ font:13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#1a1a1a; background:#f3d34a; border:1px dashed #1a1a1a; padding:10px 12px; text-align:left; max-width:44ch; }
body:has(.demo-bar) .nav{ top:0; }
@media (max-width:600px){ .demo-bar{ padding:8px 15px; font-size:12px; } }
.booking{ display:grid; grid-template-columns:1.25fr .9fr; gap:clamp(40px,6vw,80px); align-items:start; padding-bottom:var(--sec); }
.booking__chalets{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-bottom:24px; }
.chip input{ position:absolute; opacity:0; width:1px; height:1px; }
.chip span{ display:inline-flex; padding:.7em 1.2em; border:1px solid var(--ink); font-size:var(--t-small); letter-spacing:.03em; text-transform:uppercase; cursor:pointer; }
.chip input:checked + span{ background:var(--ink); color:var(--sand); }
.chip input:focus-visible + span{ outline:2px solid var(--ink); outline-offset:3px; }
.booking__sync{ margin-left:auto; font-size:.8rem; color:var(--ink-2); display:inline-flex; align-items:center; gap:8px; }
.booking__sync i{ width:8px; height:8px; border-radius:50%; background:#5a8a5a; box-shadow:0 0 0 3px rgba(90,138,90,.2); }
.cal{ display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.cal__month h3{ font-family:var(--serif); font-weight:500; font-size:1.35rem; margin-bottom:14px; text-transform:capitalize; }
.cal__grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.cal__dow{ font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--sand-2); text-align:center; padding-bottom:6px; }
.cal__day{ aspect-ratio:1; display:grid; place-items:center; font-size:.95rem; border:1px solid transparent; font-variant-numeric:tabular-nums; }
.cal__day:hover:not(:disabled){ border-color:var(--ink); }
.cal__day.is-past{ color:rgba(32,40,32,.3); cursor:default; }
.cal__day.is-busy{ color:rgba(32,40,32,.35); background:repeating-linear-gradient(135deg, transparent 0 4px, rgba(173,172,143,.35) 4px 5px); cursor:not-allowed; }
.cal__day.is-in{ background:var(--sand-bg); }
.cal__day.is-start,.cal__day.is-end{ background:var(--ink); color:var(--sand); }
.cal__legend{ display:flex; gap:22px; margin-top:20px; font-size:var(--t-small); color:var(--ink-2); }
.cal__legend span{ display:inline-flex; align-items:center; gap:8px; }
.lg{ width:16px; height:16px; border:1px solid var(--sand-2); display:inline-block; }
.lg--busy{ background:repeating-linear-gradient(135deg, transparent 0 3px, rgba(173,172,143,.5) 3px 4px); }
.lg--sel{ background:var(--ink); border-color:var(--ink); }
.booking__sum{ background:var(--sand-bg); padding:32px 30px; display:grid; gap:22px; position:sticky; top:30px; }
.booking__sum h2{ transform-origin:left center; }
.sum{ display:grid; gap:10px; }
.sum div{ display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid rgba(32,40,32,.12); padding-bottom:10px; }
.sum dt{ color:var(--ink-2); font-size:var(--t-small); }
.sum dd{ font-weight:500; text-align:right; }
.stepper{ display:inline-flex; align-items:center; gap:14px; }
.stepper button{ width:30px; height:30px; border:1px solid var(--ink); display:grid; place-items:center; font-size:1.1rem; line-height:1; }
.stepper button:hover{ background:var(--ink); color:var(--sand); }
.stepper output{ min-width:1.5ch; text-align:center; font-variant-numeric:tabular-nums; }
.sum__price{ display:grid; gap:8px; }
.sum__price div{ display:flex; justify-content:space-between; font-size:var(--t-small); color:var(--ink-2); }
.sum__price b{ color:var(--ink); font-weight:500; }
.sum__total{ border-top:1px solid var(--ink); padding-top:10px; margin-top:4px; font-size:1rem !important; }
.sum__total b{ font-family:var(--serif); font-size:1.7rem; letter-spacing:-.01em; }
.sum__save{ font-size:var(--t-small); color:var(--ink-2); border-left:2px solid var(--ink); padding-left:12px; }
.sum__save b{ color:var(--ink); }
#bookForm{ display:grid; gap:14px; }
#bookForm label{ display:grid; gap:6px; font-size:var(--t-small); color:var(--ink-2); }
#bookForm input{ border-bottom:1px solid var(--ink); padding:8px 0; font-size:1rem; color:var(--ink); background:transparent; }
#bookForm input:focus-visible{ outline:none; border-bottom-width:2px; }
#bookForm .btn{ justify-self:start; margin-top:6px; }
#bookForm .btn:disabled{ opacity:.4; cursor:not-allowed; }
#bookForm small{ font-size:.8rem; color:var(--ink-2); }
.booking__how{ padding-bottom:var(--sec); }
.booking__how h2{ margin-bottom:28px; }
.how{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.how b{ font-family:var(--serif); font-weight:500; font-size:2rem; display:block; margin-bottom:10px; color:var(--sand-2); }
.how p{ max-width:36ch; }
@media (max-width:900px){
  .booking{ grid-template-columns:1fr; }
  .booking__sum{ position:static; }
  .cal{ grid-template-columns:1fr; }
  .how{ grid-template-columns:1fr; }
  .booking__sync{ margin-left:0; width:100%; }
}

/* ---------- 12. Newsletter popup + potvrdzovacie stránky ---------- */
.news-dialog{ margin:auto; border:0; padding:0; background:var(--ink); color:var(--sand); width:min(520px, 100% - 30px); max-width:none; }
.news-dialog::backdrop{ background:rgba(32,40,32,.45); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.news-dialog{ border:1px solid rgba(204,203,176,.28); }
.news-dialog__body{ padding:clamp(36px,5vw,56px) clamp(28px,5vw,56px); display:grid; gap:18px; justify-items:center; text-align:center; }
.news-dialog h2{ color:var(--sand); transform:none; text-wrap:balance; }
.news-dialog p{ max-width:40ch; line-height:1.6; }
.news-dialog .btn{ margin-top:8px; }
.news-dialog__close{ position:absolute; top:10px; right:10px; width:48px; height:48px; display:grid; place-items:center; font-size:2rem; font-weight:300; color:var(--sand); }
.news-dialog__close:hover{ opacity:.5; }
.news form.is-busy{ opacity:.5; pointer-events:none; }
.news-page__lead{ max-width:48ch; margin-inline:auto; }
.news-page__note{ max-width:48ch; margin-inline:auto; font-size:var(--t-small); color:var(--ink-2); }

/* ---------- 13. Motion ---------- */
/* Hero nadpis: slová sa vysunú zospodu (clip reveal), stagger cez --i, spustí main.js po načítaní fontov */
.js .words .w{ display:inline-block; overflow:hidden; vertical-align:top; padding:0 .06em .06em 0; margin:0 -.06em -.06em 0; }
.js .words .w-in{ display:inline-block; transform:translateY(115%); }
.js .words.in .w-in{ animation:wordUp 1s var(--ease) forwards; animation-delay:calc(200ms + var(--i) * 110ms); }
@keyframes wordUp{ to{ transform:translateY(0); } }
.js .reveal{ opacity:0; transform:translateY(16px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.js .reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition:none !important; animation:none !important; }
  html{ scroll-behavior:auto; }
  .js .reveal{ opacity:1; transform:none; }
  .js .words .w-in{ transform:none; animation:none; }
}