/* Tutasti — společný styl pro všechny stránky */

:root{
  --bg:#131c17;
  --bg-alt:#1a2620;
  --bg-contrast:#eaeee7;
  --tx:#e4eae2;
  --tx-dim:#8b9a8e;
  --tx-dark:#131c17;
  --acc:#c2a24d;
  --acc2:#7fa88a;
  --serif:Georgia,'Times New Roman',serif;
  --sans:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --gap:24px;
  --pad:clamp(20px,5vw,72px);
}

*{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--bg);
  color:var(--tx);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.8;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block;}

a{color:var(--acc);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;}
a:hover{text-decoration-thickness:2px;}
a:focus-visible,
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;}

/* ---------- mřížka ---------- */
.wrap{
  max-width:1320px;
  margin:0 auto;
  padding-left:var(--pad);
  padding-right:var(--pad);
}
.grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:var(--gap);
}

/* ---------- hlavička ---------- */
.site-head{
  border-bottom:1px solid rgba(139,154,142,.28);
  padding:20px 0;
}
.head-inner{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:14px 28px;
}
.brand{
  font-family:var(--serif);
  font-size:24px;
  letter-spacing:.06em;
  color:var(--tx);
  text-decoration:none;
}
.brand span{color:var(--acc);}
.brand:hover{text-decoration:none;}
.site-nav ul{
  list-style:none;
  margin:0;padding:0;
  display:flex;flex-wrap:wrap;
  gap:6px 22px;
}
.site-nav a{
  color:var(--tx-dim);
  text-decoration:none;
  font-size:14px;
  letter-spacing:.05em;
  text-transform:uppercase;
  padding:4px 0;
  display:inline-block;
  border-bottom:2px solid transparent;
}
.site-nav a:hover,
.site-nav a[aria-current="page"]{
  color:var(--tx);
  border-bottom-color:var(--acc);
}

/* ---------- rytmus sekcí ---------- */
.sec{padding:120px 0;}
.sec--tight{padding:56px 0;}
.sec--alt{background:var(--bg-alt);}
.sec--contrast{
  background:var(--bg-contrast);
  color:var(--tx-dark);
}
.sec--contrast .eyebrow{color:#4b6455;}
.sec--contrast .caption{color:#57685c;}
.sec--contrast a{color:#7a6320;}
.sec--contrast h2,
.sec--contrast h3{color:var(--tx-dark);}
.sec--contrast .rule{background:#8a7530;}

/* ---------- typografie ---------- */
h1,h2,h3{font-family:var(--serif);font-weight:400;}

h1{
  font-size:clamp(38px,7.4vw,84px);
  line-height:1.03;
  letter-spacing:-.01em;
  margin:0;
}
h2{
  font-size:clamp(24px,3vw,34px);
  line-height:1.22;
  margin:0 0 20px;
}
h3{
  font-size:19px;
  line-height:1.4;
  margin:32px 0 10px;
  color:var(--acc2);
}
p{margin:0 0 20px;}
p:last-child{margin-bottom:0;}

.eyebrow{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--acc2);
  margin:0 0 18px;
}
.caption{
  font-size:12px;
  line-height:1.6;
  letter-spacing:.08em;
  color:var(--tx-dim);
}
.lead{font-size:19px;line-height:1.75;}

/* oddělovač: 3px, přesně 4 sloupce */
.rule{
  height:3px;
  background:var(--acc);
  border:0;
  margin:0 0 48px;
  width:33.333%;
}
.rule--center{margin-left:auto;margin-right:auto;}
.rule--right{margin-left:auto;}
.rule--top{margin:0 0 40px;}

/* ---------- hero ---------- */
.hero{
  padding:104px 0 0;
  position:relative;
}
.hero-head{position:relative;padding-left:34px;}
.hero-head::before{
  content:"";
  position:absolute;
  left:0;top:6px;bottom:6px;
  width:3px;
  background:var(--acc);
}
.hero-head h1 .l1{display:block;}
.hero-head h1 .l2{display:block;margin-left:8.333%;}
.hero-head h1 .l3{display:block;margin-left:16.666%;}

.hero-intro{
  margin-top:44px;
  grid-column:1 / span 5;
}
.hero-intro p{font-size:18px;}
.topline{
  margin:22px 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  font-size:13px;
  letter-spacing:.06em;
  color:var(--tx-dim);
  text-transform:uppercase;
}
.topline li:not(:last-child)::after{
  content:"/";
  color:var(--acc);
  margin:0 10px;
}

/* hlavní obrázek: 8 z 12 sloupců, vpravo, s přesahem */
.hero-figure{
  margin:72px 0 0;
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:var(--gap);
  align-items:start;
}
.hero-figure .figcap{
  grid-column:1 / span 2;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  justify-self:end;
  margin:0;
  max-height:340px;
}
.hero-figure .shot{
  grid-column:3 / span 10;
  margin-right:calc(var(--pad) * -.6);
}

/* ---------- textové bloky ---------- */
.col-5{grid-column:1 / span 5;}
.col-7{grid-column:1 / span 7;}
.col-7-r{grid-column:6 / span 7;}
.col-9{grid-column:1 / span 9;}
.col-9-r{grid-column:4 / span 9;}
.col-6-r{grid-column:7 / span 6;}
.side{
  grid-column:9 / span 4;
  font-size:14px;
  line-height:1.7;
  color:var(--tx-dim);
  border-top:1px solid rgba(194,162,77,.4);
  padding-top:14px;
}

/* číslovaný checklist */
.steps{
  list-style:none;
  counter-reset:st;
  margin:28px 0 0;
  padding:0;
}
.steps li{
  counter-increment:st;
  position:relative;
  padding:0 0 22px 74px;
  border-bottom:1px solid rgba(139,154,142,.2);
  margin-bottom:22px;
}
.steps li:last-child{border-bottom:0;margin-bottom:0;}
.steps li::before{
  content:counter(st,decimal-leading-zero);
  position:absolute;
  left:0;top:-6px;
  font-family:var(--serif);
  font-size:38px;
  line-height:1;
  color:var(--acc);
}
.steps b{
  display:block;
  font-family:var(--serif);
  font-weight:400;
  font-size:19px;
  color:var(--tx);
  margin-bottom:4px;
}
.sec--contrast .steps li{border-bottom-color:rgba(19,28,23,.16);}
.sec--contrast .steps b{color:var(--tx-dark);}
.sec--contrast .steps li::before{color:#8a7530;}

/* jednoduchý seznam s markerem */
.marks{list-style:none;margin:20px 0 0;padding:0;}
.marks li{
  position:relative;
  padding-left:26px;
  margin-bottom:12px;
}
.marks li::before{
  content:"";
  position:absolute;
  left:0;top:.72em;
  width:12px;height:2px;
  background:var(--acc);
}

/* detailní obrázek v kontrastní sekci */
.detail-grid{align-items:start;}
.detail-figure{
  grid-column:2 / span 4;
  margin:0;
}
.detail-figure .caption{margin-top:12px;}
.detail-text{grid-column:7 / span 6;}

/* dvousloupcový text */
.duo{grid-column:1 / span 9;}
.duo-b{grid-column:5 / span 8;}

/* kontakt */
.contact-box{
  grid-column:1 / span 7;
}
.contact-box .mail{
  font-family:var(--serif);
  font-size:clamp(22px,3.4vw,32px);
  display:inline-block;
  margin-top:8px;
}

/* ---------- vnitřní stránky ---------- */
.page-head{padding:88px 0 0;}
.page-head h1{
  font-size:clamp(32px,5.4vw,60px);
  line-height:1.08;
  max-width:14ch;
}
.page-head .eyebrow{margin-bottom:14px;}
.prose-intro{
  font-size:22px;
  line-height:1.65;
  grid-column:1 / span 9;
  margin-top:36px;
}
.prose{grid-column:1 / span 6;}
.prose h2{margin-top:0;}
.legal-block{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:var(--gap);
  margin-bottom:52px;
}
.legal-block h2{grid-column:1 / span 3;font-size:22px;}
.legal-block .body{grid-column:5 / span 7;}

/* ---------- patička ---------- */
.site-foot{
  border-top:3px solid var(--acc);
  padding:56px 0 64px;
  background:var(--bg-alt);
}
.foot-name{
  font-family:var(--serif);
  font-size:clamp(40px,9vw,104px);
  line-height:1;
  margin:0 0 40px;
  letter-spacing:-.01em;
}
.foot-cols{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:32px var(--gap);
}
.foot-cols ul{list-style:none;margin:0;padding:0;}
.foot-cols li{margin-bottom:8px;}
.foot-cols a{color:var(--tx);text-decoration:none;border-bottom:1px solid rgba(194,162,77,.5);}
.foot-cols a:hover{border-bottom-color:var(--acc);color:var(--acc);}
.foot-note{color:var(--tx-dim);font-size:14px;line-height:1.7;}
.foot-note .mailto{color:var(--acc);}
.foot-bottom{
  margin-top:40px;
  padding-top:18px;
  border-top:1px solid rgba(139,154,142,.25);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--tx-dim);
}

/* ---------- responzivita ---------- */
@media (max-width:1000px){
  .hero-figure .figcap{
    grid-column:1 / span 12;
    writing-mode:horizontal-tb;
    transform:none;
    justify-self:start;
    max-height:none;
    order:2;
    margin-top:12px;
  }
  .hero-figure .shot{grid-column:1 / span 12;margin-right:0;order:1;}
  .col-5,.col-7,.col-7-r,.col-9,.col-9-r,.col-6-r,.side,
  .hero-intro,.duo,.duo-b,.contact-box,
  .detail-figure,.detail-text,
  .prose-intro,.prose{grid-column:1 / span 12;}
  .side{margin-top:28px;}
  .detail-figure{max-width:460px;}
  .legal-block h2,.legal-block .body{grid-column:1 / span 12;}
  .legal-block h2{margin-bottom:12px;}
  .rule{width:56%;}
}

@media (max-width:720px){
  body{font-size:16px;}
  .sec{padding:64px 0;}
  .sec--tight{padding:40px 0;}
  .hero{padding-top:56px;}
  .hero-figure{margin-top:44px;}
  .hero-head{padding-left:20px;}
  .hero-head h1 .l2{margin-left:6%;}
  .hero-head h1 .l3{margin-left:12%;}
  .page-head{padding-top:52px;}
  .prose-intro{font-size:19px;}
  .foot-cols{grid-template-columns:1fr;}
  .steps li{padding-left:0;padding-top:44px;}
  .steps li::before{top:0;font-size:30px;}
  .site-nav ul{gap:6px 16px;}
  .rule{width:72%;}
}