:root{
  --brand:#155e75;
  --accent:#10b981;
  --bg:#f8fafc;
}

body{
  margin:0;
  font-family:'Montserrat', sans-serif;
  color:#0f172a;
  background:transparent;
}

/*header { padding:16px 20px; border-top-left-radius: 10px; border-top-right-radius: 10px; background:#008374; color:#fff; border-bottom:1px solid #e5e7eb; }*/

h1{
  margin:0 0 4px;
  font-size:1.3rem;
  color:#fff;
  font-family:'Montserrat', sans-serif;
}

.sub{
  color:#777;
  font-size:1rem;
}

main{
  max-width:980px;
  margin:24px auto 40px;
}

/* Ak je header fixed, JS doplní class .nb-fixed-header + CSS premennú --nb-header-offset */
html.nb-fixed-header main{
  padding-top:var(--nb-header-offset, 96px);
}

/* Detail header (title block) */
.detail-header{
  background:#fff;
  border:1px solid rgba(148,163,184,.18);
  border-radius:18px;
  padding:16px 18px;
  box-shadow:0 12px 28px rgba(15,23,42,.05);
}

.detail-header h1{
  margin:0 0 4px;
  font-size:1.55rem;
  line-height:1.12;
  color:#0f172a;
  font-family:'Montserrat', sans-serif;
}

.detail-header .sub{
  margin:0;
  color:#64748b;
  font-size:.95rem;
  line-height:1.45;
}

@media (max-width:576px){
  main{
    padding:0 12px;
    margin:16px auto 34px;
  }

  .detail-header{
    padding:12px 12px;
    border-radius:16px;
  }

  .detail-header h1{
    font-size:1.35rem;
  }
}

.card{
  background:#fff;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(15,23,42,.06);
  border:1px solid rgba(148,163,184,.18);
  padding:22px 22px 18px;
  width:100%;
  margin-top:14px;
}

.label{
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#94a3b8;
  font-weight:700;
}

.tag{
  display:inline-block;
  margin-top:4px;
  padding:4px 8px;
  border-radius:999px;
  background:rgb(0, 131, 116);
  color:#fff;
  font-size:.8rem;
}

.field{
  margin-top:20px;
}

.field + .field{
  padding-top:4px;
}

.field strong{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.82rem;
  font-weight:700;
  text-transform:none;
  letter-spacing:0;
  color:#64748b;
  margin-bottom:8px;
}

.field span,
.field a{
  font-size:1.02rem;
  line-height:1.68;
  font-family:'Montserrat', sans-serif;
}

.field a{
  color:#155e75;
  text-decoration:none;
}

.field a:hover{
  text-decoration:underline;
}

/* Bootstrap Icons – malé ikony pri názvoch polí */
.field-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  color:#94a3b8;
  flex:0 0 auto;
}

.field-icon i.bi{
  font-size:16px;
  line-height:1;
}

.li-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  margin-right:6px;
  color:#fb6000;
  flex:0 0 auto;
}

.li-icon i.bi{
  font-size:16px;
  line-height:1;
}

.btn-row{
  margin-top:24px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 18px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  font-size:.94rem;
  text-decoration:none;
}

/* ===== Header logo (nasabytca.sk) ===== */
.page-header{
  background:#008374;
  color:#fff;
  border-bottom:1px solid #e5e7eb;
}

.page-header .header-inner{
  max-width:1000px;
  margin:0 auto;
  padding:16px 20px;
  display:flex;
  align-items:center;
  gap:14px;
}

.page-header .site-logo{
  width:64px;
  height:64px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);
  text-decoration:none;
  flex:0 0 auto;
}

.page-header .site-logo img{
  width:55px;
  height:55px;
  object-fit:contain;
  display:block;
}

.page-header .header-text h1{
  margin:0 0 4px;
  font-size:1.7rem;
  font-family:'Montserrat', sans-serif;
  color:#fff;
}

.page-header .header-text p{
  margin:0;
  opacity:.95;
}

@media (max-width:576px){
  .page-header .header-inner{
    padding:14px 14px;
  }

  .page-header .site-logo{
    width:46px;
    height:46px;
    border-radius:12px;
  }

  .page-header .site-logo img{
    width:32px;
    height:32px;
  }

  .page-header .header-text h1{
    font-size:1.45rem;
  }
}

.btn-row .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 18px;
  border-radius:999px;
  border:1px solid #435d62;
  background:#435d62;
  color:#ffffff;
  font-size:.94rem;
  font-weight:600;
  text-decoration:none;
  cursor:pointer;
  transition:
    background .15s ease,
    color .15s ease,
    box-shadow .15s ease,
    transform .1s ease;
}

.btn-row .btn:hover{
  background:#2f4b50;
  color:#ffffff;
  box-shadow:0 10px 18px rgba(15,23,42,.10);
  transform:translateY(-1px);
}

.btn-row .btn:focus-visible{
  outline:2px solid #0ea5e9;
  outline-offset:2px;
}

/* Na mobile – nech sú pekne pod sebou cez celú šírku */
@media (max-width:576px){
  .btn-row{
    flex-direction:column;
  }

  .btn-row .btn{
    width:100%;
  }
}

.features-list{
  list-style:none;
  padding-left:0;
  margin:6px 0 0;
}

.features-list li{
  margin-bottom:10px;
  line-height:1.65;
  font-size:.98rem;
  color:#334155;
}

.features-list li::marker{
  content:none;
}

.usp-list,
.mini-list,
.hours-list{
  list-style:none;
  padding-left:0;
  margin:6px 0 0;
}

.usp-list li{
  margin-bottom:10px;
  line-height:1.65;
  font-size:.98rem;
  color:#334155;
}

.btn-primary{
  background:var(--brand);
  color:white;
  border-color:var(--brand);
}

/* Pôvodná single fotka (ak ju ešte niekde použiješ) */
.photo{
  margin-top:16px;
}

.photo img{
  width:100%;
  max-height:260px;
  object-fit:cover;
  border-radius:12px;
}

/* HERO GALÉRIA (nad kartou) */
.hero-gallery{
  margin:10px 0 16px;
  padding:0;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.18);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  background:#fff;
}

/* Safety override, ak by sa hero náhodou renderoval ako <section> */
section.hero-gallery{
  padding:0 !important;
}

.hero-main{
  display:block;
}

.hero-main img{
  width:100%;
  height:clamp(200px, 34vw, 320px);
  object-fit:cover;
  display:block;
}

.hero-thumbs{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  padding:10px;
  background:#f8fafc;
}

.hero-thumb{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:15px;
  border:1px solid rgba(148,163,184,.22);
  height:clamp(120px, 22vw, 170px);
}

.hero-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .25s ease-out;
}

.hero-thumb:hover img{
  transform:scale(1.03);
}

@media (min-width:768px){
  .hero-thumbs{
    padding:12px;
  }
}

/* overlay verzia pre thumb count */
.hero-thumb .hero-more-badge{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:1.1rem;
  color:#fff;
  background:rgba(15,23,42,0.5);
}

.hero-empty{
  height:clamp(200px, 34vw, 320px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  background:rgba(0,0,0,0.03);
  color:#475569;
  text-align:center;
}

.hero-empty-inner{
  display:flex;
  align-items:center;
  gap:12px;
}

.hero-empty-icon i.bi{
  font-size:28px;
  line-height:1;
  color:#0f766e;
}

.hero-empty-title{
  font-weight:800;
}

.hero-empty-sub{
  opacity:.85;
  font-size:.95rem;
  margin-top:2px;
}

/* Fotogaléria (detail) – full grid v detaile (collapsible) */
.gallery-details{
  margin-top:18px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:16px;
  overflow:hidden;
  background:#fff;
}

.gallery-details summary{
  cursor:pointer;
  padding:12px 14px;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  font-size:.96rem;
  color:#334155;
  list-style:none;
}

.gallery-details summary::-webkit-details-marker{
  display:none;
}

.gallery-details[open] summary{
  border-bottom:1px solid rgba(148,163,184,.16);
}

.gallery-details .gallery{
  padding:10px 12px 12px;
  margin-top:0;
}

.back{
  font-size:.95rem;
  margin-bottom:14px;
}

.back a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 13px;
  border-radius:999px;
  background:rgba(251,96,0,.06);
  border:1px solid rgba(251,96,0,.14);
  color:#ea580c;
  font-weight:700;
  text-decoration:none;
  transition:background .15s ease, transform .12s ease;
}

.back a:hover{
  background:rgba(251,96,0,.10);
  transform:translateY(-1px);
  text-decoration:none;
}

/* Späť na mapu – pod hero galériou (bez veľkej medzery, jemný „pill“ vzhľad) */
.back--under-hero{
  margin:0 0 12px;
}

.back--under-hero .back-link{
  padding:8px 12px;
  border-radius:999px;
  background:rgba(251,96,0,.06);
  border:1px solid rgba(251,96,0,.14);
  color:#ea580c;
  font-weight:700;
  text-decoration:none;
}

.back--under-hero .back-link:hover{
  background:rgba(251,96,0,.10);
  text-decoration:none;
}

.back--under-hero .back-link i.bi{
  font-size:1rem;
  line-height:1;
}

.error{
  color:#b91c1c;
  font-size:.95rem;
}

/* RESPONSÍVNA GALÉRIA */
.gallery{
  margin-top:8px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.gallery-item{
  position:relative;
  overflow:hidden;
  border-radius:15px;
}

.gallery-item img{
  width:100%;
  height:100%;
  max-height:220px;
  object-fit:cover;
  display:block;
  transition:transform .25s ease-out;
  border-radius:15px;
}

.gallery-item:hover img{
  transform:scale(1.03);
}

@media (min-width:768px){
  .gallery{
    gap:10px;
  }
}

/* SOCIÁLNE SIETE */
.social-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:6px;
}

.social-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.20);
  background:#f8fafc;
  font-size:.85rem;
  text-decoration:none;
  color:#334155;
  white-space:nowrap;
}

.social-pill .icon{
  font-size:1rem;
  line-height:1;
}

/* ZDIEĽANIE PROFILU SLUŽBY */
.service-share-field{
  margin-top:16px;
}

.service-share-title{
  font-size:.8rem;
  font-weight:700;
  text-transform:none;
  letter-spacing:0;
  color:#64748b;
  margin-bottom:8px;
}

.service-share-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:4px;
}

.share-btn .share-icon{
  width:24px;
  height:24px;
  border-radius:999px;
  background:rgba(255,255,255,.15);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.share-btn .share-icon i{
  font-size:16px;
  line-height:1;
}

.share-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border-radius:999px;
  border:none;
  font-size:.85rem;
  font-weight:500;
  color:#fff;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
  text-decoration:none;
  outline:none;
}

.share-label{
  white-space:nowrap;
}

/* Platformové farby */
.share-fb{ background:#1877f2; }
.share-fb:hover{ background:#145fcb; }

.share-messenger{ background:#0084ff; }
.share-messenger:hover{ background:#0070d8; }

.share-whatsapp{ background:#25d366; }
.share-whatsapp:hover{ background:#1daa55; }

.share-instagram{ background:linear-gradient(135deg, #f58529, #dd2a7b, #8134af); }
.share-instagram:hover{ filter:brightness(0.95); }

.share-copy{ background:#4b5563; }
.share-copy:hover{ background:#374151; }

/* Hover / focus efekty */
.share-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(15,23,42,.12);
}

.share-btn:focus-visible{
  box-shadow:0 0 0 2px #fff, 0 0 0 4px rgba(59,130,246,.8);
}

/* Mobilné zobrazenie – 2 tlačidlá v riadku */
@media (max-width:576px){
  .service-share-buttons{
    gap:6px;
  }

  .share-btn{
    flex:1 1 calc(50% - 6px);
    justify-content:center;
    padding:7px 8px;
  }

  .share-label{
    font-size:12px;
  }
}

/****************
LOGO
*****************/
.service-logo{
  margin-top:10px;
  margin-bottom:10px;
  display:flex;
  justify-content:flex-start;
}

.service-logo img{
  max-width:320px;
  height:auto;
  display:block;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.18);
  background:#fff;
  padding:8px;
  box-shadow:0 6px 18px rgba(15,23,42,.04);
}

/****************
LABELS – BASIC + PREMIUM
*****************/
.labels-row{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  align-items:center;
  margin-top:10px;
}

.basic-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:#f8fafc;
  color:#334155;
  font-size:.79rem;
  font-weight:600;
  border:1px solid rgba(148,163,184,.22);
}

.basic-label .basic-icon{
  font-size:1rem;
  line-height:1;
}

.subtype-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:#435d62;
  color:#fff;
  font-size:.79rem;
  font-weight:600;
  border:1px solid #435d62;
}

.subtype-icon i.bi{
  font-size:1rem;
  line-height:1;
}

.premium-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff8e6;
  color:#92400e;
  font-size:.79rem;
  font-weight:700;
  border:1px solid rgba(245,158,11,.28);
}

.premium-label .premium-star{
  color:#f59e0b;
  font-size:1rem;
  line-height:1;
}

/****************
TAGY / BADGES
*****************/
.tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:6px;
}

.pill-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid rgba(148,163,184,.20);
  font-size:.79rem;
  color:#334155;
}

.badges{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:6px;
}

.badge-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid rgba(148,163,184,.20);
  font-size:.79rem;
  color:#334155;
}

/****************
HOURS / PROCESS / FAQ
*****************/
.hours-list{
  margin:6px 0 0;
  padding-left:18px;
}

.process-list{
  margin:6px 0 0;
  padding-left:18px;
}

.process-list li,
.hours-list li{
  margin-bottom:10px;
  line-height:1.65;
  font-size:.98rem;
  color:#334155;
}

.faq{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:6px;
}

.faq-item{
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  padding:11px 12px;
  background:#fff;
}

.faq-item summary{
  cursor:pointer;
  font-weight:700;
  font-size:.97rem;
  color:#0f172a;
}

.faq-answer{
  margin-top:8px;
  color:#475569;
  line-height:1.6;
}

.muted{
  color:#64748b;
}

/****************
PROMO / DISCOUNT
*****************/
.promo-block{
  margin-top:18px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.promo-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  background:#0f172a;
  color:#fff;
}

.promo-title{
  font-weight:700;
}

.promo-badge{
  background:#facc15;
  color:#422006;
  font-weight:800;
  padding:4px 10px;
  border-radius:999px;
  font-size:.85rem;
}

.promo-body{
  padding:14px;
}

.promo-code-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.promo-code{
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.22);
  background:#fff;
  font-size:1rem;
}

.promo-copy{
  border:none;
  background:#0f766e;
  color:#fff;
  font-weight:700;
  padding:8px 12px;
  border-radius:999px;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .15s ease, filter .12s ease;
}

.promo-note{
  margin-top:8px;
  color:#475569;
  font-size:.9rem;
  line-height:1.55;
}

.promo-terms{
  margin-top:10px;
  border-top:1px dashed rgba(148,163,184,.5);
  padding-top:10px;
}

.promo-terms summary{
  cursor:pointer;
  font-weight:700;
}

.promo-interest{
  margin-top:12px;
  width:100%;
  border:none;
  background:#111827;
  color:#fff;
  font-weight:800;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .15s ease, filter .12s ease;
}

.promo-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:9999;
}

.promo-modal.is-open{
  display:block;
}

.promo-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.55);
}

.promo-modal-card{
  position:relative;
  max-width:520px;
  margin:8vh auto;
  background:#fff;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.35);
  box-shadow:0 20px 50px rgba(15,23,42,.25);
  overflow:hidden;
}

.promo-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  background:#0f172a;
  color:#fff;
}

.promo-modal-title{
  font-weight:900;
}

.promo-modal-sub{
  color:#e2e8f0;
  font-size:.9rem;
  margin-top:4px;
}

.promo-modal-close{
  border:none;
  background:transparent;
  color:#fff;
  font-size:18px;
  cursor:pointer;
}

.promo-steps{
  margin:0;
  padding:14px 22px 0 34px;
  color:#0f172a;
}

.promo-modal-actions{
  padding:14px 16px 16px;
}

.promo-modal-ok{
  width:100%;
  border:none;
  background:#0f766e;
  color:#fff;
  font-weight:800;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .15s ease, filter .12s ease;
}

.promo-interest:hover,
.promo-copy:hover,
.promo-modal-ok:hover{
  transform:translateY(-1px);
}

/* Jemné oddelenie “praktických” info blokov (dostupnosť/cena/objednanie/platba) */
.soft-panel{
  margin:18px 0;
  padding:15px 16px;
  border-radius:16px;
  background:#f8fafc;
  border:1px solid rgba(148,163,184,.16);
}

.field.compact{
  margin:0 0 12px 0;
}

.field.compact:last-child{
  margin-bottom:0;
}

.inline-muted{
  margin-top:6px;
  font-size:.95em;
  color:#64748b;
  line-height:1.55;
}

.pills-row{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:6px;
}

.mini-list{
  margin:8px 0 0;
  padding-left:18px;
}

.mini-list li{
  margin:10px 0;
  line-height:1.65;
  font-size:.98rem;
  color:#334155;
}

.price-row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.price-meter .euro{
  font-weight:700;
  font-size:18px;
}

.price-meter .euro.off{
  opacity:0.25;
}

.price-meter .euro.on{
  opacity:1;
}

/* Ikony v pilloch */
.pill-tag i.bi{
  font-size:.95rem;
  line-height:1;
}

/* Ikony v labeloch (basic/premium) */
.basic-label .basic-icon i.bi,
.premium-label .premium-star i.bi{
  font-size:1rem;
  line-height:1;
}

/* Gastro panel – jemné zvýraznenie */
.gastro-panel{
  background:rgba(255,255,255,0.35);
}

.btn-booking{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  margin-block:7px;
  background-color:#eef2ff;
  color:#334155;
  text-decoration:none;
}

/* Promo modal close button icon */
.promo-modal-close i.bi{
  font-size:18px;
  line-height:1;
}

/* LIGHTBOX (premium fotogaléria) */
.lightbox[hidden]{
  display:none !important;
}

.lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
}

.lightbox-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.72);
  backdrop-filter:blur(2px);
}

.lightbox-dialog{
  position:relative;
  z-index:1;
  width:min(980px, 100%);
  max-height:86vh;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
  background:rgba(2,6,23,.35);
  display:flex;
  align-items:center;
  justify-content:center;
}

.lb-img{
  width:100%;
  height:86vh;
  max-height:86vh;
  object-fit:contain;
  display:block;
  background:rgba(2,6,23,.55);
}

.lb-close{
  position:absolute;
  top:10px;
  right:10px;
  border:0;
  background:rgba(255,255,255,.14);
  color:#fff;
  width:40px;
  height:40px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.lb-close:hover{
  background:rgba(255,255,255,.22);
}

.lb-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  border:0;
  background:rgba(255,255,255,.14);
  color:#fff;
  width:44px;
  height:44px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.lb-nav:hover{
  background:rgba(255,255,255,.22);
}

.lb-prev{
  left:10px;
}

.lb-next{
  right:10px;
}

.lb-counter{
  position:absolute;
  bottom:10px;
  left:50%;
  transform:translateX(-50%);
  background:rgba(2,6,23,.45);
  color:#fff;
  padding:6px 10px;
  border-radius:999px;
  font-size:.85rem;
  border:1px solid rgba(255,255,255,.14);
}

@media (max-width:576px){
  .lb-img{
    height:82vh;
    max-height:82vh;
  }

  .lb-prev{
    left:8px;
  }

  .lb-next{
    right:8px;
  }

  .lb-nav{
    width:40px;
    height:40px;
  }
}

/* Názov + obec (v karte, pod labelmi) */
.service-title{
  margin:14px 0 14px;
}

.service-title .service-name{
  display:inline-block;
  margin-right:8px;
}

.service-name{
  margin:0;
  font-size:1.72rem;
  line-height:1.06;
  font-weight:800;
  color:#0f172a;
  font-family:'Montserrat', sans-serif;
  letter-spacing:-0.01em;
}

.service-meta{
  margin-top:7px;
  color:#64748b;
  font-size:1rem;
  line-height:1.55;
}

/* ============================================================
   WOW: TIERY (Partner / Premium / Základný) + Ribbon
   ============================================================ */
.profile-card{
  position:relative;
  overflow:hidden;
}

/* jemné zvýraznenie podľa tieru – bez "rozbitia" layoutu */
.profile-card.tier-premium{
  border-color:rgba(245,158,11,.40);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}

.profile-card.tier-partner{
  border-color:rgba(21,94,117,.35);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}

/* Ribbon v rohu (iba premium/partner) */
.tier-ribbon{
  position:absolute;
  top:14px;
  right:-44px;
  transform:rotate(35deg);
  padding:8px 56px;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  box-shadow:0 10px 24px rgba(15,23,42,.18);
  border:1px solid rgba(255,255,255,.28);
  z-index:2;
}

.tier-ribbon--premium{
  background:linear-gradient(135deg, #f59e0b, #facc15);
  color:#422006;
}

.tier-ribbon--partner{
  background:linear-gradient(135deg, #155e75, #10b981);
}

/* Partner label pill */
.partner-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:#effcfa;
  color:#155e75;
  font-size:.79rem;
  font-weight:700;
  border:1px solid rgba(16,185,129,.22);
}

.partner-label .partner-icon{
  color:#0891b2;
  font-size:1rem;
  line-height:1;
}

/* Zvýraznené na mape – sekundárny pill */
.mapboost-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff7ed;
  color:#9a3412;
  font-size:.79rem;
  font-weight:700;
  border:1px solid rgba(251,146,60,.25);
}

.mapboost-label .mapboost-icon{
  color:#fb923c;
  font-size:1rem;
  line-height:1;
}

/* ============================================================
   WOW: 2-foto hero galéria (nad kartou) + badge +X
   ============================================================ */
.hero-single img{
  width:100%;
  height:clamp(210px, 34vw, 340px);
  object-fit:cover;
  display:block;
}

.hero-two{
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:10px;
  padding:10px;
  background:#f8fafc;
}

.hero-tile{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:15px;
  border:1px solid rgba(148,163,184,.22);
  height:clamp(170px, 26vw, 260px);
}

.hero-tile--main{
  height:clamp(210px, 34vw, 340px);
}

.hero-tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .18s ease;
}

.hero-tile:hover img{
  transform:scale(1.02);
}

/* badge verzia pre hero-two */
.hero-tile .hero-more-badge{
  position:absolute;
  right:10px;
  bottom:10px;
  padding:6px 10px;
  border-radius:999px;
  font-size:.85rem;
  font-weight:800;
  background:rgba(15,23,42,.78);
  color:#fff;
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(6px);
}

@media (max-width:576px){
  .hero-two{
    grid-template-columns:1fr;
  }

  .hero-tile,
  .hero-tile--main{
    height:220px;
  }
}

/* ============================================================
   WOW: Sticky CTA (mobile)
   ============================================================ */

/* Reserve space for sticky CTA so the last content isn't hidden (incl. iPhone safe-area) */
.has-sticky-cta main{
  padding-bottom:calc(92px + env(safe-area-inset-bottom));
}

/* Fallback: if some layouts use .page-content / .detail-wrap as the main wrapper instead of <main> */
.has-sticky-cta body > .page-content,
.has-sticky-cta body > .detail-wrap{
  padding-bottom:calc(92px + env(safe-area-inset-bottom));
}

.sticky-cta{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:50;
  display:none; /* iba mobile */
  gap:10px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94);
  border-top:1px solid rgba(148,163,184,.22);
  backdrop-filter:blur(10px);
  box-shadow:0 -8px 24px rgba(15,23,42,.06);
}

.sticky-btn{
  flex:1 1 0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 12px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  font-size:.92rem;
  border:1px solid rgba(148,163,184,.45);
  color:#0f172a;
  background:#fff;
  box-shadow:0 8px 20px rgba(15,23,42,.08);
}

.sticky-btn--call{
  background:#0f766e;
  border-color:#0f766e;
  color:#fff;
}

.sticky-btn--nav{
  background:#0f172a;
  border-color:#0f172a;
  color:#fff;
}

.sticky-btn--web{
  background:#155e75;
  border-color:#155e75;
  color:#fff;
}

.sticky-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
}

@media (max-width:768px){
  .sticky-cta{
    display:flex;
  }
}

/* Certifikát link */
.cert-link{
  color:#0f766e;
  font-weight:700;
  text-decoration:underline;
}

.cert-link:hover{
  opacity:.9;
}

/* ============================================================
   BONUS: jemný upgrade teasing (iba pre Základný profil)
   ============================================================ */
.upgrade-teaser{
  margin-top:18px;
  padding:14px 15px;
  border-radius:16px;
  background:#f8fafc;
  border:1px dashed rgba(148,163,184,.28);
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.upgrade-teaser__icon{
  width:34px;
  height:34px;
  border-radius:12px;
  background:rgba(15,118,110,0.10);
  border:1px solid rgba(15,118,110,0.22);
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  color:#0f766e;
}

.upgrade-teaser__icon i.bi{
  font-size:16px;
  line-height:1;
}

.upgrade-teaser__title{
  font-size:.92rem;
  color:rgba(15,23,42,0.86);
  font-weight:600;
  line-height:1.35;
}

.upgrade-teaser__link{
  display:inline-flex;
  margin-top:6px;
  font-size:.9rem;
  font-weight:700;
  color:var(--brand, #155e75);
  text-decoration:none;
}

.upgrade-teaser__link:hover{
  text-decoration:underline;
}

.upgrade-teaser__link:focus-visible{
  outline:2px solid rgba(21,94,117,0.35);
  outline-offset:3px;
  border-radius:10px;
}

.upgrade-teaser__note{
  margin-top:6px;
  font-size:12px;
  opacity:.75;
}

/* ===== VIDEO (detail) ===== */
.nb-video-card{
  margin:16px 0 10px;
  padding:14px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(148,163,184,.18);
  box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.nb-video-card__head{
  margin-bottom:10px;
}

.nb-video-card__title{
  margin:0 0 4px;
  font-size:1.05rem;
  font-weight:900;
  display:flex;
  align-items:center;
  gap:10px;
  color:#0f172a;
}

.nb-video-card__note{
  font-size:.92rem;
  color:rgba(15,23,42,.72);
  line-height:1.5;
}

/* ===== VIDEO (preview button base styles) ===== */
.nb-video-preview{
  position:relative;
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  border-radius:14px;
  overflow:hidden;
}

.nb-video-preview img{
  width:100%;
  display:block;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.20);
}

.nb-video-preview--detail{
  border-radius:14px;
}

.nb-video-frame{
  width:100%;
  aspect-ratio:16/9;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.20);
  background:#000;
}

.nb-video-frame iframe{
  width:100%;
  height:100%;
  display:block;
  border:0;
}

.nb-video-player{
  width:100%;
  display:block;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.20);
  background:#000;
}

.nb-video-fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:180px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.35);
  background:rgba(15,23,42,.04);
  font-weight:900;
}

.nb-video-play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:46px;
  height:46px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.55);
  color:#fff;
  box-shadow:0 10px 22px rgba(0,0,0,.22);
}

.nb-video-play i{
  font-size:22px;
  line-height:1;
}

/* ============================================================
   Náš príbeh (brand story) – zvýraznený blok
   ============================================================ */
.brand-story{
  margin-top:18px;
  padding:14px 15px;
  border-radius:18px;
  background:#ffffff;
  border:1px solid rgba(251,96,0,.16);
  border-left:5px solid #fb6000;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.brand-story__head{
  display:flex;
  align-items:flex-start;
  gap:10px;
}

.brand-story__icon{
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(251,96,0,.12);
  border:1px solid rgba(251,96,0,.22);
  color:#fb6000;
  flex:0 0 auto;
}

.brand-story__icon i.bi{
  font-size:16px;
  line-height:1;
}

.brand-story__title{
  font-weight:900;
  color:#0f172a;
  font-size:1rem;
  line-height:1.2;
}

.brand-story__sub{
  margin-top:3px;
  font-size:.9rem;
  color:#475569;
  line-height:1.5;
}

.brand-story__cta{
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
  font-weight:800;
  background:rgba(251,96,0,0.10);
  border:1px solid rgba(251,96,0,0.26);
  color:#7c2d12;
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.brand-story__cta:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(15,23,42,0.10);
  filter:brightness(0.98);
}

.brand-story__cta:focus-visible{
  outline:2px solid rgba(251,96,0,0.45);
  outline-offset:3px;
}

.brand-story__arrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:999px;
  background:rgba(255,255,255,0.65);
  border:1px solid rgba(251,96,0,0.22);
}

.brand-story__arrow i.bi{
  font-size:16px;
  line-height:1;
}

/* =========================
   NBY – Mikro-štítok (neoverený/overený) + CTA teaser note
   ========================= */
.micro-tier{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.79rem;
  line-height:1;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.18);
  background:#f8fafc;
  color:#475569;
  vertical-align:middle;
  white-space:nowrap;
}

.micro-tier--verified{
  background:#f8fafc;
  color:#475569;
}

@media (max-width:576px){
  .card{
    padding:16px 15px 14px;
    border-radius:16px;
  }

  .brand-story{
    padding:12px 12px;
    border-radius:16px;
  }

  .service-name{
    font-size:1.4rem;
  }

  .service-meta{
    font-size:.96rem;
    line-height:1.55;
  }

  .field{
    margin-top:18px;
  }

  .field strong{
    font-size:.8rem;
    margin-bottom:7px;
  }

  .field span,
  .field a{
    font-size:.98rem;
    line-height:1.62;
  }

  .features-list li,
  .usp-list li,
  .mini-list li,
  .hours-list li,
  .process-list li{
    font-size:.95rem;
    margin-bottom:9px;
  }

  .basic-label,
  .subtype-label,
  .premium-label,
  .partner-label,
  .mapboost-label,
  .pill-tag,
  .badge-item,
  .micro-tier{
    font-size:.76rem;
  }
}