/* Hero sekcia */
.hero { position: relative; height: 100vh; min-height: 600px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 1rem; }
.hero-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(0.65); }
.hero-content { position: relative; z-index: 2; max-width: 800px; margin: auto; color: var(--text-color); }
.hero-logo { width: 200px; margin-bottom: 1rem; filter: brightness(1.2); }
.hero-title { font-size: 2rem; font-weight: 700; margin-bottom: 0.75rem; }
.reviews { display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin-bottom: 2rem; }
.stars { display: flex; gap: 0.25rem; font-size: 1.5rem; }
.stars > svg {
  fill: #FFD60A;
}
.service-img {
  margin-top: 1em;
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 12px;
}

.service-img > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#grey-star { fill: #666;}
.count { font-size: 1rem; color: var(--subtext); }
.buttons { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center;}
.btn {text-decoration: none;}
/* Services sekcia */
.service-header {max-width: 1200px; margin-inline: auto; margin-block: 0 2em;}
.services { padding: 4rem 2rem; }
.services-container { display: flex; gap: 2rem; max-width: 1200px; margin: auto; }
.service-menu { flex: 1; display: flex; flex-direction: column; gap: 1rem; }
.service-menu button { background: var(--menu-bg); color: var(--text-color); border: none; padding: 1rem; text-align: left; font-size: 1rem; cursor: pointer; transition: background 0.3s, color 0.3s; border-radius: 4px; }
.service-menu button:hover, .service-menu button.active { background: var(--accent); color: #fff; }
.service-content { flex: 2; padding: 0 1rem; }
.content-panel { display: none; }
.content-panel.active { display: block; }
/* Realizácie sekcia */

/* Responsive pre sekcie */

@media (max-width: 768px) {
  .services-container { flex-direction: column; }
  .service-content { margin-top: 2rem; padding: 0; }
}