/*
 * Designove tokeny webu Skolniho statku.
 *
 * Barvy a rozmery se piso VYHRADNE sem. V ostatnich souborech uz jen
 * var(--neco) – diky tomu jde cely web preladit z jednoho mista.
 *
 * Paleta vychazi z loga statku: chmelova sistice v zelene a zlutozelene.
 * Podklad je tepla kremova, ne bila – web tim pusobi mekce a prirodne.
 */

:root {
  /* --- Zelena (hlavni barva, odvozena z chmele) --- */
  --zelena-900: #1f3210;
  --zelena-800: #2c4715;
  --zelena-700: #3d6119;
  --zelena-600: #4f7a1f;   /* hlavni odstin pro plochy a tlacitka */
  --zelena-500: #659a28;
  --zelena-400: #7fb43c;
  --zelena-300: #a2cd6a;
  --zelena-200: #c8e2a3;
  --zelena-100: #e4f0cf;
  --zelena-50:  #f2f8e8;

  /* --- Tepla neutralni (podklad) --- */
  --krem-50:  #fdfbf6;
  --krem-100: #f9f5eb;
  --krem-200: #f1ebdc;
  --krem-300: #e4dbc6;
  --krem-400: #cfc3a7;

  /* --- Text --- */
  --text:         #1e2416;
  --text-tlumeny: #5c624f;
  --text-svetly:  #8a907c;
  --bila: #ffffff;

  /* --- Doplnkova (zrala hlavka chmele) --- */
  --zlata-600: #a8761c;
  --zlata-500: #c78f28;
  --zlata-100: #f7ead0;

  /* --- Semanticke --- */
  --pozadi:        var(--krem-100);
  --pozadi-karta:  var(--bila);
  --pozadi-tmavy:  var(--zelena-900);
  --linka:         var(--krem-300);
  --odkaz:         var(--zelena-700);

  /* --- Typografie --- */
  --pismo: "Inter var", "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
           "Helvetica Neue", Arial, sans-serif;

  /* Plynule skalovani: mensi obrazovka = mensi nadpis, bez zlomu */
  --velikost-h1:    clamp(2.1rem, 1.25rem + 3.6vw, 4.1rem);
  --velikost-h2:    clamp(1.65rem, 1.15rem + 2.1vw, 2.7rem);
  --velikost-h3:    clamp(1.25rem, 1.05rem + 0.9vw, 1.6rem);
  --velikost-lead:  clamp(1.08rem, 1rem + 0.5vw, 1.3rem);
  --velikost-text:  1.0625rem;
  --velikost-maly:  0.9375rem;
  --velikost-mini:  0.8125rem;

  --vyska-radku:       1.7;
  --vyska-radku-nadpis: 1.15;

  /* --- Rozmery --- */
  --sirka-obsahu: 75rem;   /* 1200 px – hlavni mrizka */
  --sirka-uzka:   58rem;   /* uzsi blok pro text s obrazky */
  --sirka-textu:  40rem;   /* pohodlna delka radku pro cteni */

  --mezera-1: 0.25rem;
  --mezera-2: 0.5rem;
  --mezera-3: 0.75rem;
  --mezera-4: 1rem;
  --mezera-5: 1.5rem;
  --mezera-6: 2rem;
  --mezera-7: 3rem;
  --mezera-8: 4rem;
  --mezera-9: 6rem;

  /* Svisly rytmus sekci – na mobilu tesnejsi. Pozor, mezi dvema sekcemi je
     tahle hodnota dvakrat (spodni odsazeni jedne + horni odsazeni druhe). */
  --sekce-svisle: clamp(2.75rem, 1.5rem + 4vw, 5rem);
  --okraj-strany: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);

  /* --- Zaobleni --- */
  --radius-s:  0.375rem;
  --radius-m:  0.75rem;
  --radius-l:  1.25rem;
  --radius-xl: 2rem;
  --radius-kruh: 999px;

  /* --- Stiny (mekke, tepleho tonu – ne sedive) --- */
  --stin-s: 0 1px 2px rgb(45 40 20 / 0.06), 0 2px 6px rgb(45 40 20 / 0.05);
  --stin-m: 0 2px 6px rgb(45 40 20 / 0.07), 0 8px 20px rgb(45 40 20 / 0.07);
  --stin-l: 0 6px 16px rgb(45 40 20 / 0.09), 0 20px 44px rgb(45 40 20 / 0.10);

  /* --- Pohyb --- */
  --prechod: 180ms cubic-bezier(0.4, 0, 0.2, 1);
  --prechod-pomaly: 500ms cubic-bezier(0.22, 1, 0.36, 1);

  /* --- Vrstveni --- */
  --nad-hlavicku: 100;
  --nad-vsim: 200;
}