/* ==========================================================================
   BASE — reset, typografie, layout kontejnery, sdílené prvky
   ========================================================================== */

*{ box-sizing:border-box; }

body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:"Public Sans", system-ui, sans-serif;
  font-size:16.5px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--oak); outline-offset:2px; }

/* --- kontejnery --- */
.wrap{ width:min(1180px, 92vw); margin-inline:auto; }
.narrow{ width:min(760px, 92vw); margin-inline:auto; }

/* --- typografie ---------------------------------------------------------
   Display: Big Shoulders Display (nadpisy + wordmark)
   Text a čísla: Public Sans
   Big Shoulders používej VÝHRADNĚ na h1–h3 a wordmark. Nikdy na běžný
   text, popisky, ceny ani tlačítka — v malých velikostech je nečitelný.
   Typové stupně měň tady, ne v jednotlivých sekcích.
   ------------------------------------------------------------------------ */
h1,h2,h3{
  font-family:"Big Shoulders Display", "Arial Narrow", sans-serif;
  font-weight:600;
  text-wrap:balance;
  text-transform:uppercase;
  margin:0;
}
h1{ font-size:clamp(3.2rem,8vw,6.4rem); line-height:.94; letter-spacing:.005em; }
h2{ font-size:clamp(2.4rem,5vw,4rem); line-height:1.0; letter-spacing:.005em; }
h3{ font-size:1.55rem; line-height:1.15; letter-spacing:.01em; }
p{ margin:0; }

.label{
  font-size:.7rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase;
  color:var(--muted);
}
.lead{ font-size:1.09rem; color:var(--ink-2); max-width:56ch; }
.mono{ font-variant-numeric:tabular-nums; }

/* --- LAMELA: opakovaný motiv obložení, použitý jako strukturní prvek ------
   Čtyři vodorovné hranoly s dubovým gradientem a stínem do spáry.
   Je to jediná dekorace na celé stránce — nepřidávej další.
   ------------------------------------------------------------------------ */
.slats{ display:flex; flex-direction:column; gap:4px; padding:0; margin:0; }
.slats span{
  display:block; height:7px; border-radius:1px;
  background:linear-gradient(to bottom, var(--wood-hi) 0px, var(--wood-hi) 1px, var(--wood) 1px, var(--wood) 6px, var(--wood-lo) 6px, var(--wood-lo) 7px);
  box-shadow:0 1px 2px -1px var(--wood-gap);
}
.slats span:last-child{ width:72%; }

/* --- souvislá plocha obkladu přes celou šířku --- */
.lamela-band{
  height:72px;
  background:repeating-linear-gradient(
    to bottom,
    var(--wood-hi) 0px,
    var(--wood) 1px,
    var(--wood) 10px,
    var(--wood-lo) 11px,
    var(--wood-gap) 11px,
    var(--wood-gap) 16px
  );
  box-shadow:inset 0 0 90px rgba(255,255,255,.10);
}
.lamela-band.thin{
  height:9px;
  background:repeating-linear-gradient(
    to bottom,
    var(--wood-hi) 0px,
    var(--wood) 1px,
    var(--wood) 5px,
    var(--wood-lo) 6px,
    var(--wood-gap) 6px,
    var(--wood-gap) 9px
  );
  box-shadow:none;
}

/* --- rytmus sekcí --- */
section{ position:relative; }
.band{ padding:clamp(4.5rem,10vw,8rem) 0; }
.band + .band{ border-top:1px solid var(--line-soft); }
.band.alt{ background:var(--surface); }

.sec-head{
  display:flex; flex-direction:column; gap:1rem;
  margin-bottom:clamp(2.2rem,5vw,3.4rem);
  max-width:64ch;
}
.sec-head .slats{ width:44px; }

/* --- patička --- */
footer{
  padding:3rem 0 3.5rem;
  border-top:1px solid var(--line-soft);
  color:var(--muted);
  font-size:.84rem;
}
.foot{ display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; align-items:center; }