/* ========== SSCC – ČISTÝ ZÁKLAD ========== */

/* Proměnné (barvy, radiusy) */
:root{
  --bg:#0f172a;           /* temné pozadí */
  --bg-soft:#111c34;      /* mírně světlejší */
  --panel:#0f2135;        /* povrch karet */
  --text:#e6e6e6;         /* hlavní text */
  --muted:#9aa7bd;        /* sekundární text */
  --gold:#ffd75e;         /* akcent (nadpisy, prvky) */
  --accent:#4fd1c5;       /* doplňkový akcent (linky, hover) */
  --stroke:rgba(255,255,255,.08);
  --shadow: 0 12px 40px rgba(0,0,0,.35);
  --radius:16px;
}

/* Reset + typografie */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background: radial-gradient(1000px 500px at 50% -400px, #1c2944 0%, #0c1324 40%, var(--bg) 70%);
  color:var(--text);
  font:16px/1.6 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Obecně */
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
img{max-width:100%;display:block}

/* Kontejner */
.container{width:min(1100px,92%);margin:0 auto;padding:24px}

/* Hlavička (nav) */
header{position:sticky;top:0;z-index:40;backdrop-filter: blur(8px)}
header .bar{
  display:flex;gap:24px;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--stroke);
  background:rgba(15,23,42,.35);
}
.brand{display:flex;gap:10px;align-items:center;padding:14px 24px}
.brand strong{font-weight:800;letter-spacing:.5px}
.brand span{color:var(--muted)}
.menu{display:flex;gap:22px;align-items:center;padding-right:24px}
.menu a{opacity:.85}
.menu a[aria-current="page"]{color:var(--gold);opacity:1}
.lang a{opacity:.7}
.lang a[aria-current="page"]{opacity:1}

/* Hero na titulce (pokud použiješ) */
.hero{padding:64px 0}
.hero h1{
  font-size:clamp(28px,4.2vw,44px);
  color:var(--gold);
  margin:0 0 10px 0;
  text-shadow:0 0 8px rgba(0,0,0,.6);
}
.hero p{color:#e6e6e6;margin:0 0 24px 0}

/* Karty/sekce */
.section{padding:24px;margin-block:12px}
.card, .section .card{
  background:linear-gradient(0deg, rgba(0,0,0,.18), rgba(0,0,0,.18));
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  padding:24px;
  box-shadow:var(--shadow);
}
.section h2, .card h2{
  color:var(--gold);
  margin:0 0 10px 0;
  text-shadow:0 0 8px rgba(0,0,0,.4);
}
.section p{color:#e6e6e6}

/* Dlaždice rozcestníku */
.hub{padding:8px 0 24px}
.hub-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:24px;
}
@media (max-width:820px){
  .hub-grid{grid-template-columns:1fr}
}

.tile{
  display:block;
  background:var(--panel);
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  overflow:hidden;
  position:relative;
  min-height:180px;
  transition:transform .15s ease, box-shadow .15s ease;
}
.tile:hover{transform:translateY(-2px); box-shadow:0 20px 60px rgba(0,0,0,.45)}
.tile-body{padding:22px 22px 18px 22px;width:60%}
.tile h3{margin:0 0 6px 0;color:#fff;font-weight:800}
.tile p{margin:0;color:var(--muted)}
.tile-thumb{
  position:absolute; inset:auto 0 0 auto; right:0; top:0; bottom:0;
  width:40%;
  background:rgba(255,255,255,.03);
  background-size:cover; background-position:center;
  filter:saturate(.9) contrast(.95);
  border-left:1px solid var(--stroke);
}

/* Tlačítka */
.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  padding:.66rem 1rem;
  color:#0c1424; font-weight:700;
  background: linear-gradient(180deg, #ffe07a, #f0c74a);
  border-radius:10px;
  border:1px solid rgba(0,0,0,.2);
  box-shadow: 0 6px 16px rgba(0,0,0,.35);
  transition: transform .1s ease, filter .1s ease;
}
.btn:hover{transform:translateY(-1px); filter:saturate(1.05)}

/* „Zpět“ */
.back{display:inline-block;opacity:.85;margin-bottom:10px}
.back:hover{opacity:1}

/* Obrázky v článku/sekci */
figure{margin:0;padding:0}
figure img{border-radius:12px;border:1px solid var(--stroke);box-shadow:var(--shadow)}
figcaption{color:var(--muted);font-size:.95rem;margin-top:6px}

/* Detail projektu (malý layout fix, ať to neskáče doprava) */
.project-article{
  display:grid; gap:24px;
  grid-template-columns: 1fr minmax(340px, 420px);
}
@media (max-width:980px){
  .project-article{grid-template-columns:1fr}
}

/* Patička */
footer{border-top:1px solid var(--stroke); padding:24px; color:var(--muted); text-align:center;}

/* Utility */
.muted{color:var(--muted)}
.center{text-align:center}