@import url("fonts.css?v=1bd036ea");

:root{
  --krem:#F6F0E8;      /* stena, podklad */
  --krem-2:#EFE5D8;    /* plochy */
  --krem-3:#E4D5C2;    /* linky */
  --cokolada:#3B2620;  /* text, tmavé plochy */
  --cokolada-2:#5A3F35;/* tlmený text */
  --med:#85592E;       /* akcent: text na kréme 5,35:1, na krem-2 4,87:1 */
  --med-svetly:#D9B98F;/* akcent na čokoláde */
  --med-hlboky:#6E4622;/* tlačidlá, hover */
  --biela:#FFFDF9;
  --doplnit:#8A4B00;
  --doplnit-bg:#FFF1D6;
  --serif:'Cormorant',Georgia,'Times New Roman',serif;
  --sans:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
  --prst:44px;
  --nav-h:68px;
  --wrap:72rem;
  --gut:clamp(1rem,4vw,2.5rem);
  --r:14px;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{font-size:clamp(15px,.45vw + 13px,19px);scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--krem);color:var(--cokolada);font-family:var(--sans);font-weight:400;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.08;margin:0;letter-spacing:-.01em}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.tel{font-family:var(--sans);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;min-height:var(--prst);display:inline-flex;align-items:center;background:var(--cokolada);color:var(--krem);padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem}
:focus-visible{outline:3px solid var(--med);outline-offset:3px;border-radius:4px}

/* doplniť — viditeľná medzera, nie vynechanie */
.doplnit,.karta .doplnit,.dom .doplnit,.sekcia .doplnit{display:inline-block;font-family:var(--sans);font-size:.78rem;font-weight:500;line-height:1.35;color:var(--doplnit);background:var(--doplnit-bg);border:1px dashed var(--doplnit);border-radius:6px;padding:.15rem .5rem;margin:.15rem 0;letter-spacing:0;text-transform:none}
.doplnit::before{content:"doplniť · ";font-weight:600}

/* ---------- navigácia ---------- */
.nav{position:sticky;top:0;z-index:50;height:var(--nav-h);background:rgba(246,240,232,.97);border-bottom:1px solid var(--krem-3)}
.nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav__logo{display:inline-flex;align-items:center;min-height:var(--prst)}
.nav__logo img{height:34px;width:auto}
.nav__links{display:flex;align-items:center;gap:.2rem;list-style:none;margin:0;padding:0}
.nav__links a{display:inline-flex;align-items:center;min-height:var(--prst);padding:0 .7rem;text-decoration:none;font-size:.92rem;color:var(--cokolada);border-radius:999px}
.nav__links a:hover{background:var(--krem-2)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--prst);padding:.55rem 1.3rem;border-radius:999px;font-family:var(--sans);font-weight:500;font-size:.95rem;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
.btn--plny{background:var(--cokolada);color:var(--krem)}
.btn--plny:hover{background:var(--med-hlboky);color:#fff}
.btn--obrys{border-color:var(--cokolada);color:var(--cokolada);background:transparent}
.btn--obrys:hover{background:var(--cokolada);color:var(--krem)}
.nav__links a.btn--plny{color:var(--krem);margin-left:.4rem;padding:0 1.1rem}
.nav__links a.btn--plny:hover{background:var(--med-hlboky);color:#fff}
.nav__menu{display:none;min-height:var(--prst);min-width:var(--prst);border:0;background:transparent;color:var(--cokolada);font:inherit;font-size:.92rem;align-items:center;gap:.5rem;cursor:pointer;border-radius:999px;padding:0 .6rem}
.nav__menu span{display:block;width:20px;height:2px;background:currentColor;position:relative}
.nav__menu span::before,.nav__menu span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor}
.nav__menu span::before{top:-6px}.nav__menu span::after{top:6px}
@media (max-width:860px){
  .nav__menu{display:inline-flex}
  .nav__links{display:none}
  .nav__links.otvorene{display:flex;flex-direction:column;align-items:center;position:fixed;inset:var(--nav-h) 0 auto 0;background:var(--krem);padding:1rem var(--gut) 1.5rem;border-bottom:1px solid var(--krem-3);box-shadow:0 18px 30px rgba(59,38,32,.12)}
  .nav__links.otvorene a{font-size:1.1rem;padding:0 1.2rem}
  .nav__links.otvorene a.btn--plny{margin:.6rem 0 0}
}

/* ---------- hero ---------- */
.hero{min-height:calc(100svh - var(--nav-h));display:flex;align-items:center;padding-block:clamp(1.5rem,4vh,3rem)}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.5rem,4vw,4rem);align-items:center;width:100%}
.hero__nadpis{font-size:clamp(2.6rem,min(6.2vw,9.6vh),5.6rem);line-height:1.04}
.hero__nadpis em{display:block;font-style:italic;font-weight:500;color:var(--med)}
.eyebrow{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--med);font-weight:500;margin-bottom:1.1rem;display:block}
.hero__lead{font-size:clamp(1rem,min(1.5vw,2.3vh),1.2rem);max-width:34rem;margin:clamp(1rem,2.5vh,1.6rem) 0 clamp(1.2rem,3vh,2rem);color:var(--cokolada-2)}
.hero__cta{display:flex;flex-wrap:wrap;gap:.7rem}
.hero__fakty{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin-top:clamp(1.2rem,3vh,2rem);font-size:.88rem;color:var(--cokolada-2);list-style:none;padding:0}
.hero__fakty b{color:var(--cokolada);font-weight:600}
.hviezda{width:.9em;height:.9em;display:inline-block;vertical-align:-.08em;fill:var(--med)}
/* fotka v ráme štítu strechy — podpis celej stránky */
.stit{position:relative;justify-self:center;width:min(100%,26rem,calc((100svh - var(--nav-h) - 4.5rem)/1.62));margin:0}
.stit__strecha{display:block;width:100%;height:auto;margin-bottom:-2px}
.stit__ram{aspect-ratio:3/3.6;width:100%;border-radius:0 0 calc(var(--r)*1.2) calc(var(--r)*1.2);overflow:hidden;background:var(--krem-2);border:2px solid var(--cokolada);border-top:0}
.stit__ram img{width:100%;height:100%;object-fit:cover}
.stit__popis{font-size:.78rem;color:var(--cokolada-2);margin-top:.5rem;text-align:center}
@media (max-width:860px){
  .hero{min-height:auto}
  .hero .wrap{grid-template-columns:1fr}
  .stit{width:min(100%,20rem)}
  .hero__nadpis em{display:inline}
  .stit__ram{aspect-ratio:4/3.4}
}

/* ---------- sekcie ---------- */
.sekcia{padding-block:clamp(3.5rem,9vw,7rem)}
.sekcia__hlava{max-width:44rem;margin-bottom:clamp(2rem,4vw,3rem)}
.sekcia h2{font-size:clamp(2.1rem,4.4vw,3.6rem)}
.sekcia__hlava p{color:var(--cokolada-2);font-size:1.05rem;margin-top:1rem}
.tmava{background:var(--cokolada);color:var(--krem)}
.tmava .eyebrow{color:var(--med-svetly)}
.tmava .sekcia__hlava p{color:#E8DCCB}

/* ---------- dom: adresár za dverami ---------- */
.dom__strecha{display:block;width:100%;height:auto;color:var(--cokolada);margin-bottom:-1px}
.dvere{list-style:none;margin:0;padding:clamp(1.2rem,3vw,2rem);display:grid;grid-template-columns:1fr;gap:1.1rem;border:2px solid var(--cokolada);border-top:0;border-radius:0 0 var(--r) var(--r);background:var(--krem-2)}
@media (min-width:640px){.dvere{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1080px){.dvere{grid-template-columns:repeat(3,minmax(0,1fr))}}
.karta{position:relative;min-width:0;background:var(--biela);color:var(--cokolada);border:1.5px solid var(--krem-3);border-radius:999px 999px var(--r) var(--r);padding:2.6rem 1.4rem 1.4rem;display:flex;flex-direction:column;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.karta:hover{transform:translateY(-4px);box-shadow:0 18px 34px -18px rgba(59,38,32,.35);border-color:var(--med)}
.karta__cislo{position:absolute;top:.9rem;left:50%;transform:translateX(-50%);font-family:var(--sans);font-size:.72rem;letter-spacing:.18em;color:var(--med);font-weight:500}
.karta h3{font-size:1.75rem;text-align:center;margin-bottom:.35rem}
.karta__kto{text-align:center;font-size:.92rem;color:var(--cokolada-2);margin-bottom:1rem;min-height:1.6em}
.karta ul{list-style:none;margin:0 0 1rem;padding:0;font-size:.92rem;color:var(--cokolada)}
.karta ul li{padding:.32rem 0;border-bottom:1px dotted var(--krem-3)}
.karta ul li:last-child{border-bottom:0}
.karta__pozn{font-size:.85rem;color:var(--cokolada-2);margin-bottom:1rem}
.karta__kontakt{margin-top:auto;display:flex;flex-direction:column;gap:.5rem}
.karta__kontakt .btn{width:100%}
.karta__hodiny{font-size:.82rem;color:var(--cokolada-2);text-align:center;margin:.4rem 0 0}
.karta--otazka{background:transparent;border-style:dashed;border-color:var(--med)}
.dom__pata{font-size:.9rem;color:var(--cokolada-2);margin-top:1.2rem;max-width:46rem}

/* ---------- príbeh domu ---------- */
.pribeh .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.pribeh__foto{border-radius:var(--r);overflow:hidden;border:1px solid rgba(217,185,143,.35)}
.pribeh__foto img{width:100%;aspect-ratio:3/2;object-fit:cover}
.pribeh figcaption{font-size:.8rem;color:#E8DCCB;padding:.6rem .2rem 0}
.pribeh blockquote{margin:0 0 1.4rem;font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.2;font-style:italic;color:var(--krem)}
.pribeh blockquote footer{font-family:var(--sans);font-style:normal;font-size:.82rem;color:var(--med-svetly);margin-top:.7rem;letter-spacing:.06em}
.cisla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2rem;border-top:1px solid rgba(217,185,143,.35);padding-top:1.4rem}
.cisla b{display:block;font-family:var(--serif);font-size:clamp(2rem,3.6vw,2.8rem);font-weight:600;color:var(--med-svetly);line-height:1}
.cisla b .tel{font-family:var(--sans);font-weight:500;font-size:.8em}
.cisla span{font-size:.85rem;color:#E8DCCB}
@media (max-width:860px){.pribeh .wrap{grid-template-columns:1fr}}

/* ---------- poukážky ---------- */
.poukazka{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.listok{position:relative;background:var(--biela);color:var(--cokolada);border:2px solid var(--cokolada);border-radius:var(--r);padding:clamp(1.6rem,3vw,2.4rem);box-shadow:10px 10px 0 var(--krem-3)}
.listok::before,.listok::after{content:"";position:absolute;top:50%;width:26px;height:26px;border-radius:50%;background:var(--krem);border:2px solid var(--cokolada);transform:translateY(-50%)}
.listok::before{left:-15px;clip-path:inset(0 0 0 50%)}
.listok::after{right:-15px;clip-path:inset(0 50% 0 0)}
.listok img{width:3.2rem;margin-bottom:1rem}
.listok h3{font-size:2rem}
.listok p{color:var(--cokolada-2);font-size:.95rem;margin:.6rem 0 0}
.listok__suma{font-family:var(--serif);font-size:clamp(2.2rem,4vw,3rem);font-weight:600;color:var(--med);margin-top:1rem;line-height:1}
@media (max-width:860px){.poukazka{grid-template-columns:1fr}}

/* ---------- recenzie ---------- */
.recenzie__pas{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gut) 1.2rem;scroll-padding-inline:var(--gut);margin-inline:calc(50% - 50vw);padding-left:max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)));scroll-padding-left:max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)));list-style:none;margin-block:0;scrollbar-width:thin}
.recenzie__pas>li{flex:0 0 min(22rem,82vw);scroll-snap-align:start;display:flex}
.recenzia{width:100%;background:var(--biela);color:var(--cokolada);border:1px solid var(--krem-3);border-radius:var(--r);padding:1.5rem;display:flex;flex-direction:column;margin:0}
.recenzia blockquote{margin:0 0 1rem;font-family:var(--serif);font-size:1.3rem;line-height:1.3}
.recenzia figcaption{margin-top:auto;font-size:.85rem;color:var(--cokolada-2)}
.recenzie__google{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1.4rem}
.recenzie__google b{font-family:var(--serif);font-size:2.4rem;line-height:1}

/* ---------- kontakt ---------- */
.kontakt .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.kontakt h2{margin-bottom:1rem}
.kontakt dl{margin:1.5rem 0;display:grid;grid-template-columns:auto 1fr;gap:.6rem 1.4rem;font-size:.98rem}
.kontakt dt{color:var(--med);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;padding-top:.2rem}
.kontakt dd{margin:0}
.kontakt dd a{display:inline-flex;align-items:center;min-height:var(--prst)}
.hodiny{list-style:none;margin:0;padding:0;font-size:.95rem}
.hodiny li{display:flex;justify-content:space-between;gap:1rem;padding:.35rem .7rem;border-radius:8px}
.hodiny li.dnes{background:var(--krem-2);font-weight:500}
.hodiny li.dnes span:first-child::after{content:" · dnes";font-size:.78rem;color:var(--med);font-weight:500}
.mapa{border-radius:var(--r);overflow:hidden;border:2px solid var(--cokolada);background:var(--krem-2);aspect-ratio:4/3.4}
.mapa iframe{width:100%;height:100%;border:0;display:block}
@media (max-width:860px){.kontakt .wrap{grid-template-columns:1fr}}

/* ---------- päta ---------- */
.pata{background:var(--cokolada);color:#E8DCCB;padding-block:3rem 6rem;font-size:.9rem}
.pata .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem;align-items:flex-start}
.pata img{height:56px;width:auto}
.pata a{display:inline-flex;align-items:center;min-height:var(--prst);color:var(--krem);text-decoration-color:rgba(217,185,143,.5)}
.pata ul{list-style:none;margin:0;padding:0}
@media (min-width:861px){.pata{padding-bottom:3rem}}

/* ---------- mobilná lišta ---------- */
.lista{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;gap:.5rem;padding:.6rem var(--gut) calc(.6rem + env(safe-area-inset-bottom));background:var(--krem);border-top:1px solid var(--krem-3)}
.lista .btn{flex:1}
@media (max-width:860px){.lista{display:flex}}

/* ---------- pohyb ---------- */
@media (prefers-reduced-motion:no-preference){
  .js .vynor{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
  .js .vynor.je{opacity:1;transform:none}
  .js .strecha-kresli path{stroke-dasharray:101;stroke-dashoffset:101;transition:stroke-dashoffset 1.6s cubic-bezier(.6,.1,.2,1)}
  .js .strecha-kresli.je path{stroke-dashoffset:0}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.karta,.btn{transition:none}}
[id]{scroll-margin-top:calc(var(--nav-h) + 1rem)}