/* Hair Essence — travertín, drevo, mosadz, oválne zrkadlá so svetelnou obručou. */
:root{
  --paper:#FBF8F3; --cream:#F6F0E7; --sand:#EFE5D8; --sand-2:#E4D6C4;
  --esp:#2B201A; --esp-2:#5A4A3E; --line:#D9CBB8;
  --gold:#9C7641; --gold-d:#7A5A2C; --gold-l:#C9A46A; --blush:#E7CFC6;
  --serif:'Fraunces',Georgia,serif; --sans:'Manrope',system-ui,sans-serif;
  --prst:44px; --nav-h:72px;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{font-size:clamp(15px,.45vw + 12.6px,19px);scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--esp);font:400 1rem/1.6 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;margin:0;font-optical-sizing:auto;letter-spacing:-.01em}
h1 em,h2 em{font-style:italic;color:var(--gold-d)}
p{margin:0 0 .8em}
.wrap{width:min(100% - 2.4rem,74rem);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;min-height:44px;display:flex;align-items:center;background:var(--esp);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem}
:focus-visible{outline:2px solid var(--gold-d);outline-offset:3px}
.eyebrow{font:600 .74rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);margin:0 0 .9rem}

/* tlačidlá */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--prst);padding:.7rem 1.4rem;border-radius:999px;font:600 .92rem/1 var(--sans);text-decoration:none;border:1.5px solid transparent;transition:background .25s,color .25s,border-color .25s,transform .25s}
.btn--dark{background:var(--esp);color:var(--cream)}
.btn--dark:hover{background:var(--gold-d);color:#fff}
.btn--line{border-color:var(--esp);color:var(--esp);background:transparent}
.btn--line:hover{background:var(--esp);color:var(--cream)}
.btn:active{transform:translateY(1px)}

/* navigácia */
.nav{position:sticky;top:0;z-index:50;background:var(--cream);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;gap:1.5rem;height:var(--nav-h)}
.nav-logo{display:flex;align-items:center;min-height:var(--prst)}
.nav-logo img{height:46px;width:auto}
.nav-links{display:flex;gap:1.6rem;margin-left:auto}
.nav-links a{text-decoration:none;font-weight:500;font-size:.92rem;min-height:var(--prst);display:inline-flex;align-items:center;position:relative}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:10px;height:1px;background:var(--gold);transform:scaleX(0);transition:transform .3s}
.nav-links a:hover::after{transform:scaleX(1)}
.burger{display:none;margin-left:auto;width:var(--prst);height:var(--prst);border:0;background:none;cursor:pointer;flex-direction:column;justify-content:center;gap:7px;align-items:center}
.burger span{display:block;width:24px;height:1.5px;background:var(--esp);transition:transform .3s}
.burger[aria-expanded="true"] span:first-child{transform:translateY(4.25px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-4.25px) rotate(-45deg)}
.menu{position:absolute;left:0;right:0;top:100%;background:var(--cream);border-bottom:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:1rem 1.2rem 1.6rem;gap:.2rem}
.menu a{text-decoration:none;font-family:var(--serif);font-size:1.35rem;min-height:var(--prst);display:flex;align-items:center}
.menu a.btn{font:600 .95rem var(--sans);margin-top:.8rem;color:var(--cream)}
@media (max-width:960px){.nav-links,.nav-cta{display:none}.burger{display:flex}}
@media (min-width:961px){.menu{display:none!important}}

/* hero */
.hero{min-height:calc(100svh - var(--nav-h));display:flex;align-items:center;background:
  radial-gradient(60rem 40rem at 85% 30%,#F3E4D3 0,transparent 60%),var(--cream);overflow:hidden}
.hero-in{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:clamp(1.5rem,4vh,3.5rem)}
.hero h1{font-size:clamp(2.5rem,min(5.6vw,9.4vh),5.4rem);margin-bottom:clamp(.8rem,2.4vh,1.6rem)}
.hero h1 em{display:block}
.lead{font-size:1.08rem;color:var(--esp-2);max-width:34rem}
.cta{display:flex;flex-wrap:wrap;gap:.7rem;margin:clamp(1rem,3vh,1.8rem) 0 1.1rem}
.proof{font-size:.88rem;color:var(--esp-2);margin:0}
.stars{color:var(--gold-d);letter-spacing:.08em}
.hero-img{position:relative;margin:0;justify-self:center;width:min(100%,26rem,52vh)}
.oval{border-radius:50%/50%;overflow:hidden;aspect-ratio:3/4;position:relative;z-index:1;box-shadow:0 0 0 6px var(--cream)}
.oval img{width:100%;height:100%;object-fit:cover}
.halo{position:absolute;inset:-5%;border-radius:50%;border:2px solid var(--gold-l);box-shadow:0 0 40px 6px rgba(233,196,130,.45),inset 0 0 30px rgba(233,196,130,.35);z-index:0}
@media (prefers-reduced-motion:no-preference){
  .halo{animation:svit 6s ease-in-out infinite}
  @keyframes svit{50%{box-shadow:0 0 60px 12px rgba(233,196,130,.6),inset 0 0 40px rgba(233,196,130,.45)}}
}
@media (max-width:820px){
  .hero-in{grid-template-columns:1fr;text-align:left}
  .hero-img{order:-1;width:min(44%,10rem,22vh);justify-self:start;margin-left:4%}
  .hero h1{font-size:clamp(2.1rem,min(10vw,6.4vh),3.2rem)}
  .lead{font-size:1rem}
}

.band{background:var(--esp);color:var(--cream)}
.band-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.6rem;padding-block:1rem;font-size:.86rem;letter-spacing:.02em}
.band-in span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold-l);margin-right:.6rem;vertical-align:middle}

/* sekcie */
.sec{padding-block:clamp(3.5rem,9vw,7rem)}
.sec--tight{padding-top:0}
.sec--sand{background:var(--sand);color:var(--esp)}
.sec--dark{background:var(--esp);color:var(--cream)}
.sec--dark .eyebrow{color:var(--gold-l)}
.sec--dark h2 em{color:var(--gold-l)}
.sec-h{margin-bottom:clamp(2rem,5vw,3.4rem);max-width:44rem}
.sec-h h2{font-size:clamp(2rem,4.4vw,3.5rem)}
.sec-h .sub{margin-top:1rem;color:var(--esp-2);font-size:1.02rem}
.sec--dark .sec-h .sub{color:#D8CCBE}
.sec-h--row{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;max-width:none;flex-wrap:wrap}
.lnk{font-weight:600;font-size:.92rem;color:var(--gold-d);min-height:var(--prst);display:inline-flex;align-items:center}

/* služby — riadky */
.rows{list-style:none;margin:0;padding:0;display:grid;gap:clamp(2.5rem,6vw,4.5rem)}
.rowx{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:center}
.rowx:nth-child(even){grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.rowx:nth-child(even)>:first-child{order:2}
.rowx figure{margin:0;border-radius:14rem 14rem 1rem 1rem;overflow:hidden;aspect-ratio:4/5;max-height:34rem;background:var(--sand)}
.rowx figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.rowx:hover figure img{transform:scale(1.04)}
.rowx h3{font-size:clamp(1.7rem,3vw,2.4rem);margin:.4rem 0 .9rem}
.rowx p{color:var(--esp-2);max-width:32rem}
.no{font:italic 400 1.1rem var(--serif);color:var(--gold-d)}
.od{font-weight:600;color:var(--esp)!important;border-top:1px solid var(--line);padding-top:.8rem;margin-top:1.2rem}
.drop-art{border-radius:14rem 14rem 1rem 1rem;aspect-ratio:4/5;max-height:34rem;background:var(--esp);display:grid;place-items:center;color:var(--cream)}
.drop-art img{width:26%}
@media (max-width:760px){
  .rowx,.rowx:nth-child(even){grid-template-columns:1fr}
  .rowx:nth-child(even)>:first-child{order:0}
  .rowx figure,.drop-art{max-height:22rem;aspect-ratio:4/4}
}

/* doplniť značky — musia byť vidieť všade */
.sec .doplnit,.k-info .doplnit,p.doplnit,span.doplnit{display:inline-block;background:#FFE08A;color:#3A2A00!important;font:600 .78rem/1.4 var(--sans);padding:.2rem .55rem;border-radius:4px;margin:.4rem 0;border:1px dashed #9A6B00}

/* cenník */
.dlzky{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;max-width:36rem;margin-bottom:1.6rem}
.dlzky button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:.7rem;align-items:center;text-align:left;min-height:var(--prst);padding:.7rem .8rem;border:1.5px solid var(--sand-2);border-radius:14px;background:var(--paper);color:var(--esp);font:inherit;cursor:pointer;transition:border-color .25s,background .25s}
.dlzky svg{grid-row:1/3;width:28px;height:40px;fill:none;stroke:var(--esp-2);stroke-width:1.6}
.dlzky svg .h{fill:var(--gold-l);stroke:none;opacity:.9}
.dlzky svg circle{fill:var(--paper)}
.dlzky b{font:600 .88rem var(--sans)}
.dlzky small{font-size:.78rem;color:var(--esp-2)}
.dlzky button[aria-pressed="true"]{border-color:var(--esp);background:var(--esp);color:var(--cream)}
.dlzky button[aria-pressed="true"] small{color:#E4D8CA}
.dlzky button[aria-pressed="true"] svg{stroke:var(--cream)}
.dlzky button[aria-pressed="true"] svg circle{fill:var(--esp)}
html:not(.js) .dlzky{display:none}
.chips{position:sticky;top:var(--nav-h);z-index:5;display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;background:var(--sand);padding:.6rem 0;margin-bottom:1rem;border-bottom:1px solid var(--sand-2)}
.chips::-webkit-scrollbar{display:none}
.chips a{flex:none;text-decoration:none;font-weight:600;font-size:.84rem;min-height:var(--prst);display:inline-flex;align-items:center;padding:0 1rem;border-radius:999px;border:1px solid var(--sand-2);background:var(--paper);color:var(--esp);transition:background .2s,color .2s}
.chips a.on{background:var(--esp);color:var(--cream);border-color:var(--esp)}
.cen{columns:2 30rem;column-gap:3.5rem}
.kat{break-inside:avoid;margin-bottom:2.4rem;scroll-margin-top:calc(var(--nav-h) + 76px)}
.kat h3{font-size:1.6rem;font-style:italic;color:var(--gold-d);padding-bottom:.6rem;border-bottom:1.5px solid var(--esp);margin-bottom:.2rem}
.kat ul{list-style:none;margin:0;padding:0}
.svc{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--sand-2);min-width:0}
.svc-t{min-width:0}
.svc-t b{display:block;font-weight:600;font-size:.98rem}
.svc-t small{display:block;color:var(--esp-2);font-size:.8rem;line-height:1.45;margin-top:.2rem}
.ps{display:flex;gap:.9rem;flex:none;align-items:flex-start}
.p{display:flex;flex-direction:column;align-items:flex-end;font-weight:700;font-size:.98rem;white-space:nowrap;transition:opacity .25s,color .25s}
.p i{font:500 .68rem var(--sans);color:var(--esp-2);font-style:normal;letter-spacing:.02em}
.cen[data-len="1"] .p[data-l]:not([data-l="1"]),.cen[data-len="2"] .p[data-l]:not([data-l="2"]),.cen[data-len="3"] .p[data-l]:not([data-l="3"]){color:#6F6055;font-weight:500}
.cen[data-len="1"] .p[data-l="1"],.cen[data-len="2"] .p[data-l="2"],.cen[data-len="3"] .p[data-l="3"]{color:var(--esp);box-shadow:inset 0 -2px 0 var(--gold)}
.cen-note{font-size:.84rem;color:var(--esp-2);margin-top:1rem;max-width:48rem}
.cen-note a{font-weight:600;color:var(--gold-d);display:inline-flex;align-items:center;min-height:var(--prst)}
@media (max-width:620px){
  .dlzky button{grid-template-columns:1fr;padding:.6rem .7rem}.dlzky svg{display:none}
  .svc{flex-direction:column;gap:.4rem}
  .ps{justify-content:flex-start;gap:1.2rem}
  .p{align-items:flex-start}
  .js .cen[data-len="1"] .p[data-l]:not([data-l="1"]),.js .cen[data-len="2"] .p[data-l]:not([data-l="2"]),.js .cen[data-len="3"] .p[data-l]:not([data-l="3"]){display:none}
}

/* salón — oblúky */
.arches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.8rem,2vw,1.6rem)}
.arches figure{margin:0;border-radius:50% 50% 1rem 1rem/34% 34% 1rem 1rem;overflow:hidden;aspect-ratio:3/4;box-shadow:0 0 0 1px var(--line)}
.arches figure:nth-child(2){transform:translateY(2.5rem)}
.arches img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.arches{grid-template-columns:repeat(2,minmax(0,1fr))}.arches figure:nth-child(3){display:none}.arches figure:nth-child(2){transform:translateY(1.5rem)}}

/* galéria */
.gal{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.6rem,1.4vw,1rem)}
.gal li{border-radius:1rem;overflow:hidden;aspect-ratio:3/4;background:var(--sand)}
.gal img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.gal{grid-template-columns:repeat(2,minmax(0,1fr))}.gal li:nth-child(n+5){display:none}}

/* odmeny — rebrík bodov */
.rebrik{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 3rem;counter-reset:x}
.rebrik li{display:flex;gap:1.2rem;align-items:baseline;padding:.9rem 0;border-bottom:1px solid rgba(246,240,231,.16)}
.pt{flex:none;width:5.2rem;font:400 1.7rem/1 var(--serif);color:var(--gold-l)}
.pt small{display:block;font:600 .66rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#CDBFAF;margin-top:.3rem}
.nm{color:var(--cream)}
@media (max-width:700px){.rebrik{grid-template-columns:1fr}}

/* poukážky */
.pouk{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:center}
.pouk figure{margin:0;border-radius:50%/40%;overflow:hidden;aspect-ratio:3/4;max-width:24rem}
.pouk img{width:100%;height:100%;object-fit:cover}
.pouk h2{font-size:clamp(2rem,4.4vw,3.4rem);margin-bottom:1rem}
.pouk p{color:var(--esp-2);max-width:28rem}
@media (max-width:700px){.pouk{grid-template-columns:1fr}.pouk figure{max-width:15rem}}

/* recenzie */
.rv-ctrl{display:flex;gap:.5rem}
.rv-b{width:var(--prst);height:var(--prst);border-radius:50%;border:1.5px solid var(--esp);background:transparent;color:var(--esp);font-size:1.1rem;cursor:pointer;transition:background .2s,color .2s}
.rv-b:hover{background:var(--esp);color:var(--cream)}
.rvs{list-style:none;margin:0;display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 1rem;padding-inline:max(1.2rem,calc((100% - 74rem)/2));scroll-padding-inline:max(1.2rem,calc((100% - 74rem)/2));scrollbar-width:thin}
.rv{flex:none;width:min(84vw,24rem);scroll-snap-align:start;background:var(--paper);color:var(--esp);border-radius:1.2rem;padding:1.6rem;display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem}
.rv blockquote{margin:0;font:400 1.08rem/1.5 var(--serif)}
.rv blockquote p{margin:0 0 .4em}
.rv blockquote::before{content:"“";display:block;font:italic 3rem/0.6 var(--serif);color:var(--gold);height:1.2rem}
.rv footer{display:flex;justify-content:space-between;font-size:.84rem;color:var(--esp-2);border-top:1px solid var(--sand-2);padding-top:.8rem}
.rv footer b{color:var(--esp)}

/* kontakt */
.kontakt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.kontakt h2{font-size:clamp(2rem,4.4vw,3.5rem);margin-bottom:1.6rem}
.kontakt dl{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:1rem 1rem;margin:0 0 1.6rem}
.kontakt dt{font:600 .74rem/1.9 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d)}
.kontakt dd{margin:0}
.il{display:inline-flex;align-items:center;min-height:var(--prst);font-weight:600;text-decoration-color:var(--gold);text-underline-offset:4px}
.hod{display:block}
.mapa{position:relative;border-radius:14rem 14rem 1rem 1rem;overflow:hidden;aspect-ratio:4/5;background:var(--sand)}
.mapa img,.mapa iframe{width:100%;height:100%;object-fit:cover;border:0;display:block}
.map-load{position:absolute;left:50%;bottom:1.2rem;transform:translateX(-50%);min-height:var(--prst);padding:.6rem 1.3rem;border-radius:999px;border:0;background:var(--esp);color:var(--cream);font:600 .9rem var(--sans);cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.2}
.map-load small{font-weight:500;font-size:.7rem;color:#D8CCBE}
@media (max-width:760px){.kontakt{grid-template-columns:1fr}.kontakt dl{grid-template-columns:1fr;gap:.2rem}.kontakt dd{margin-bottom:.8rem}.mapa{aspect-ratio:1/1}}

/* päta */
.foot{background:var(--esp);color:#D8CCBE;padding:3rem 0 6rem;font-size:.88rem}
.foot-in{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;align-items:center;justify-content:space-between}
.foot img{height:48px;width:auto}
.foot p{margin:0}
.foot nav{display:flex;gap:1.4rem}
.foot nav a{min-height:var(--prst);display:inline-flex;align-items:center;color:var(--cream)}

/* mobilná lišta */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;grid-template-columns:1fr 1.4fr;gap:.5rem;padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom));background:var(--cream);border-top:1px solid var(--line)}
.mbar a{min-height:var(--prst);display:flex;align-items:center;justify-content:center;border-radius:999px;border:1.5px solid var(--esp);text-decoration:none;font-weight:600;color:var(--esp)}
.mbar a.on{background:var(--esp);color:var(--cream)}
@media (max-width:760px){.mbar{display:grid}.hero{min-height:calc(100svh - var(--nav-h) - 66px)}.hero-in{gap:1.2rem}}

/* odhalenie pri scrollovaní — len s JS a bez reduced motion */
@media (prefers-reduced-motion:no-preference){
  .js .vynor{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
  .js .vynor.in{opacity:1;transform:none}
}
