/* Kozmetický salón Bea — tokeny sú tie isté ako na /brand */
:root{
  --cream-50:#FBF7F2; --cream-100:#F6EFE6; --cream-200:#EDE2D4; --cream-300:#DCCBB8;
  --ink-900:#2B2220; --ink-700:#4A3C38; --ink-600:#6B5B55;
  --claret-800:#5E2130; --claret-700:#7A2E3A; --claret-500:#A2485A; --claret-100:#F1DDDF;
  --peach-300:#E9B8A4;
  --serif:'Bodoni Moda', 'Times New Roman', serif;
  --sans:'Hanken Grotesk', 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 + 13.4px, 19px);scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream-100);color:var(--ink-900);font-family:var(--sans);font-size:1rem;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(1.9rem, 3.6vw, 3rem)}
p{margin:0}
.wrap{max-width:74rem;margin:0 auto;padding-inline:clamp(1.1rem, 4vw, 2.5rem)}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.6rem 1rem}
:focus-visible{outline:2px solid var(--claret-700);outline-offset:3px}
section[id]{scroll-margin-top:var(--nav-h)}

.eyebrow{font-size:.74rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--claret-700);margin-bottom:1rem}
.eyebrow--light{color:var(--peach-300)}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--prst);padding:.7rem 1.4rem;border-radius:999px;font-weight:600;font-size:.95rem;text-decoration:none;border:1.5px solid transparent;transition:background .25s,color .25s,border-color .25s,transform .25s}
.btn--primary{background:var(--claret-700);color:#fff}
.btn--primary:hover{background:var(--claret-800)}
.btn--ghost{border-color:var(--ink-900);color:var(--ink-900);background:transparent}
.btn--ghost:hover{background:var(--ink-900);color:var(--cream-100)}
.link{display:inline-flex;align-items:center;min-height:var(--prst);color:var(--claret-700);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}
.link:hover{color:var(--claret-800)}

/* doplniť — vysoká špecificita, aby ju neprebil žiadny komponent */
body .doplnit{display:inline-block;background:#FFE9A8;color:#4A3500;border:1.5px dashed #B07D00;border-radius:6px;padding:.35rem .6rem;font:600 .82rem/1.45 var(--sans);letter-spacing:0;text-transform:none}
.note{margin-top:2rem}

/* NAV */
.nav{position:sticky;top:0;z-index:50;background:var(--cream-100);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.is-scrolled{border-bottom-color:var(--cream-300)}
.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);margin-right:auto}
.nav__logo img{height:46px;width:auto}
.nav__links{display:flex;gap:1.6rem}
.nav__links a{display:inline-flex;align-items:center;min-height:var(--prst);text-decoration:none;font-weight:500;font-size:.95rem}
.nav__links a:hover{color:var(--claret-700)}
.nav__burger{display:none;width:var(--prst);height:var(--prst);border:0;background:transparent;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:7px}
.nav__burger span{display:block;width:24px;height:2px;background:var(--ink-900);transition:transform .25s}
.nav__burger[aria-expanded="true"] span:first-child{transform:translateY(4.5px) rotate(45deg)}
.nav__burger[aria-expanded="true"] span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
.menu{position:absolute;top:var(--nav-h);left:0;right:0;background:var(--cream-50);color:var(--ink-900);border-bottom:1px solid var(--cream-300);display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:1rem 1.2rem 1.6rem;box-shadow:0 18px 30px -18px rgba(43,34,32,.35)}
.menu a{display:flex;align-items:center;justify-content:center;min-height:48px;text-decoration:none;font-size:1.1rem;font-weight:500}
.menu a.btn--primary{color:#fff;margin-top:.6rem;padding-inline:1.6rem}

/* HERO */
.hero{min-height:calc(100svh - var(--nav-h));display:flex;align-items:center;padding-block:clamp(1.5rem, 5vh, 4rem);overflow:hidden}
.hero__in{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(2rem, 5vw, 5rem);align-items:center;width:100%}
.hero__text{min-width:0}
.hero h1{font-size:clamp(2.4rem, min(5.6vw, 9.2vh), 5.2rem);line-height:1.04;margin-bottom:clamp(1rem, 3vh, 1.6rem)}
.hero h1 em{font-style:italic;color:var(--claret-700)}
.lead{font-size:clamp(1.02rem, 1.2vw, 1.2rem);color:var(--ink-700);max-width:34rem}
.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:clamp(1.3rem, 4vh, 2.2rem)}
.hero__proof{margin-top:clamp(1rem, 3vh, 1.6rem);font-size:.95rem;color:var(--ink-600)}
.hero__proof a{display:inline-flex;align-items:center;min-height:var(--prst);text-decoration:none}
.hero__proof strong{color:var(--ink-900);margin-right:.35rem}
.hero__mark{margin:0;position:relative;justify-self:center;width:min(100%, 26rem)}
.hero__mark::before{content:"";position:absolute;inset:6% 2% 6% 10%;border-radius:50%;background:radial-gradient(closest-side, var(--claret-100), rgba(241,221,223,0));z-index:-1}
.profil{width:100%;height:auto;display:block;max-height:62vh}
.profil__fill{fill:var(--claret-700)}
.profil__line{fill:none;stroke:var(--claret-700);stroke-width:.5;stroke-dasharray:1;stroke-dashoffset:0;opacity:0}
.hero__mark figcaption{margin-top:1rem;text-align:center;font-family:var(--serif);font-style:italic;font-size:1rem;color:var(--ink-600)}

/* podpisový moment: obrys sa nakreslí, potom sa doplní výplň — len s JS a bez reduced-motion */
@media (prefers-reduced-motion: no-preference){
  .js .profil__line{opacity:1;stroke-dashoffset:1;animation:kresli 2.2s .3s cubic-bezier(.6,.1,.3,1) forwards}
  .js .profil__fill{opacity:0;animation:vypln 1s 2.1s ease forwards}
  .js .vynor{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease}
  .js .vynor.is-in{opacity:1;transform:none}
}
@keyframes kresli{to{stroke-dashoffset:0}}
@keyframes vypln{to{opacity:1}}

/* SECTIONS */
.sec{padding-block:clamp(4rem, 9vw, 7.5rem)}
.sec--tint{background:var(--cream-50);color:var(--ink-900)}
.sec__head{max-width:40rem;margin-bottom:clamp(2.2rem, 5vw, 3.5rem)}
.sec__lead{margin-top:1rem;color:var(--ink-700);font-size:1.08rem}

.list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;border-top:1px solid var(--cream-300)}
.list li{padding:1.5rem 0 1.6rem;border-bottom:1px solid var(--cream-300);display:grid;grid-template-columns:3rem 1fr;grid-template-rows:auto 1fr;align-content:start;column-gap:.6rem;min-width:0}
.list__n{font-family:var(--serif);font-style:italic;color:var(--claret-700);font-size:1.1rem;line-height:1.5;grid-row:span 2}
.list h3{font-size:1.45rem;line-height:1.2}
.list p{color:var(--ink-600);margin-top:.35rem;font-size:.97rem}

@media (min-width:800px){.list{grid-template-columns:repeat(3, 1fr);column-gap:2.5rem}}

/* BAND — kozmetika */
.band{background:var(--ink-900);color:var(--cream-100);padding-block:clamp(4rem, 9vw, 7rem)}
.band__in{display:grid;gap:2.5rem}
.band h2{color:var(--cream-100)}
.band__p{margin-top:1rem;color:var(--cream-200);max-width:30rem}
.brands{list-style:none;margin:0;padding:0;font-family:var(--serif);font-style:italic;font-size:clamp(1.6rem, 3vw, 2.5rem);line-height:1.2;border-top:1px solid rgba(233,184,164,.35)}
.brands li{padding:.55rem 0;border-bottom:1px solid rgba(233,184,164,.35);display:flex;align-items:baseline;gap:1rem}
.brands li::before{content:"";width:.32rem;height:.32rem;border-radius:50%;background:var(--peach-300);flex:none;transform:translateY(-.3em)}
@media (min-width:980px){.band__in{grid-template-columns:1fr 1.3fr;align-items:end}.band .note{grid-column:1 / -1}}

/* RECENZIE */
.rev__head{display:grid;grid-template-columns:auto 1fr;gap:clamp(1.2rem, 4vw, 3rem);align-items:center;margin-bottom:clamp(2.2rem, 5vw, 3.5rem)}
.rev__score{display:flex;align-items:flex-start;font-family:var(--serif);color:var(--claret-700);line-height:.9}
.rev__num{font-size:clamp(4.5rem, 10vw, 8rem);font-weight:500}
.rev__star{font-size:clamp(1.6rem, 3vw, 2.4rem);margin-left:.2rem;margin-top:.4rem}
.rev__head h2{font-size:clamp(1.6rem, 2.8vw, 2.4rem);max-width:30rem}
.rev__head .link{margin-top:.4rem}
.quotes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:1.2rem}
.quotes li{background:var(--cream-50);color:var(--ink-900);border-radius:4px;padding:1.8rem 1.6rem 1.4rem;border-top:3px solid var(--claret-700);display:flex;flex-direction:column;min-width:0}
.quotes blockquote{margin:0;flex:1}
.quotes blockquote p{font-family:var(--serif);font-size:1.3rem;line-height:1.35}
.quotes__who{margin-top:1.2rem;font-size:.85rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-600)}
@media (min-width:860px){.quotes{grid-template-columns:repeat(3, 1fr)}}

/* OBJEDNANIE */
.book{display:grid;gap:3rem;align-items:center}
.book__text h2{margin-bottom:1.2rem}
.book__text > p:not(.eyebrow){color:var(--ink-700);max-width:30rem}
.bigtel{display:inline-flex;align-items:center;min-height:var(--prst);margin-top:1.4rem;font-family:var(--serif);font-size:clamp(2.2rem, 5vw, 3.8rem);color:var(--claret-700);text-decoration:none;line-height:1.1}
.bigtel:hover{color:var(--claret-800)}
.book__mail{margin-top:.6rem;color:var(--ink-600)}
.book__mail a{display:inline-flex;align-items:center;min-height:var(--prst);color:var(--claret-700);font-weight:600}
.photo-slot{margin:0}
.photo-slot__box{aspect-ratio:4/3;border:1.5px dashed var(--cream-300);background:var(--cream-100);display:grid;place-items:center;border-radius:4px}
.photo-slot__box img{width:22%;opacity:.25}
.photo-slot figcaption{margin-top:.8rem}
@media (min-width:860px){.book{grid-template-columns:1.2fr .8fr}}

/* KONTAKT */
.contact{display:grid;gap:2.5rem}
.contact__who{margin-top:.6rem;font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--ink-600)}
.contact__dl{margin:0;display:grid;grid-template-columns:1fr;gap:1.6rem}
.contact__dl dt{font-size:.74rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--claret-700);margin-bottom:.3rem}
.contact__dl dd{margin:0;font-size:1.05rem}
@media (min-width:640px){.contact__dl{grid-template-columns:repeat(2, 1fr)}}
@media (min-width:980px){.contact{grid-template-columns:.8fr 1.2fr}}

/* FOOTER */
.foot{background:var(--ink-900);color:var(--cream-200);padding-block:3rem 6rem;font-size:.92rem}
.foot__in{display:grid;gap:1.6rem;align-items:start}
.foot img{height:60px;width:auto}
.foot a{display:inline-flex;align-items:center;min-height:var(--prst);color:var(--cream-100)}
@media (min-width:860px){.foot__in{grid-template-columns:1fr 1fr 1fr}.foot{padding-bottom:3rem}}

/* mobilná lišta s telefónom */
.callbar{position:fixed;left:.8rem;right:.8rem;bottom:.8rem;z-index:40;display:flex;align-items:center;justify-content:center;min-height:52px;border-radius:999px;background:var(--claret-700);color:#fff;font-weight:600;text-decoration:none;box-shadow:0 10px 24px -10px rgba(43,34,32,.55);transform:translateY(160%);transition:transform .35s ease}
.callbar.is-on{transform:none}

@media (max-width:859px){
  .nav__links,.nav__cta{display:none}
  .nav__burger{display:flex}
  .hero__in{grid-template-columns:1fr}
  .hero__mark{order:-1;width:clamp(6.5rem, 30vw, 9rem);justify-self:start}
  .hero__mark figcaption{display:none}
  .profil{max-height:none}
}
@media (min-width:860px){.callbar{display:none}}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.callbar{transition:none}}