/* ============================================
   PAN KRABIČKA — společná patička
   ============================================
   Jedna patička pro CELÝ web (rozhodnutí 1. 9. 2026). Do té doby existovaly
   čtyři varianty — .footer, .form-footer, .legal-footer a .site-footer — a
   rozcházely se: někde chyběl kontakt, jinde měly odkazy jiné oddělovače.

   Styly jsou tady, a ne v styles.css, protože každá stránka má jiný stylesheet
   (landing.css, form.css, legal.css, nebo jen inline styly). Tenhle soubor se
   přilinkuje ke všem a patička vypadá všude stejně.

   ⚠️ BARVY JSOU NATVRDO, ZÁMĚRNĚ — žádné var(--light) a spol. Tokeny se totiž
   mezi stylesheety rozešly: --light je #f3f5f7 v landing.css, styles.css
   i legal.css, ale #f4f6f8 ve form.css, a /ukazka/, /zeptejse/ a /nakupniseznam/
   nemají tokeny vůbec. Přes proměnné by se patička vykreslila ve třech různých
   odstínech — což je přesně to, co tahle sjednocená patička řeší.
   Hodnoty odpovídají patičce z /jidelnicky/, která je předloha.

   ⚠️ ODKAZY JSOU ABSOLUTNÍ (/jidelnicky/#…), protože stejný kus HTML sedí
   v kořeni i dvě složky hluboko v /jidelnicky/legal/.
   ============================================ */

.site-footer {
  background: #f3f5f7;
  padding: 70px 0 50px;
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
}
.site-footer__grid {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 36px;
}
/* Selektor je zdvojený schválně. Patička se linkuje i na stránky, které mají
   vlastní inline <style> — a tam se stačí trefit do `.site-footer a { color }`,
   což specificitou přebije samotné `.site-footer__logo`. Přesně to se 1. 9. 2026
   stalo na /ukazka/ (logo vyšlo bíle na světlém pozadí) a na /zeptejse/
   a /nakupniseznam/ (vyšlo šedě). */
.site-footer .site-footer__logo {
  display: inline-block;
  font-weight: 900;
  font-size: 28px;
  color: #5346ec;
  letter-spacing: -1px;
  text-decoration: none;
}
.site-footer .site-footer__logo span { color: #5346ec; }
.site-footer__brand p {
  font-size: 14px;
  font-weight: 900;
  color: #0c3b25;
  margin: 18px 0 24px;
  line-height: 1.5;
}
.site-footer__brand small {
  font-size: 12px;
  color: #6b7480;
}
.site-footer__col h4 {
  font-size: 14px;
  color: #5346ec;
  margin: 0 0 18px;
  font-weight: 900;
}
.site-footer .site-footer__col a {
  display: block;
  font-size: 14px;
  color: #2c3138;
  margin-bottom: 12px;
  text-decoration: none;
  transition: color .2s;
}
.site-footer .site-footer__col a:hover { color: #5346ec; }

@media (max-width: 1024px) {
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .site-footer { padding: 40px 0 30px; }
  .site-footer__grid { grid-template-columns: 1fr; padding: 0 16px; }
}