
:root{
  --bg:#f8fbff;
  --card:#ffffff;
  --text:#1f2430;
  --muted:#5c6370;
  --primary:#5b3cc4;
  --accent:#ff7a45;
  --link:#005bbb;
  --ring: rgba(91,60,196,.25);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  display:flex;flex-direction:column;min-height:100vh;
}
.container{max-width:1120px;margin:0 auto;padding:0 20px}
.site-header{
  background:#fff; border-bottom:1px solid #e8eef7;
  position:sticky; top:0; z-index:1000;
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:48px;width:auto;border-radius:8px}
.brand-name{font-weight:700;font-size:1.2rem}
.brand-sub{font-weight:600;color:var(--muted);font-size:.9rem}
.main-nav a{margin:0 10px;text-decoration:none;color:var(--text);font-weight:600;padding:8px 10px;border-radius:8px}
.main-nav a:hover{background:#eef2ff;color:var(--primary)}
.main-nav .cta{background:linear-gradient(90deg,var(--primary),#00c6ff);color:white}
.lang-switch button{
  border:none;background:transparent;font-weight:700;cursor:pointer;padding:6px 8px;border-radius:6px
}
.lang-switch button[aria-pressed="true"]{background:#eef2ff;color:var(--primary)}
.lang-switch .sep{color:#c0c7d4;padding:0 2px}

.hero{padding:56px 0;background:radial-gradient(60% 200% at 90% -10%, #eaf3ff 0%, rgba(234,243,255,0) 60%), linear-gradient(180deg,#ffffff, #f3f7ff)}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.hero h1{font-size:2rem;line-height:1.2;margin-bottom:12px}
.lead{color:var(--muted);font-size:1.1rem;margin-bottom:16px}
.btn{display:inline-block;padding:12px 16px;border-radius:10px;text-decoration:none;font-weight:700;border:none;cursor:pointer}
.btn-primary{background:linear-gradient(90deg,var(--primary),#00c6ff);color:#fff;box-shadow:0 6px 18px rgba(0,102,255,.15)}
.btn-secondary{background:#ffe9e1;color:#b24a1b;border:1px solid #ffd5c4}
.hero-cta .btn{margin-right:10px}
.hero-art{position:relative}
.blob{position:absolute;inset:auto 0 0 auto;width:220px;height:220px;background:radial-gradient(#ffe9e1, #ffd2c3);border-radius:50%;filter:blur(20px);opacity:.7;right:10%;bottom:-20px}
.cards{display:grid;grid-template-columns:1fr;gap:12px}
.cards .card{background:var(--card);border:1px solid #edf1f8;border-radius:12px;padding:16px;box-shadow:0 4px 12px rgba(0,0,0,.04)}

.features{padding:28px 0}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feature,.cat,.card{background:var(--card);border:1px solid #edf1f8;border-radius:12px;padding:16px;box-shadow:0 4px 12px rgba(0,0,0,.04)}
.cta-wide{padding:32px 0}
.cta-inner{background:linear-gradient(90deg,#fff, #eef4ff);border:1px solid #edf1f8;border-radius:16px;padding:24px;text-align:center}

.page-header{padding:28px 0;background:#fff;border-bottom:1px solid #e8eef7}
.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;margin:20px auto}
.info-box{background:#f6f9ff;border:1px dashed #d8e4ff;border-radius:12px;padding:16px}
.team .member{padding:16px}
.team .avatar{height:72px;width:72px;border-radius:50%;background:linear-gradient(45deg,#e9ecff,#fff1e9);margin-bottom:10px}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.categories .cat{text-align:left}

.facts{width:100%;border-collapse:collapse;background:#fff;border:1px solid #edf1f8;border-radius:12px;overflow:hidden}
.facts th,.facts td{padding:12px;border-bottom:1px solid #edf1f8;text-align:left}
.facts th{background:#f6f9ff;width:40%}

.docs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}
.doc-card{padding:16px;border-radius:12px;border:1px solid #edf1f8;background:#fff;
  box-shadow:0 6px 16px rgba(0,0,0,.04)}
.doc-card h4{margin:4px 0 8px}
.doc-card p{color:var(--muted);margin-bottom:12px}
.doc-card a{display:inline-block;text-decoration:none;font-weight:700;color:#fff;padding:10px 14px;border-radius:10px;
  background:linear-gradient(90deg,var(--primary),#00c6ff)}
.doc-card a:hover{filter:saturate(1.1)}

.site-footer{margin-top:auto;background:#ffffff;border-top:1px solid #e8eef7}
.site-footer p{color:var(--muted);padding:16px 0;text-align:center}

@media (max-width: 960px){
  .hero-inner{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .two-col{grid-template-columns:1fr}
  .product-grid{grid-template-columns:1fr}
  .docs{grid-template-columns:1fr}
}

.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;  /* dve rovnaké šírky */
  gap: 20px;                       /* medzera medzi stĺpcami */
  margin-top: 20px;
}

.two-col .facts {
  width: 100%;
}

@media (max-width: 900px) {
  .two-col {
    grid-template-columns: 1fr;    /* na mobiloch pod sebou */
  }
}

.contact-section {
  align-items: flex-start;
}

.contact-form {
  padding: 20px 24px;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-group label {
  font-weight: 600;
}

.contact-info {
  padding: 20px 24px;
}

.contact-info .social {
  margin-top: 10px;
}

.contact-info .social a {
  display: inline-block;
  margin-right: 10px;
  text-decoration: none;
  color: var(--link);
  font-weight: 600;
}

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

@media (max-width: 900px) {
  .form-grid {
    grid-template-columns: 1fr;
  }
}
