/* === ZÁKLAD === */
:root {
  --bg: #0d0e10;
  --panel: #141518;
  --card: #1a1b1f;
  --text: #f0f0f0;
  --muted: #a0a0a0;
  --primary: #e63946;
  --accent: #ff4d5a;
  --radius: 12px;
  --transition: 0.2s ease;
  --shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  font-size: 16px;
  scroll-behavior: smooth;
}

.container { width: 90%; max-width: 1200px; margin: 0 auto; }
.section  { padding: 56px 0; }                    /* kompaktnejšie sekcie */
h2 { font-size: 1.75rem; margin-bottom: 16px; }
h3 { font-size: 1.15rem; margin-bottom: 6px; }

/* === HLAVIČKA (FIX) === */
.site-header{
  position: sticky; top: 0; z-index: 100;
  background:#0c0d0f; border-bottom:1px solid #191a1d; padding:0;
}
.site-header .nav{
  height: 64px; display:flex; align-items:center; justify-content:space-between;
}

.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--text)}
.brand-logo{width:36px;height:36px;border-radius:50%;object-fit:cover}
.brand-text{font-weight:700;font-size:1.3rem;color:var(--text)}

/* MENU (bez „bodiek“) */
.menu{
  position: static; display:flex; align-items:center; gap:24px; white-space:nowrap; list-style:none;
}
.menu *::marker{content:""}
.menu a{
  display:inline-flex; align-items:center; padding:6px 0;
  color:var(--muted); font-weight:500; font-size:.95rem; text-decoration:none;
}
.menu a:hover{ color:var(--text); }

/* „Kontakt“ ako obyčajný link */
.nav-cta{
  color:var(--muted); font-weight:500; font-size:.95rem;
  border:none; padding:6px 0; border-radius:0; background:none;
}
.nav-cta:hover{ color:var(--text); background:none; }

/* HAMBURGER */
.hamburger{ display:none; flex-direction:column; justify-content:center; width:26px; height:22px; gap:4px; background:none; border:none; cursor:pointer; }
.hamburger span{ background:var(--text); height:2px; width:100%; border-radius:2px }

/* === HERO (kompaktnejší) === */
.hero{
  padding:56px 0 22px; background:#0f1013; border-bottom:1px solid #15171b; overflow:hidden;
}
.hero-grid{ display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:28px; }
.hero-copy h1{ font-size:2.7rem; font-weight:800; line-height:1.2; margin-bottom:10px; }
.lead{ color:var(--muted); margin-bottom:20px; }

.hero-art{ position:relative; min-height:240px; display:flex; justify-content:flex-end }
.hero-logo{
  max-width:520px; width:90%; height:auto;
  opacity:.35; filter:brightness(1.4) contrast(1.45); mix-blend-mode:lighten; pointer-events:none;
}

/* === TLAČIDLÁ === */
.btn{ display:inline-block; padding:10px 24px; border-radius:var(--radius); font-weight:600; cursor:pointer; transition:all var(--transition); text-align:center; border:1px solid transparent }
.btn-primary{ background:var(--primary); color:#fff; box-shadow:var(--shadow) }
.btn-primary:hover{ background:var(--accent); transform:translateY(-2px) }
.btn-dark{ background:#1c1c1f; color:var(--text); border:1px solid #2a2c31 }
.btn-dark:hover{ background:#2a2c31 }

/* === SLUŽBY (menšie medzery, väčšie ikony) === */
.cards{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:18px; margin-top:16px;
}
.card{
  background:var(--card); padding:20px; border-radius:var(--radius);
  border:1px solid #222328; transition:all var(--transition); text-align:left
}
.card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:#2b2d33 }

.icon{
  width:82px; height:82px; border-radius:14px; display:grid; place-items:center; margin-bottom:10px;
  background:#1c1d22; border:1px solid #2a2c31;
}
.icon svg{ width:42px; height:42px; fill:#fff; opacity:.95 }
.card p{ color:var(--muted) }

/* === RIEŠENIA === */
#riesenia{ font-size:.95rem; line-height:1.55 }
#riesenia h2{ font-size:1.7rem }
#riesenia h3{ color:var(--accent); font-weight:600; font-size:1.05rem; margin-bottom:4px }

/* === KONTAKT FORM === */
.contact-card{ background:var(--card); padding:24px; border-radius:var(--radius); box-shadow:var(--shadow); border:1px solid #222328 }
.contact-form label{ display:block; margin-bottom:10px; font-weight:600; color:var(--text) }
.contact-form input,.contact-form textarea{
  width:100%; padding:9px; border-radius:8px; border:1px solid #2a2c31; background:#121317; color:var(--text); margin-top:4px
}
.contact-form input:focus,.contact-form textarea:focus{ outline:none; border-color:#3b3d45; box-shadow:0 0 0 4px rgba(255,255,255,.06) }
.contact-form button{ width:100%; margin-top:8px }
.form-status{ font-size:.9rem; margin-top:8px; text-align:center; min-height:1.2em }
.form-status.success{ color:#38d39f }
.form-status.error{ color:#ff6b6b }

/* === BLOG – karta + odkazy + sociálne === */
.blog-card{
  background:var(--panel); border:1px solid #1f2126; border-radius:14px; padding:20px 24px;
  box-shadow:0 12px 26px rgba(0,0,0,.3);
}
.links{ margin:0 0 12px 18px }
.links li{ margin-bottom:6px }
.links a{ color:#d8dbe2; text-decoration:none; border-bottom:1px dashed #2f3239 }
.links a:hover{ color:#fff; border-color:var(--primary) }

.contact-inline p{ margin:6px 0 }
.contact-inline a{ color:#d7d8de; border-bottom:1px dashed #30323a }
.contact-inline a:hover{ color:#fff; border-color:var(--primary) }

.socials{ display:flex; gap:10px; margin-top:8px }
.social-icon{
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  border-radius:8px; background:#1a1b20; border:1px solid #2a2c33; color:#ccc; transition:all .2s ease
}
.social-icon:hover{ background:var(--primary); border-color:var(--primary); color:#fff }

/* === FOOTER === */
.site-footer{
  background:#0b0c0f; text-align:center; padding:20px 0; color:#99a0a8; font-size:.9rem; border-top:1px solid #191a1d;
}

/* === GRID + RESPONSIVE === */
.grid-2{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:28px }

@media (max-width: 900px){
  .hero-grid{ grid-template-columns:1fr }
}
@media (max-width: 768px){
  .hero-grid{ grid-template-columns:1fr; text-align:center }
  .hero-copy h1{ font-size:2.1rem }

  .menu{
    display:none; position:absolute; right:20px; top:64px; /* sedí s výškou headeru */
    background:#101114; width:220px; border:1px solid #1e2026; border-radius:12px;
    padding:10px 14px; gap:10px; flex-direction:column;
  }
  .menu.open{ display:flex }
  .hamburger{ display:flex }
  .brand-text{ display:none }
}