/* Essens: rozmery sú v % šírky okna (vw), rovnako ako na Wixe */
:root{--papier:#e7e7e2;--text:#3a3d39;--nadpis:#14382c;--zelena:#345440;--linka:#4a4a4a;--panel:#d6d6d4;--menu:#47584d;--pismo:max(15px,1.2vw)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papier);color:var(--text);font:300 var(--pismo)/1.53 "Helvetica Neue",Helvetica,Arial,sans-serif;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-2;background:var(--papier) center/cover no-repeat}
.bg-uvod::before{background-image:url(images/bg-uvod.png)}
.bg-terapie::before{background-image:url(images/bg-terapie.png)}
.bg-o-mne::before{background-image:url(images/bg-o-mne.png)}
.bg-cennik::before{background-image:url(images/bg-cennik.png)}
.znak{position:fixed;right:-1.5vw;bottom:-3vw;z-index:-1;height:35vw;width:auto;max-width:none}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:focus-visible{outline:2px solid var(--zelena);outline-offset:3px}
hr{border:0;border-top:1px solid var(--linka);margin:3vw 0}
h1,h2{color:var(--nadpis);font-weight:400;line-height:1.25}
h1{font-size:1.67vw;text-transform:uppercase;margin:0 0 1.9vw}
.meno{text-transform:none}
.kontakt .meno{text-transform:uppercase;color:var(--text)}
p{margin:0 0 1.4vw}
/* hlavička */
.hlavicka{position:absolute;z-index:3;top:0;left:0;right:0}
.logo{position:absolute;left:12vw;top:4.6vw;display:block}
.logo img{width:24.9vw}
.otvor{position:absolute;right:13.2vw;top:6.8vw;cursor:pointer;display:block}
.otvor img{width:3.4vw}
/* menu */
.prepinac{position:fixed;top:40px;right:20px;width:60px;height:50px;opacity:0;z-index:1;margin:0;pointer-events:none}
.prepinac:focus-visible~.hlavicka .otvor{outline:2px solid var(--zelena)}
.clona{position:fixed;inset:0;z-index:4;display:none}
.prepinac:checked~.clona{display:block}
.panel{position:fixed;top:0;right:0;bottom:0;z-index:5;width:min(92vw,max(320px,26.5vw));padding:max(70px,7vw) 2vw 2vw max(16px,.9vw);background:var(--panel);overflow-y:auto;transform:translateX(100%);visibility:hidden;transition:transform .5s cubic-bezier(.22,.8,.3,1),visibility 0s linear .5s}
.prepinac:checked~.panel{transform:none;visibility:visible;transition:transform .5s cubic-bezier(.22,.8,.3,1),visibility 0s}
.zavri{position:absolute;top:max(14px,2.3vw);right:max(14px,2.6vw);width:max(26px,1.45vw);height:max(26px,1.45vw);font-size:0;cursor:pointer}
.zavri::before,.zavri::after{content:"";position:absolute;left:-14%;right:-14%;top:calc(50% - 1px);height:2px;background:#1f4d30}
.zavri::before{transform:rotate(45deg)}.zavri::after{transform:rotate(-45deg)}
.panel ul{list-style:none;margin:0;padding:0}
.panel a{text-decoration:none;display:flex;align-items:center;position:relative}
.panel a:hover{color:var(--nadpis);text-decoration:underline}
.hlavna a{font-size:max(19px,1.5vw);text-transform:uppercase;color:var(--menu);min-height:max(48px,4.35vw);padding-left:max(44px,2.55vw)}
.pod{padding:max(2px,.3vw) 0 max(14px,1.7vw) max(84px,6.85vw)!important}
.pod a{font-size:max(13px,.82vw);font-weight:400;text-transform:uppercase;color:var(--menu);min-height:max(42px,3.2vw);gap:max(12px,.8vw)}
.m-ikona{width:max(26px,2.3vw);height:max(26px,2.3vw);object-fit:contain}
.sipka{position:absolute;left:0;top:50%;transform:translateY(-50%);width:max(26px,1.65vw)}
.pod .sipka{left:max(-40px,-2.6vw)}
/* úvod */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.uvod{padding:20.2vw 0 6vw}
.citat{width:48.2vw;margin-left:26.4vw}
.uvod hr{width:69vw;margin:11.9vw 0 8vw 15.5vw}
.uvod h1{font-size:2.13vw;margin:0 0 0 24.2vw}
.blok{position:relative;display:flex;align-items:center;min-height:var(--v)}
.b-obr{display:block;position:absolute;top:0}
.blok:nth-of-type(2){--v:38.7vw}
.blok:nth-of-type(3){--v:34.6vw}
.blok:nth-of-type(4){--v:34.6vw}
.b-text h2{font-size:1.35vw;margin:0 0 1vw}
.b-text ul{padding-left:1.2em;margin:0}
.b-text li{margin-bottom:.7vw}
.vlavo .b-obr{left:0}
.vpravo .b-obr{right:0}
.blok:nth-of-type(2) .b-obr{width:58vw}
.blok:nth-of-type(3) .b-obr{width:55.4vw}
.blok:nth-of-type(4) .b-obr{width:54.4vw}
.b-text{position:relative;width:21vw;padding:1.2vw 0}
.vlavo .b-text{margin-left:60.5vw;width:28vw}
.vpravo .b-text{margin-left:25vw}
/* animácie: zapína ich essens.js, bez neho je všetko viditeľné */
main{overflow-x:hidden;overflow-x:clip}
.anim .blok .b-obr,.anim .blok .b-text>*{transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .8s ease-out,filter .8s ease-out}
.anim .blok:not(.vidno) .b-obr{opacity:0;filter:blur(10px)}
.anim .vlavo:not(.vidno) .b-obr{transform:translateX(-85%)}
.anim .vpravo:not(.vidno) .b-obr{transform:translateX(85%)}
.anim .blok:not(.vidno) .b-text>*{opacity:0;filter:blur(8px)}
.anim .vlavo:not(.vidno) .b-text>*{transform:translateX(12vw)}
.anim .vpravo:not(.vidno) .b-text>*{transform:translateX(-12vw)}
.anim .blok .zoznam{transform:none!important;opacity:1!important;filter:none!important}
.anim .zoznam li img,.anim .zoznam li span{transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .8s ease-out,filter .8s ease-out;transition-delay:calc(.25s + var(--i)*.14s)}
.zoznam li:nth-child(1){--i:0}.zoznam li:nth-child(2){--i:1}.zoznam li:nth-child(3){--i:2}.zoznam li:nth-child(4){--i:3}.zoznam li:nth-child(5){--i:4}
.anim .blok:not(.vidno) .zoznam li img{opacity:0}
.anim .blok:not(.vidno) .zoznam li span{opacity:0;filter:blur(6px);transform:translateX(14vw)}
.anim .stlpec>h1,.anim .stlpec>h2,.anim .stlpec>p{animation:rozmaz 1.1s ease-out .25s both}
@keyframes rozmaz{from{opacity:0;filter:blur(8px)}}
.zoznam{list-style:none;margin:.9vw 0 0;padding:0!important}
.b-text .zoznam li{margin:0}
.zoznam a{display:flex;align-items:center;gap:1.4vw;min-height:3.2vw;text-decoration:none}
.zoznam a:hover span{text-decoration:underline}
.zoznam img{width:2.2vw;height:2.2vw;object-fit:contain}
.zoznam span{display:inline-block;font-weight:400}
/* služby */
.siroka{width:69vw;margin:5vw 0 8.2vw 15.5vw}
.sluzby{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:4.2vw 3.3vw;width:50vw;margin:0 auto;padding:0 0 8vw;text-align:center}
.sluzby li{width:13.8vw}
.sluzby a{text-decoration:none;display:block}
.sluzby a:hover h2{text-decoration:underline}
.s-ikona{height:3.3vw;width:auto;margin:0 auto 1.4vw}
.sluzby h2{font-size:1.45vw;line-height:1.25;letter-spacing:-.02em;text-transform:uppercase;margin:0 0 2.3vw}
.sluzby li:nth-child(-n+3) h2{min-height:2.5em}
.sluzby p{font-size:max(14px,1.06vw);line-height:1.42;margin:0}
/* podstránky */
.stlpec{width:49.1vw;margin:0 auto;padding:16vw 0 6vw;text-align:center}
.foto{width:100%;margin:2.5vw auto 0}
.ako-h1{font-size:1.67vw;text-transform:uppercase;margin:0 0 1.9vw;scroll-margin-top:2vw}
.stlpec hr{margin:4.5vw 0}
.cennik{min-height:70vh}
.cennik p{font-size:max(16px,1.3vw)}
.kontakt a{text-decoration:none}
.kontakt a:hover{text-decoration:underline}
.prevadzka{margin-top:3vw}
.mapa{display:block;width:100%;height:32vw;border:0;margin-top:3vw;background:#d8d8d3}
.popis{margin:2.2vw 0 4vw}
.kontakt .foto{margin-top:0}
.kontakt .foto+.foto{margin-top:3vw}
@media (max-width:1000px){
:root{--pismo:16px}
body::before{background-position:left center}
.znak{display:none}
hr{margin:40px 0}
p{margin-bottom:18px}
h1,.ako-h1{font-size:25px;margin-bottom:22px}
.logo{left:14px;top:12px}
.logo img{width:clamp(210px,40vw,330px)}
.otvor{right:18px;top:24px}
.otvor img{width:46px}
.uvod{padding:140px 20px 40px}
.citat{width:100%;margin:0}
.uvod hr{width:100%;margin:60px 0 40px}
.uvod h1{font-size:clamp(26px,5vw,38px);margin:0;text-align:center}
.blok{display:block;min-height:0}
.b-obr,.vlavo .b-obr,.vpravo .b-obr,.blok:nth-of-type(n) .b-obr{position:static;width:100%;margin:0}
.b-text,.vlavo .b-text,.vpravo .b-text{width:auto;margin-left:0;padding:24px 20px 44px}
.b-text h2{font-size:21px;margin-bottom:12px}
.b-text li{margin-bottom:8px}
.anim .vlavo:not(.vidno) .b-text>*{transform:translateX(70px)}
.anim .vpravo:not(.vidno) .b-text>*{transform:translateX(-70px)}
.anim .blok:not(.vidno) .zoznam li span{transform:translateX(90px)}
.zoznam{margin-top:12px}
.zoznam a{gap:18px;min-height:46px}
.zoznam img{width:32px;height:32px}
.siroka{width:auto;margin:10px 20px 44px}
.sluzby{width:auto;padding:0 20px 70px;gap:44px 24px}
.sluzby li{width:min(220px,42vw)}
.s-ikona{height:54px;margin-bottom:14px}
.sluzby h2{font-size:17px;margin-bottom:12px}
.sluzby li:nth-child(-n+3) h2{min-height:0}
.stlpec{width:auto;padding:130px 20px 60px}
.foto{margin-top:28px}
.stlpec hr{margin:44px 0}
.prevadzka,.mapa{margin-top:32px}
.mapa{height:340px}
.popis{margin:22px 0 40px}
.kontakt .foto+.foto{margin-top:28px}
}