:root{
  --c1:#35D86D; /* svetlá zelená */
  --c2:#008980; /* teal */
  --c3:#003844; /* tmavozelená */
  --ink:#0e1320;
  --muted:#64748b;
  --bg:#f6f8fb;
  --card:#ffffff;
  --ring: 0 6px 30px rgba(0,0,0,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--c2);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1200px, 92vw);margin:auto}

/* HEADER */
.site-header{
  position:sticky; top:0; z-index:50;
  background:#fff; border-bottom:1px solid #e8eef5; box-shadow:0 4px 18px rgba(0,0,0,.05);
}
.site-header .wrap{
  display:flex; align-items:center; gap:18px; padding:12px 16px;
}
.brand{display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink)}
.brand img{width:118px; height:auto; display:block}
.site-nav{display:flex; gap:16px; align-items:center; margin-left:auto}
.site-nav a{color:var(--ink); text-decoration:none; padding:8px 10px; border-radius:10px}
.site-nav a:hover{background:#f2f6f9}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 16px; border-radius:12px; border:1px solid rgba(0,0,0,.08); cursor:pointer; font-weight:600}
.btn-primary{background:var(--c3); color:#fff; border-color:transparent}
.btn-primary:hover{filter:brightness(1.05)}
.btn-ghost{background:#fff; color:var(--ink)}
.btn-ghost:hover{background:#f6f8fb}

/* BURGER */
.burger{display:none; width:42px;height:42px;border:0;background:transparent;position:relative}
.burger .bar{position:absolute; left:9px; right:9px; height:2px; background:#111}
.burger .bar:nth-child(1){top:12px} .burger .bar:nth-child(2){top:20px} .burger .bar:nth-child(3){top:28px}

/* HERO */
.hero{
  background: linear-gradient(135deg, var(--c1) 0%, var(--c2) 60%, var(--c3) 100%);
  color:#fff;
  padding: clamp(38px, 8vw, 96px) 0;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.hero .grid{
  display:grid; gap:24px; grid-template-columns: 1.2fr .8fr;
}
.hero h1{
  font-size:clamp(32px, 5.2vw, 56px); line-height:1.1; margin:0 0 12px;
}
.hero p.lead{
  font-size:clamp(16px, 2.4vw, 20px); opacity:.96; margin:0 0 20px;
}
.hero .cta{display:flex; gap:12px; flex-wrap:wrap}

/* site notice (cookies info link) */
.site-note{
  background:#fff; color:#111; border-top:1px solid #e8eef5;
  font-size:14px; padding:10px 0;
}

/* CARDS SECTIONS */
.section{padding:48px 0}
.h2{font-size:clamp(22px,3vw,28px); margin:0 0 14px}
.grid-cards{display:grid; gap:16px; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr))}
.card{
  background:var(--card); border:1px solid #e8eef5; border-radius:16px; padding:18px; box-shadow:var(--ring);
}
.card h3{margin:0 0 6px; font-size:18px}
.card p{margin:0; color:var(--muted)}
.card img{border-radius:12px; margin-bottom:10px}

/* FOOTER */
.site-footer{background:#fff; border-top:1px solid #e8eef5; color:#0b1220; margin-top:40px}
.footer-cols{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); padding:24px 0}
.site-footer a{color:var(--c2)}
.copy{border-top:1px solid #e8eef5; color:#64748b; padding:12px 0; font-size:14px}

/* RESPONSIVE NAV */
@media (max-width: 880px){
  .burger{display:inline-flex}
  .site-nav{display:none; position:absolute; right:16px; top:64px; flex-direction:column; background:#fff; padding:12px; border-radius:14px; border:1px solid #e8eef5; box-shadow:var(--ring)}
  .site-nav.open{display:flex}
  .hero .grid{grid-template-columns: 1fr}
}
/* === BTN PRIMARY OVERRIDE (global) === */
.btn.btn-primary{
  background:#003844;           /* tmavá základná */
  color:#fff;                   /* biely text */
  border:1px solid #003844;
  border-radius:10px;
  padding:10px 14px;
  display:inline-block;
  font-weight:600;
  text-decoration:none;
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .08s ease;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus{
  background:#35D86D;           /* naša zelená pri hovere */
  border-color:#35D86D;
  color:#fff;                   /* necháva biely text aj na zelenej */
}
.btn.btn-primary:active{ transform:translateY(1px); }
/* === BTN PRIMARY OVERRIDE (brand, ensure) === */
.btn.btn-primary:hover,
.btn.btn-primary:focus{
  background:#35D86D;
  border-color:#35D86D;
  color:#fff;
}
.btn.btn-primary:active{ transform:translateY(1px); }
/* active link in main nav */
.site-nav a.active{
  color:#35D86D;           /* tvoja zelená */
  text-decoration:none;
  font-weight:700;
}
