
/* NS beauty – modern, clean, elegant */
:root{
  --bg-overlay: rgba(255,255,255,.75);
  --text: #1a1a1a;
  --muted: #4b4b4b;
  --accent: #e1c6d8; /* soft blush */
  --accent-2: #d9c5f0; /* soft lilac */
  --card-bg: rgba(255,255,255,.9);
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --radius: 16px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background: #fff;
  min-height:100%;
  background-image: linear-gradient(var(--bg-overlay), var(--bg-overlay)), url('../assets/bg.png');
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* aby pozadí zůstalo na místě při scrollování */
}

.container{max-width:1100px;margin:0 auto;padding:0 20px}

.hero {
  min-height: auto;            /* bylo 82vh – pryč */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  position: relative;
  padding-top: 80px;           /* vzdálenost od navigace */
  padding-bottom: 16px;        /* malá mezera pod fotkou */
  gap: 16px;                   /* mezera mezi logem a fotkou */
}

.hero-photo { margin-bottom: 0; }
.photo-sestra {
  max-width: 280px;
  width: 100%;
  height: auto;
  border-radius: 0;
  box-shadow: none;
}


.brand{
  display:flex;
  flex-direction: column;      /*  nové: logo nad textem */
  align-items:center;
  gap:8px;                     /* menší mezera */
  justify-content:center;
  padding:0;
  background: none;
  backdrop-filter: none;
  border-radius: 0;
  box-shadow: none;
}

.brand-logo{ height:82px; width:auto; }   /*  volitelné, hezká velikost */
.subtitle{ margin-top:2px; color:var(--muted); text-align:center; }

.hero-cta{margin-top:22px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.button{
  border:none;cursor:pointer;
  padding:12px 18px;border-radius:999px;
  box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
  background:#fff;
}
.button.primary{background:var(--accent);}
.button:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(0,0,0,.1)}

header.navbar{
  position:sticky;top:0;z-index:10;
  background: rgba(255,255,255,.9);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid #eee;
}
.navbar .inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.nav-left{display:flex;align-items:center;gap:12px}
.nav-left img{height:32px;width:auto}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center}
nav a{color:var(--text);text-decoration:none;font-weight:500}
nav a:hover{opacity:.8}
.lang-toggle{margin-left:8px}

.section { padding: 56px 0; }             /* globálně trochu menší */
#about.section { padding-top: 20px; }     /* první sekci extra stáhnout dolů */

.section h2{
  font-family:"Playfair Display", Georgia, serif;
  font-size:32px;margin:0 0 16px 0;
}
.lead{color:var(--muted);max-width:70ch}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.card{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.card h3{margin:0 0 6px 0;font-size:20px}
.card p{margin:0;color:var(--muted)}

.cenik {
  margin-top: 18px;
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  padding: 8px 16px !important;  /* menší horní a spodní padding */
}

.cenik .pricing {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.cenik .pricing h3:first-child {
  margin-top: 8px !important;  /* jen malá mezera nahoře */
}

.cenik .note {
  margin-bottom: 4px !important; /* menší mezera pod textem dole */
}
/* Zmenšíme mezery kolem ceníku */
#services.section {
  padding-top: 20px !important;   /* místo 56px */
  padding-bottom: 20px !important;
}

.cenik {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}



.gallery{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;margin-top:18px
}
.gallery img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  border-radius: 14px;
  box-shadow: var(--shadow);
  transform: scale(1);
  transition: transform 0.4s ease, box-shadow 0.4s ease, filter 0.4s ease;
}

.gallery img:hover {
  transform: scale(1.15); /* zvětší se o 15 % */
  box-shadow: 0 18px 45px rgba(0,0,0,0.2);
  filter: brightness(1.05); /* lehce rozjasní fotku */
  z-index: 2;
}

/* --- Lupa overlay na galerii --- */
.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
}





.table{
  width:100%;border-collapse:separate;border-spacing:0;
  box-shadow:var(--shadow);border-radius:var(--radius);overflow:hidden;background:#fff
}
.table th,.table td{padding:14px 16px;text-align:left;border-bottom:1px solid #f0f0f0}
.table tr:last-child td{border-bottom:none}
.table th{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#000;font-weight:600}

  .contact-list p {
    font-size: 0.95rem;
    margin: 6px 0;
  }


@media (max-width: 768px) {
  .contact .card-solid {
    width: 100%;
    padding: 16px;
  }

  .contact-list strong {
    width: auto;   /* odstraní fixní šířku */
    display: block; /* název (Instagram, Telefon...) nad odkazem */
    margin-bottom: 2px;
  }

  .contact-list a {
    display: block; /* odkaz pod textem */
    word-break: break-word;
  }
}

.contact-list a:hover {
  text-decoration: underline;
}



.card-solid{
  display:flex;
  flex-direction:column;
 height: auto;
  width:100%;             /* natáhne se na výšku gridu */
}

.socials{
  margin-top:auto;         /* odkazy spadnou k dolnímu okraji */
}

.card-solid{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.socials a{display:inline-block;margin-right:10px}

footer{
  padding:28px 0;color:var(--muted);font-size:14px;border-top:1px solid #eee;
  background: #fff;
}
footer .inner{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

.fade-in{opacity:0;transform:translateY(12px);transition:opacity .6s ease, transform .6s ease}
.fade-in.visible{opacity:1;transform:none}

@media (max-width: 980px){
  .cards{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .contact{grid-template-columns:1fr}
  .brand h1{font-size:34px}
}
@media (max-width: 560px){
  .cards{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .brand{padding:18px}
  .brand img{height:58px}
}

.pricing {
  margin-top: 24px;
}

.pricing h3 {
  margin-top: 32px;
  margin-bottom: 12px;
  font-size: 1.2rem;
  color: var(--primary);
  border-bottom: 1px solid #ddd;
  padding-bottom: 4px;
}

.pricing ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* --- CENÍK: podporuje řádky se i bez .li-main --- */

/* základ: mezery + oddělovací linka pod každou položkou */
.pricing li{
  padding: 8px 0;
  border-bottom: 1px dotted #ddd;
}

/* STARÝ formát (bez .li-main):
   <li><span>text</span><span class="price">...</span></li> */
.pricing li:not(:has(.li-main)){
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

/* NOVÝ formát (s poznámkou):
   <li>
     <div class="li-main">… <span class="price">…</span></div>
     <div class="note-sub">(...)</div>
   </li> */
.pricing li:has(.li-main){
  display: block;                /* samotné li je blok */
}
.pricing li:has(.li-main) .li-main{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

/* cena napravo vždy na jednom řádku */
.price{
  white-space: nowrap;
  font-weight: 600;
  color: var(--accent);
}

/* text v závorce pod hlavním řádkem */
.note-sub{
  font-size: .9rem;
  color: var(--muted);
  font-style: italic;
  margin-top: 4px;
  padding-left: 2px;
  border-bottom: none;           /* jistota, aby se nepodtrhával */
}

/* Lightbox overlay */
.lightbox {
  display: none; /* skryté, dokud se neotevře */
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
  justify-content: center;
  align-items: center;
}

.lightbox-content {
  max-width: 90%;
  max-height: 90%;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.6);
}

.lightbox .close {
  position: absolute;
  top: 20px;
  right: 30px;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
}

.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  cursor: zoom-in; /* kurzor ve stylu lupy */
}

.map-container {
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.location-grid {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  align-items: flex-start;
  background: #fff;              /* bílý podklad */
  border-radius: var(--radius);  /* zaoblené rohy */
  box-shadow: var(--shadow);     /* jemný stín */
  padding: 18px;
}

.map-wrapper, .photo-wrapper {
  flex: 1; /* obě půlky stejné */
}

.photo-wrapper img {
  width: 100%;
  border-radius: 12px;
  box-shadow: var(--shadow);
  transform: scale(1);
  transition: transform 0.4s ease, box-shadow 0.4s ease, filter 0.4s ease;
  cursor: zoom-in; /* kurzor jako lupa */
}

.photo-wrapper img:hover {
  transform: scale(1.15); /* zvětšení jako u galerie */
  box-shadow: 0 18px 45px rgba(0,0,0,0.2);
  filter: brightness(1.05);
  z-index: 2;
}

@media (max-width: 768px) {
  .location-grid {
    flex-direction: column;
    gap: 12px; /* menší mezery */
  }

  .map-wrapper iframe,
  .photo-wrapper img {
    width: 100%;
    height: auto;
  }
}


.note {
  margin-top: 12px;
  font-size: 0.9rem;
  color: var(--muted);
  font-style: italic;
  text-align: right;
}

/* CENÍK – mobilní zobrazení */
@media (max-width: 560px) {
  .li-main {
    flex-direction: column;
    align-items: flex-start;
  }
  .price {
    margin-top: 4px;
    align-self: flex-end; /* cena zůstane vpravo dole */
  }
  .note-sub {
    margin-left: 0; /* aby nebyla useklá */
  }
}

/* TABULKA pracovní doby */
@media (max-width: 560px) {
  .table th, 
  .table td {
    padding: 8px;
    font-size: 0.9rem;
    text-align: left;
  }
  .table th {
    font-size: 1rem;
  }
}

/* Skryj burger na desktopu */
.burger {
  display: none;
  font-size: 28px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text);
}

/* Mobilní styl */
@media (max-width: 768px) {
  nav ul {
    display: none;
    flex-direction: column;
    background: #fff;
    position: absolute;
    top: 60px; /* pod navbar */
    right: 20px;
    width: 200px;
    padding: 10px;
    box-shadow: var(--shadow);
    border-radius: var(--radius);
    z-index: 99;
  }

  nav ul.show {
    display: flex;
  }

/* Burger menu */
/* --- Burger menu --- */
.burger {
  display: none;
  font-size: 28px;
  cursor: pointer;
  user-select: none;
}

#nav-links {
  display: flex;
  align-items: center;
}

@media (max-width: 768px) {
  .burger {
    display: block; /* burger se ukáže */
    color: var(--text);
    padding: 8px;
    border-radius: 6px;
  }

  #nav-links {
    display: none; /* defaultně skryté */
    position: absolute;
    top: 60px; /* pod header */
    right: 20px;
    background: #fff;
    box-shadow: var(--shadow);
    border-radius: var(--radius);
    flex-direction: column;
    gap: 12px;
    padding: 16px 20px;
    z-index: 999;
  }

  #nav-links.show {
    display: flex; /* zobrazí se při kliknutí */
  }

  #nav-links ul {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 0;
  }

  #nav-links a,
  #nav-links button {
    color: var(--text);
    text-decoration: none;
    font-weight: 500;
  }
}






