/* ==== Reset & tokens ==== */
:root{
  --ink:#0f172a; --ink-2:#334155; --muted:#6b7280; --brand:#0ea5e9; --card:#ffffff;
  --radius:16px; --space:clamp(16px,3vw,28px); --space-sm:clamp(8px,2vw,16px); --max:1120px;
  --h1:clamp(28px,6vw,48px); --h2:clamp(22px,4.5vw,34px); --h3:clamp(18px,3.8vw,22px);
  --lead:clamp(16px,3.8vw,18px); --body:clamp(15px,3.5vw,16px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{font:400 var(--body)/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(100% - 2*var(--space), var(--max));margin-inline:auto}

/* ==== Header / nav ==== */
header{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid #eef2f7;z-index:50}
.navbar{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:10px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{display:block;height:36px;width:auto}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:14px}
nav a{display:block;padding:10px 12px;border-radius:10px;color:var(--ink);font-weight:600;opacity:.9}
nav a:hover{background:#f3f5f8;opacity:1}

/* Mobile menu */
.menu-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid #e5e7eb;border-radius:10px;padding:8px 12px;background:#fff}
#primary-menu{display:none;flex-direction:column;position:absolute;right:4%;top:64px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:8px;width:min(92%,380px);box-shadow:0 16px 32px rgba(2,6,23,.1)}
#primary-menu[aria-hidden="false"]{display:flex}
@media (min-width:900px){
  .menu-toggle{display:none}
  #primary-menu{display:flex!important;position:static;flex-direction:row;border:0;border-radius:0;box-shadow:none;width:auto;padding:0}
}

/* ==== Sections & type ==== */
section{padding:70px 0}
.hero{padding:40px 0;background:linear-gradient(180deg,#f8fafc 0%,#ffffff 100%)}
.tag{display:inline-block;padding:6px 10px;border-radius:999px;background:#e6f6fe;color:#0369a1;font-weight:600;font-size:12px}
h1{font-size:var(--h1);margin:10px 0 12px;line-height:1.1}
.section-title{font-size:var(--h2);margin:0 0 8px}
.section-sub{color:#475569;margin:0 0 28px}
.lead{font-size:var(--lead);color:var(--ink-2);max-width:60ch;margin:0 0 24px}
.media img{width:100%;border-radius:var(--radius)}

/* Grids */
.grid{display:grid;gap:var(--space)}
.grid-2{display:grid;gap:var(--space)}
@media (min-width:860px){
  .grid{grid-template-columns:1.05fr .95fr;align-items:center}
  .grid-2{grid-template-columns:1.1fr .9fr;align-items:center}
}

/* Cards & portfolio */
.cards,.cards2,.portfolio{display:grid;gap:var(--space)}
.cards{grid-template-columns:1fr}
.cards2{grid-template-columns:1fr}
.portfolio{grid-template-columns:1fr 1fr}
@media (min-width:520px){
  .cards{grid-template-columns:1fr 1fr}
  .cards2{grid-template-columns:1fr 1fr}
}
@media (min-width:900px){
  .cards{grid-template-columns:repeat(3,1fr)}
  .cards2{grid-template-columns:repeat(4,1fr)}
  .portfolio{grid-template-columns:repeat(4,1fr)}
}
.card,.item{background:var(--card);border:1px solid #e2e8f0;border-radius:var(--radius);padding:16px;box-shadow:0 8px 20px rgba(2,6,23,.04)}
.card img,.item img{width:100%;border-radius:12px;display:block}

/* CTA & footer */
.cta{background:linear-gradient(180deg,#f8fbff,#f2f7ff);padding:32px;border-radius:var(--radius);margin-top:var(--space);text-align:center}
.cta h2{margin:0 0 8px}
.cta p{color:#475569;max-width:720px;margin:8px auto 24px}
footer{margin-top:40px;border-top:1px solid #eef2f7}
.footer-bottom{border-top:1px solid #eef2f7;margin-top:14px;padding:10px 0;color:#6b7280;font-size:14px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 18px;border-radius:12px;border:1px solid var(--brand);background:var(--brand);color:#fff;min-height:44px;min-width:44px;font-weight:600;text-decoration:none}
.btn.light{background:#f0f9ff;color:#0369a1;border-color:#bae6fd}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(17,24,39,.18)}
.btn:active{transform:translateY(1px)}
@media (max-width:459px){ .btn{width:100%} }

/* Utilities */
.small{font-size:.92em}
.muted{color:var(--muted)}
.sep{border:0;border-top:1px solid #eef2f7;margin:var(--space) 0}
.grid-2{grid-template-columns:1fr}
@media (min-width:900px){ .grid-2{grid-template-columns:2fr 1fr} }

/* Mobile polish */
img[width][height]{height:auto}
.media img,.card img,.item img{aspect-ratio:16/9;object-fit:contain}
@media (max-width:459px){
  nav a{padding:12px 14px}
  .navbar{padding:8px 0}
  .brand img{height:32px}
}
/* Body lock pt. meniu mobil */
.no-scroll{overflow:hidden}